@font-face{font-family:YujiSyuku;src:url('assets/YujiSyuku-Regular.ttf') format('truetype');font-display:swap}
.dynamic-text,.edition,.help,#offline-status,#pool-info,#settings-error,#message-text,#storage-note,#question,.whole-reading,.reading{font-family:YujiSyuku,serif;font-weight:400;font-synthesis:none}
dialog.chalk-dialog{--glyph:calc(9.4svh);width:min(94vw,1480px);height:90svh;max-width:94vw;max-height:90svh;padding:clamp(12px,2vw,26px);border:14px solid #b58249;border-radius:8px;color:#f8f7e9;background:repeating-linear-gradient(125deg,#ffffff02 0 2px,transparent 2px 7px),radial-gradient(ellipse at 40% 30%,#28554a,#133c35);box-shadow:0 0 0 3px #704a28,inset 0 0 30px #081e1999,0 12px 24px #0006;overflow:hidden;font-family:YujiSyuku,serif}
dialog.chalk-dialog[open]{display:flex;flex-direction:column;gap:16px}
.chalk-dialog h2{margin:0;flex-shrink:0;text-align:center;padding-bottom:12px;border-bottom:2px solid #f6f2df88}
.chalk-dialog .chalk-label{display:inline-block;height:var(--glyph);width:auto;max-width:none;vertical-align:middle;overflow:hidden;filter:invert(1);flex-shrink:0}
.chalk-dialog .dialog-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-color:#dce7d4 #244c42;scrollbar-width:auto;padding:6px 12px 18px;scroll-padding:16px}
.chalk-dialog .dialog-scroll:focus-visible{outline:2px solid #ffe69c;outline-offset:-2px}
.chalk-dialog .dialog-actions{display:flex;justify-content:flex-end;gap:20px;border-top:2px solid #f6f2df77;padding-top:12px;flex-shrink:0;overflow-x:auto}
.chalk-dialog button{background:repeating-linear-gradient(5deg,#c9975355 0 2px,transparent 2px 11px),linear-gradient(#f6d294,#e2ac63);border:2px solid #99642c;border-radius:14px;padding:12px 24px;color:#1b211c;box-shadow:0 8px 0 #283335;flex-shrink:0;margin-bottom:8px}
.chalk-dialog button .chalk-label{filter:none}
.chalk-dialog .help{color:#dce4d5;font-size:clamp(16px,2.2svh,24px);line-height:1.65;margin:18px 0 0}
.chalk-dialog input[type=text],.chalk-dialog select{font-family:YujiSyuku,serif;font-size:var(--glyph);font-weight:400;color:#fffef0;background:#11362f;border:2px solid #ede9cd;border-radius:6px;padding:4px 12px;min-width:0}
.chalk-dialog input[type=text]{width:min(100%,650px);max-width:100%}
.chalk-dialog input:focus-visible,.chalk-dialog select:focus-visible{outline:4px solid #fbd378;outline-offset:3px}
.chalk-dialog select option{color:#173b33;background:#fff9e5}
.chalk-dialog input[type=checkbox]{width:calc(var(--glyph)*.7);height:calc(var(--glyph)*.7);flex-shrink:0;accent-color:#e6bd62}
.chalk-dialog label{gap:18px;margin:0;max-width:100%}
.chalk-dialog fieldset{border:0;border-top:2px solid #f5f0d666;border-radius:0;padding:24px 0;margin:32px 0;display:flex;gap:30px;flex-wrap:wrap;min-width:0}
.chalk-dialog fieldset legend{padding-right:20px}
.chalk-dialog .option-grid{display:grid;grid-template-columns:repeat(2,max-content);gap:30px 40px}
.chalk-dialog .setting-line{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin:30px 0}
.chalk-dialog #settings-form{display:flex;flex:1;flex-direction:column;min-height:0;gap:12px}
.chalk-dialog #pool-info{font-size:clamp(22px,4svh,40px);line-height:1.5}
.chalk-dialog #settings-error{color:#ffd29c;font-size:clamp(20px,3svh,32px)}
.chalk-dialog #settings-error:empty{display:none}
.chalk-dialog #result-stats{display:flex;flex-direction:column;gap:30px;font-size:var(--glyph);margin:20px 0 36px}
.chalk-dialog #result-stats>div{display:flex;align-items:center;justify-content:space-between;gap:30px;min-width:max-content}
.chalk-dialog #result-stats strong{font-family:YujiSyuku,serif;font-weight:400;font-size:var(--glyph);white-space:nowrap}
.chalk-dialog .result-heading{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin:36px 0 24px;font-size:var(--glyph)}
.chalk-dialog #ranking table{width:100%;font-size:var(--glyph)}
.chalk-dialog #ranking th,.chalk-dialog #ranking td{padding:18px 22px;border-color:#e5eed080;white-space:nowrap;font-weight:400}
.chalk-dialog #ranking td{font-family:YujiSyuku,serif}
.chalk-dialog tr.current{background:#e7c77a22}
.chalk-dialog #ranking td:nth-child(2){white-space:normal;overflow-wrap:anywhere;min-width:260px;max-width:460px}
.chalk-dialog #message-text{font-size:clamp(28px,5.5svh,56px);line-height:1.65;overflow-wrap:anywhere}
#pause-dialog.chalk-dialog,#message.chalk-dialog{width:min(94vw,1200px);height:70svh}
#pause-dialog .dialog-scroll{display:flex;align-items:center;justify-content:center;text-align:center}
#pause-dialog .dialog-scroll p{margin:0}
#pause-dialog .dialog-scroll .chalk-label{height:calc(var(--glyph)*2)}
#music-toggle{position:fixed;right:12px;bottom:12px;z-index:30;font-family:YujiSyuku,serif;padding:4px 10px;font-size:24px;opacity:.85}
.chalk-dialog .empty-ranking{font-size:clamp(24px,4svh,40px)}
.chalk-dialog .notice-line{display:block;margin:12px 0 28px}
.chalk-dialog .notice-line .chalk-label{max-width:100%;height:auto;max-height:var(--glyph);width:auto}
.chalk-dialog .rank-cards{display:flex;flex-direction:column;gap:30px}
.chalk-dialog .rank-card{padding:22px 8px;border-bottom:2px solid #eef2da88}
.chalk-dialog .rank-main,.chalk-dialog .rank-details{display:flex;align-items:center;gap:24px;flex-wrap:wrap;font-size:var(--glyph)}
.chalk-dialog .rank-main{justify-content:space-between}
.chalk-dialog .rank-main .rank-name{flex:1;overflow-wrap:anywhere;min-width:0}
.chalk-dialog .rank-details{margin-top:20px;gap:24px 40px}
.chalk-dialog .rank-details>span{display:inline-flex;align-items:center;gap:16px}
.chalk-dialog .rank-card.current{background:#e7c77a18}
@media(orientation:portrait){.chalk-dialog .option-grid{grid-template-columns:max-content}.chalk-dialog .dialog-actions{justify-content:flex-start}}
/* Compact settings/results: keep the blackboard size and reclaim content space. */
#settings-dialog.chalk-dialog,#results.chalk-dialog{--glyph:6.58svh;gap:11.2px}
#settings-dialog h2,#results h2{text-align:right;padding-bottom:8.4px}
#settings-dialog .dialog-actions,#results .dialog-actions{justify-content:flex-end;gap:14px;padding-top:8.4px;margin-top:auto}
#settings-dialog button,#results button{padding:8.4px 16.8px;border-radius:9.8px;box-shadow:0 5.6px 0 #283335;margin-bottom:5.6px}
#settings-dialog fieldset{padding:16.8px 0;margin:22.4px 0;gap:21px}
#settings-dialog .option-grid{gap:21px 28px}
#settings-dialog .setting-line{gap:14px;margin:21px 0}
#results #result-stats{gap:21px;margin:14px 0 25.2px}
#results .result-heading{justify-content:flex-end;gap:16.8px;margin:25.2px 0 16.8px}
#results .rank-cards{gap:21px}
#results .rank-card{padding:15.4px 5.6px}
#results .rank-main,#results .rank-details{gap:16.8px}
#settings-dialog #pool-info{font-size:clamp(15.4px,2.8svh,28px)}
#settings-dialog #settings-error{font-size:clamp(14px,2.1svh,22.4px)}
