/* Preference catalogue. The live table geometry lives in the scene styles. */
.account-layout:has(.customization){grid-template-columns:180px minmax(0,1fr);gap:24px;max-width:1440px}
.account-content:has(.customization){padding:30px;min-width:0}
.customization-intro{max-width:650px;margin-bottom:26px;line-height:1.7}
.customization-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(280px,1fr);gap:28px;align-items:start}
.customization-form,.customization-preview{min-width:0}.customization-form{max-width:none;gap:28px}
.customization-form fieldset{min-inline-size:0}.customization-form legend{font-size:16px;font-weight:650;margin-bottom:16px}
.appearance-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.appearance-choice{position:relative;display:flex;flex-direction:column;cursor:pointer;border:1px solid var(--color-border);border-radius:12px;padding:13px 10px;gap:7px!important;background:#111b19;min-width:0;overflow:hidden}
.appearance-choice:has(input:checked){border-color:var(--color-primary);background:linear-gradient(145deg,#263424,#16231c);box-shadow:inset 0 0 0 1px #d7f75b22}
.appearance-choice:has(input:focus-visible){outline:2px solid var(--color-primary);outline-offset:3px}
.appearance-choice input{position:absolute;top:8px;right:8px;width:16px;height:16px;accent-color:var(--color-primary);z-index:1}
.appearance-choice strong{font-size:12px;line-height:1.4;color:var(--color-text)}
.appearance-choice small{font-size:11px;line-height:1.45;color:var(--color-text-secondary)}
.choice-art{height:76px;width:100%;display:grid;place-items:center;margin:9px 0 5px;font-size:23px;font-weight:850;font-style:italic;color:#c1d5ad55;background:radial-gradient(ellipse at 50% 25%,#286451,#154438);border:6px solid #304139;border-radius:44%;box-shadow:0 3px 0 #060d0a,0 6px 9px #0005,inset 0 0 0 1px #ffffff18,inset 0 6px 9px #0005}
.choice-room{background:radial-gradient(ellipse at 50% 25%,var(--brand-felt,#286451),#102f26);border-color:var(--brand-rail,#304139)}
.choice-onyx{background:radial-gradient(ellipse at top,#38404b,#1b242d);border-color:#303940}
.choice-royal{background:radial-gradient(ellipse at top,#494058,#292438);border-color:#5c5340}
.choice-arena{background:radial-gradient(ellipse at top,#448663,#103e32);border-color:#314936;outline:1px solid #d7f75b44}
.choice-carbon{background:repeating-linear-gradient(45deg,#ffffff07 0 2px,transparent 2px 6px),radial-gradient(ellipse at top,#354340,#182522);border-color:#282e2b}
.choice-deck{display:flex;justify-content:center;align-items:center;gap:4px;box-shadow:none;border:0;border-radius:0;background:none}
.choice-deck .ultra-card{--card-w:36px}.choice-deck .ultra-card:first-child{transform:rotate(-7deg) translateY(2px)}.choice-deck .ultra-card:last-child{transform:rotate(5deg)}
.appearance-selects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.appearance-selects label{font-size:12px}.appearance-selects select{font-size:12px!important;padding:12px!important;min-height:44px;min-width:0;max-width:100%}
.preference-group .preference{padding:14px 0;margin:0;align-items:flex-start!important}.preference-group .preference span{display:flex;flex-direction:column;gap:5px}
.preference-group .preference strong{font-size:13px;font-weight:550}.preference-group .preference small{font-size:12px;font-weight:400}.preference-group>.field-help{font-size:12px}
.volume-control{margin:19px 0;font-size:12px!important}.volume-control>span{display:flex;align-items:center;gap:14px}
.account-form .volume-control input[type=range]{min-height:44px;padding:0;border:0;background:transparent;accent-color:var(--color-primary);cursor:pointer}
.volume-control output{min-width:35px;color:#c8d6b7;font-variant-numeric:tabular-nums;font-size:12px}
.customization .button.secondary{color:var(--color-text)}.customization-save{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.customization-save a{font-size:13px;color:var(--color-primary);min-height:44px;display:inline-flex;align-items:center}
.customization-preview{position:sticky;top:24px;border:1px solid #38493f;border-radius:18px;padding:22px;background:radial-gradient(ellipse at top,#1b2a23,#101719 70%);overflow:hidden}
.preview-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.preview-heading .eyebrow{font-size:9px;letter-spacing:1px}.preview-heading .test-badge{font-size:9px}
.customization-preview h2{font-size:22px!important;margin:14px 0 8px}.customization-preview .preview-selection{font-size:12px!important;color:var(--color-primary);min-height:18px;margin:0 0 10px}
.preview-table{margin:0;padding:0;max-width:none;border:0;border-radius:12px;background:radial-gradient(ellipse at center,#27352a55,transparent 70%)}
.preview-table .poker-arena{position:relative;height:340px;max-width:none}
.preview-table .poker-felt{inset:22px 4px 44px;border-width:13px;border-radius:43%;box-shadow:0 1px 0 1px #b6c4a833,0 6px 0 #101c16,0 10px 0 #080d0a,0 19px 20px -8px #0009,inset 0 0 0 1px #ceddc333,inset 0 14px 24px #0006}
.preview-table-center{position:absolute;inset:64px 0 auto;display:flex;flex-direction:column;align-items:center;gap:14px}
.preview-brand{height:25px;display:grid;place-items:center}.preview-brand img{width:145px;height:30px;object-fit:contain}.preview-brand .table-wordmark{font-size:11px;letter-spacing:2px;margin:0;opacity:.75}
.preview-table-center .board{display:flex;gap:4px;min-height:58px;margin:0}.preview-table .board .ultra-card{--card-w:37px;width:var(--card-w);height:calc(var(--card-w)*1.44)}
.preview-pot{display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:1px}.preview-pot strong{font-size:17px;letter-spacing:0;margin-left:5px}.preview-pot .chip-stack{height:20px}
.preview-table [data-preview-back] .ultra-card{--card-w:30px}
.preview-player{position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:flex;align-items:center;flex-direction:column;gap:5px;width:170px;background:#111a17;border:1px solid #647952;border-radius:10px;padding:9px;box-shadow:0 5px 12px #0005}
.preview-player [data-preview-avatar]{position:absolute;left:9px;top:10px}.preview-player strong,.preview-player small{padding-left:42px;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.preview-player strong{font-size:12px}.preview-player small{font-size:10px;color:#aab79f}
.customization-preview>p{font-size:12px!important;line-height:1.7;margin-top:20px;color:var(--color-text-secondary)}
.preview-motion{border-top:1px solid var(--color-border);padding-top:16px;margin-top:18px}.preview-motion .button{min-height:44px;font-size:12px;padding:10px 14px}.preview-motion p{font-size:11px!important;min-height:32px}
.table-customization-controls{display:flex;gap:10px;align-items:center;margin:8px 0 15px;font-size:10px}.table-customization-controls .text-button{padding:9px 12px;border:1px solid #405041;border-radius:5px;font-size:10px;min-height:36px}.table-customization-controls a{color:#c4d7b3;text-decoration:none}.table-customization-controls [aria-pressed=true]{color:var(--color-primary);border-color:#a3bd62}
[data-rail-style="walnut"] .poker-felt{border-color:#524134}[data-rail-style="brass"] .poker-felt{border-color:#766846}
[data-density="compact"] .player-seat{min-height:64px;padding-bottom:6px}[data-density="compact"] .seat-stack{font-size:13px}[data-density="compact"] .seat-tag{margin-top:3px}[data-effects="off"] .won-pot{animation:none!important}
@media(prefers-reduced-motion:no-preference){.appearance-choice{transition:border-color 150ms,background-color 150ms,transform 150ms}.appearance-choice:hover{border-color:#7c9765;transform:translateY(-2px)}.appearance-choice:active{transform:translateY(0)}}
@media(max-width:1200px){.account-layout:has(.customization){grid-template-columns:minmax(0,1fr)}.customization-layout{grid-template-columns:minmax(0,1fr) minmax(270px,.9fr)}.account-content:has(.customization){padding:24px}.customization .appearance-choices{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:850px){.customization-layout{grid-template-columns:minmax(0,1fr)}.customization-preview{position:static;grid-row:1}.preview-table{max-width:440px;margin:auto}.customization .appearance-choices{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:540px){.account-content:has(.customization){padding:20px 14px}.customization-layout{gap:24px}.customization-preview{padding:16px}.customization-preview h2{font-size:20px!important}.preview-table .poker-arena{height:310px}.preview-table .poker-felt{inset:18px 0 40px;border-width:10px}.preview-table-center{top:52px;gap:12px}.preview-table .board .ultra-card{--card-w:32px}.customization .appearance-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.appearance-choice{padding:12px}.appearance-selects{grid-template-columns:minmax(0,1fr)}.appearance-selects label{font-size:13px}.appearance-choice strong{font-size:13px}.appearance-choice small{font-size:12px}.customization-save .button{width:100%}.account-layout:has(.customization) .account-sidebar,.account-layout:has(.customization) .account-sidebar nav{min-width:0}}
.profile-onboarding{padding:22px;border:1px solid #58653d;background:#27321e;border-radius:9px;margin-bottom:28px}.profile-onboarding .eyebrow{font-size:8px}.profile-onboarding h2{font-size:21px;margin:12px 0}.profile-onboarding>div{display:flex;align-items:center;flex-wrap:wrap;gap:18px}.profile-onboarding>div>a:not(.button){font-size:11px;color:#d6e7bc}.profile-onboarding .button{font-size:11px;min-height:42px}.profile-onboarding p{color:#bcc9ab}

.choice-classic-blue{background:radial-gradient(ellipse at top,#236486,#102f48);border-color:#263139;outline:1px solid #91b2c066}
.choice-midnight{background:radial-gradient(ellipse at top,#263849,#101b28);border-color:#242b32;outline:1px solid #7a8e9e66}
.choice-ultra-special{background:radial-gradient(ellipse at top,#286c50,#123d30);border-color:#33362f;outline:1px solid #c5b47d66}
#appearance-preview[data-card-size="compact"] .board .ultra-card{--card-w:28px}
#appearance-preview[data-card-size="large"] .board .ultra-card{--card-w:33px}
#appearance-preview[data-animation-speed="fast"] .deal-in{animation-duration:.22s}
#appearance-preview[data-animation-speed="smooth"] .deal-in{animation-duration:.4s}
