:root{--canvas:#f5f7fa;--ink:#17243b;--muted:#526176;--line:#d4dbe5;--active:#165dcc}
.settings-dialog[open]{display:flex;flex-direction:column;padding:0;overflow:hidden;max-height:calc(100dvh - 32px)}
.settings-dialog-header{display:flex;align-items:center;gap:16px;flex:none;padding:16px 24px;background:#fff}
.settings-dialog-header h2{order:1;flex:1;min-width:0;font-size:20px;line-height:1.3;margin:0;overflow-wrap:anywhere}
.settings-dialog-header .dialog-close{order:2;position:static;flex:none;width:44px;height:44px;min-height:44px;padding:0;margin:0;background:#fff}
.settings-dialog-body{min-height:0;overflow:auto;overscroll-behavior:contain;padding:8px 24px 24px}
@media(max-width:480px){.settings-dialog-header{padding:12px 16px}.settings-dialog-body{padding:8px 16px 20px}}
#winnerTitle{position:static;clip:auto;width:auto;height:auto;overflow:visible;font-size:18px;line-height:1.4;margin:0 28px 14px;overflow-wrap:anywhere}
#winnerDialog{max-height:calc(100dvh - 32px);overflow:auto}
.advanced-dialog[open]{width:min(1120px,calc(100vw - 32px));display:flex;flex-direction:column;padding:24px;overflow:hidden}
.advanced-heading{flex:none;padding-right:32px}
.advanced-heading h2{margin-bottom:10px}
.advanced-heading .hint{margin:0 0 12px}
.entry-table-scroll{overflow:auto;min-height:0;margin-top:16px}
.entry-table{width:100%;border-collapse:collapse;font-size:13px;text-align:left}
.entry-table th{position:sticky;top:0;background:#fff;padding:10px 8px;z-index:1;font-weight:600}
.entry-table td{padding:12px 8px;vertical-align:top}
.entry-table tr:nth-child(even){background:#f5f7fa}
.entry-table td:nth-child(2){width:24%;min-width:180px}
.entry-table td:nth-child(3){width:150px}
.entry-table td:nth-child(4){width:100px}
.entry-table input{margin:0;min-width:0;max-width:100%;min-height:44px}
.entry-table input[type=checkbox]{width:20px;height:20px;min-height:20px;margin-top:12px}
.entry-table input[type=number]{width:72px}
.entry-table input[type=color]{width:60px}
.entry-table button{display:block;font-size:12px;padding:6px 8px;white-space:nowrap;margin:4px 0 0}
.entry-inline{display:flex;align-items:center;gap:6px}
.entry-inline button{margin:0}
.entry-table output{display:block;padding-top:12px;white-space:nowrap;font-variant-numeric:tabular-nums}
.entry-image-picker{display:flex;align-items:center;position:relative;width:76px;min-height:44px;overflow:hidden;margin:0;font-size:12px;cursor:pointer;color:var(--active)}
.entry-image-picker input[type=file]{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.entry-image-picker:focus-within{outline:3px solid var(--active);outline-offset:2px;border-radius:6px}
.entry-table img{object-fit:cover;border-radius:4px}
.advanced-footer{flex:none;justify-content:flex-end;margin-top:12px}
#advancedNotice{font-size:13px;margin:8px 0 0;flex:none}
#advancedNotice:empty{display:none}
@media(max-width:759px){
 .advanced-dialog[open]{padding:20px 16px}
 .entry-table,.entry-table tbody{display:block}
 .entry-table thead{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}
 .entry-table tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 16px;padding:16px 8px;margin-bottom:12px}
 .entry-table td{display:block;width:auto!important;min-width:0!important;padding:0}
 .entry-table td::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px;margin-bottom:6px}
 .entry-table td:nth-child(2){grid-column:1/-1;grid-row:1}
 .entry-table td:first-child{grid-column:1/-1;grid-row:2;display:flex;align-items:center;gap:12px}
 .entry-table td:first-child::before{margin:0}
 .entry-table td:nth-child(3){grid-column:1;grid-row:3}
 .entry-table td:nth-child(4){grid-column:2;grid-row:3}
 .entry-table td:nth-child(5){grid-column:1;grid-row:4}
 .entry-table td:nth-child(6){grid-column:2;grid-row:4}
 .entry-table td:last-child{grid-column:1/-1;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
 .entry-table td:last-child::before{width:100%}
 .entry-table input[type=checkbox]{margin:0}
 .entry-table td:nth-child(3) .entry-inline{flex-wrap:wrap}
 .entry-table output{padding-top:10px}
 .advanced-footer{gap:8px;flex-wrap:wrap}
 .advanced-footer button{font-size:13px;padding:8px}
}
@media(max-width:650px){.site-header .header-actions #mute{position:absolute;top:10px;right:60px;font-size:12px;padding:8px}.site-header .brand-heading{padding-right:90px}.site-header .brand-heading h1{font-size:16px}.result-strip{display:block!important;text-align:center}.result-strip #result{max-width:none;margin-bottom:8px}.result-strip .actions{justify-content:center}}
body{background:var(--canvas);color:var(--ink)}
.spin-hub.with-image:not(.is-spinning) #spinLabel{visibility:hidden}
button,input,select,textarea{font:inherit;font-size:14px;accent-color:var(--active);caret-color:var(--active)}
textarea,input,select{font-weight:400}
button,a,summary{touch-action:manipulation}
button{min-height:44px;border-radius:8px}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #165dcc;outline-offset:3px}
::selection{background:#cfe0ff;color:#17243b}
*{scrollbar-color:#a8b5c7 transparent;scrollbar-width:thin}
.site-header{max-width:none;padding:12px 24px;min-height:72px;gap:24px;display:flex;align-items:center;justify-content:space-between;background:#fff}
.brand-heading{display:flex;align-items:center;gap:10px;flex:none}
.brand-heading h1{font-size:20px;line-height:1.2;font-weight:700;letter-spacing:-.02em;margin:0}
.brand{display:grid;place-items:center;width:44px;height:44px;padding:0}
.brand img{display:block;width:36px;height:36px}
.header-actions{display:flex;align-items:center;gap:4px}
.header-actions button,.header-actions a,.header-actions summary{font-size:14px;min-height:44px;padding:10px 12px;color:var(--ink);font-weight:600;border:0;background:transparent;white-space:nowrap;text-decoration:none;display:flex;align-items:center;justify-content:center;border-radius:8px}
.header-actions button:hover,.header-actions a:hover,.header-actions summary:hover{background:#edf2f8}
.header-actions #customize{background:#e9f0fc;color:#164eaa}
.file-actions{display:flex;align-items:center;gap:2px}
.header-actions details{margin:0;position:relative;border:0;padding:0;z-index:20}
.header-actions details>summary{cursor:pointer;list-style:none}
.header-actions details>summary::after{content:"";border:solid currentColor;border-width:0 1.5px 1.5px 0;padding:3px;transform:rotate(45deg);margin:-4px 0 0 9px}
.header-actions details>div,.header-actions details>nav{position:absolute;right:0;top:48px;display:flex;flex-direction:column;align-items:stretch;gap:2px;background:#fff;padding:8px;min-width:190px;border-radius:10px;box-shadow:0 8px 28px #17243b26}
.header-actions details:not([open])>div,.header-actions details:not([open])>nav{display:none}
.header-actions details a,.header-actions details button{justify-content:flex-start}
.header-actions .more-menu{display:none}
.icon-button svg{width:23px;height:23px}
main{padding:34px 24px 24px;max-width:1760px;margin:auto}
.workspace{grid-template-columns:minmax(0,1fr) 360px;gap:28px;align-items:start}
.wheel-panel{padding:0 6px}
.wheel-wrap{width:min(100%,820px,calc(100dvh - 174px))}
.setup-panel{height:min(820px,calc(100dvh - 174px));border-radius:12px;background:white}
.tabs{display:grid;grid-template-columns:1fr 1fr}
.tab-panel{padding:16px}
.editor-tools{display:flex;gap:6px;justify-content:space-between;margin-bottom:14px}
.editor-tools button{font-size:13px;padding:8px 10px;flex:1}
#entries{min-height:250px;height:clamp(220px,calc(100dvh - 430px),520px);line-height:1.65}
.entry-options{display:flex;flex-direction:column;gap:6px}
.entry-options label{margin:0}
.result-strip{margin-top:8px;gap:12px;border:0;padding:0;display:flex;align-items:center;justify-content:space-between;min-height:44px}
.result-strip #result{font-size:14px;font-weight:600;line-height:1.25;margin:0;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.result-strip #poolStatus{font-size:11px;color:var(--muted);margin:2px 0;line-height:1.2}
.result-strip #score:empty{display:none}
.result-strip #score{font-size:11px;margin:0}
.result-strip .actions{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.result-strip button{font-size:13px}
#autoStatus{font-size:12px;color:var(--muted);align-self:center;max-width:180px}
.wheel-caption{margin-top:12px}
.storage{margin-top:28px}
.wide-dialog{width:min(680px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 40px);padding:28px;overflow:auto;text-align:left}
dialog h2{font-size:24px;margin:0 36px 24px 0;line-height:1.2}
dialog h3{font-size:17px;margin:0 0 16px}
dialog fieldset{border:0;padding:0;margin:0;min-width:0}
dialog .custom-group+ .custom-group{margin-top:32px}
dialog .custom-group{padding:0;margin:0 0 28px}
dialog label{font-size:14px;margin:12px 0}
dialog input[type=file]{width:100%;padding:8px;font-size:12px;min-width:0}
dialog input[type=color]{height:44px;padding:3px;width:80px}
dialog .check{display:flex;align-items:center;gap:10px;min-height:36px}
dialog .check input{width:18px;height:18px;min-height:18px;margin:0}
.media-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.media-grid>div{min-width:0}
.media-grid button{font-size:12px;padding:6px 10px}
.custom-group .hint{font-size:12px;color:var(--muted)}
.theme-swatches{display:flex;gap:10px;margin:0 0 16px}
.theme-swatches i{height:12px;width:65px;border-radius:2px;background:linear-gradient(90deg,#0788ff 0 33%,#ff355e 33% 66%,#ffd500 66%)}
.theme-swatches i:nth-child(2){background:linear-gradient(90deg,#075985 0 33%,#0e7490 33% 66%,#4338ca 66%)}
.theme-swatches i:nth-child(3){background:linear-gradient(90deg,#b83238 0 33%,#b54b20 33% 66%,#773f93 66%)}
.advanced-top{display:flex;align-items:end;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.advanced-top label{flex:1;min-width:150px;margin:0}
.advanced-top button{font-size:12px;padding:8px}
.probability{font-size:14px;align-self:end;padding:8px 0;font-variant-numeric:tabular-nums}
.saved-wheel-row{display:flex;align-items:center;gap:12px;padding:8px 0}
.saved-wheel-row>button:first-child{flex:1;text-align:left}
.saved-wheel-row span{font-size:12px;color:var(--muted)}
#legacyLists button{display:block;width:100%;text-align:left;margin:8px 0}
#notice{position:fixed;inset:auto auto 20px 50%;margin:0;transform:translateX(-50%);z-index:100;width:max-content;max-width:min(600px,90vw);font-size:14px;color:#fff;background:#17243b;padding:12px 18px;border:0;border-radius:8px;box-shadow:0 8px 24px #17243b30;pointer-events:none}
#notice:empty{display:none}
#forgetDialog{width:min(520px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);padding:28px;text-align:left}
#forgetDialog p{font-size:16px;line-height:1.55;margin-bottom:16px}
#forgetDialog .dialog-actions{justify-content:flex-end;gap:12px;margin-top:24px}
#confirmForget{background:#C91034;border-color:#C91034;color:#fff}
#confirmForget:hover:not(:disabled){background:#a90d2b;border-color:#a90d2b;color:#fff}
@media(max-width:480px){#forgetDialog{padding:18px}#forgetDialog .dialog-actions{flex-direction:column}#forgetDialog .dialog-actions button{width:100%}}
body.presenting .site-header,body.presenting .setup-panel,body.presenting .wheel-caption,body.presenting .result-strip,body.presenting .storage,body.presenting .help,body.presenting footer,body.presenting .audio-notice,body.presenting .error{display:none!important}
body.presenting main{max-width:none;padding:0;margin:0;height:100dvh;display:grid;place-items:center}
body.presenting .workspace{display:block;width:100%;margin:0}
body.presenting .wheel-panel{padding:0;display:grid;place-items:center}
body.presenting .wheel-wrap{width:min(calc(100dvh - 70px),calc(100vw - 40px));max-width:none;margin:0}
@media(max-width:1350px){.header-actions .file-actions{display:none}.header-actions .more-menu{display:block}}
@media(max-width:1000px){.workspace{grid-template-columns:1fr;gap:24px}.setup-panel{height:auto;min-height:360px;width:min(680px,100%);margin:auto}.wheel-wrap{width:min(100%,700px,calc(100dvh - 190px))}.wheel-panel{padding:0}#entries{height:300px}.brand-heading h1{font-size:18px}}
@media(max-width:650px){.site-header{padding:10px 16px;display:grid;grid-template-columns:1fr;gap:6px}.brand-heading h1{font-size:18px}.brand{width:36px}.brand img{width:32px;height:32px}.header-actions{justify-content:flex-start;gap:6px}.header-actions #present{position:absolute;right:16px;top:10px}.header-actions button,.header-actions a,.header-actions summary{font-size:13px;padding:8px 11px}.header-actions .other-tools>nav{left:0;right:auto}.header-actions .more-menu>div{left:0;right:auto}main{padding:32px 16px 20px}.wheel-wrap{width:100%}.result-strip{padding-top:8px}.result-strip .actions{gap:4px}.result-strip button{font-size:12px;padding:8px}.wide-dialog{padding:24px 18px;max-height:calc(100dvh - 24px)}.media-grid{grid-template-columns:1fr;gap:8px}.storage{display:block;text-align:center}.help{padding-top:28px}.help-grid{display:block}.help-grid article{margin:24px 0}}
/* WS59 content-driven reflow. English keeps its existing one-row composition. */
.site-header{height:auto;flex-wrap:wrap}
.site-header .header-actions{min-width:0;max-width:100%;flex-wrap:wrap}
.site-header .brand-heading{min-width:0;max-width:100%}
.site-header .brand-heading h1{white-space:normal;overflow-wrap:anywhere}
.site-header .header-actions details>div,.site-header .header-actions details>nav{max-width:calc(100vw - 32px)}
.site-header .header-actions details a,.site-header .header-actions details button{white-space:normal;overflow-wrap:anywhere}
@media(min-width:1001px){body[data-tool=names]:not(.presenting) .wheel-wrap{width:min(100%,820px,calc(100dvh - 190px - var(--header-extra,0px)))}}