/* Approved main-menu artwork is the visual surface; accessible hit areas follow its proportions. */
body{font-family:YujiSyuku,serif}
.waiting-weights{position:absolute;inset:0;pointer-events:none;z-index:8}
@media(orientation:landscape){#battle{min-height:0}}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
#home{padding:0;gap:0;background:#d8dfcc;min-height:100svh;justify-content:center}
.home-art{position:relative;width:min(100vw,calc((100svh - 44px)*1672/941));aspect-ratio:1672/941;flex:none;container-type:inline-size}
.home-scene{width:100%;height:100%;display:block}
#desks{display:none}
#home .home-nav{position:absolute;inset:77% 2.7% 4.4%;width:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:2%;margin:0}
#home .home-nav button{padding:0;background:transparent;border:0;box-shadow:none;border-radius:20px;min-width:0;transform:none}
#home .home-nav button:hover{background:#fff2;box-shadow:0 0 18px #fff8}
#home .home-nav button:active{background:#3c280e33}
.home-tools{min-height:44px;width:100%;display:flex;align-items:center;justify-content:center;gap:18px;padding:4px 44px 4px 10px;background:#edf0df;flex-wrap:wrap}
.home-tools .edition{font-size:14px;color:#244b42;letter-spacing:0}
.home-tools .install-tools{font-family:YujiSyuku,serif;font-size:12px;gap:10px}
.class-date{position:absolute;left:83.7%;top:6%;width:9.6%;height:29.8%;background:#153e34;color:#fffdf0;font-family:YujiSyuku,serif;font-size:2cqw;line-height:1.2;white-space:nowrap;display:flex;flex-direction:column;justify-content:space-evenly;align-items:flex-end;padding-right:1.1cqw;overflow:hidden}
#selection{position:relative;isolation:isolate;background:#d8e3ce url('assets/classroom.png') center/cover no-repeat;padding:0;min-height:100svh;height:100svh;overflow:hidden}
#selection:before{content:'';position:absolute;z-index:-1;left:8%;right:5%;top:3%;height:75%;border:clamp(7px,1vw,17px) solid #b88750;background:repeating-linear-gradient(115deg,#ffffff03 0 2px,transparent 2px 7px),radial-gradient(ellipse at 40% 25%,#315c4d,#123c33);box-shadow:0 0 0 3px #74502f,inset 0 0 30px #061e1688}
#selection header{position:absolute;left:1%;top:1%;z-index:5}
#selection header>span{display:none}
#selection #back{padding:6px 12px}
#selection .selection-grid{position:relative;margin:0 auto;width:94%;max-width:1600px;height:100%;gap:3%;grid-template-columns:30% 34% 30%}
#selection .picker{position:relative;padding-top:10svh;min-width:0;isolation:isolate}
#selection .picker h2{position:relative;z-index:2;margin:0;height:15svh;color:#fff;text-shadow:2px 2px #23453d;display:flex;justify-content:center;align-items:center;overflow:visible}
#selection .picker h2 .chalk-label{height:12svh;max-width:none;width:auto;filter:invert(1)}
#selection .picker-nav .character-name{width:100%;height:6svh;object-fit:contain;filter:drop-shadow(2px 2px 0 white) drop-shadow(-2px -2px 0 white)}
#selection .picker-nav>span{min-width:0;flex:1}
#selection .beam{position:static;background:none;box-shadow:none;border-radius:0;align-items:end;padding-bottom:1svh}
#selection .beam:before{content:'';position:absolute;inset:0 1% 12%;z-index:-1;background:linear-gradient(90deg,transparent,var(--tint) 25%,#ffffff99 50%,var(--tint) 75%,transparent);box-shadow:inset 0 -18px 24px #fff8;border-radius:0 0 45% 45%}
#selection .beam img{width:92%;height:55svh;max-height:100%;filter:drop-shadow(0 5px 8px #fff9)}
#selection .picker-nav{height:13svh;padding:0 0 3svh;gap:4px;font-family:YujiSyuku,serif;font-size:clamp(20px,3vw,46px);white-space:nowrap;text-shadow:2px 2px white,-2px -2px white}
#selection .picker-nav button{padding:3px 10px;background:#efaf57;border:1px solid #976334}
#selection .stage-picker{position:relative;padding:6svh 0 5svh;gap:1svh;min-width:0}
#selection .mini-scroll{background:none;border:0;color:#fff;font-family:YujiSyuku,serif;font-size:clamp(36px,7svh,75px);padding:0;line-height:1.2}
#selection .mini-scroll:before{display:none}
#selection #stage-preview{height:39svh;width:100%;border-radius:2px;border:2px solid #eee5;object-fit:cover}
#selection #stage-prev,#selection #stage-next{padding:0 16px;background:none;border:0;box-shadow:none;font-size:3.4svh;color:#ffbd69}
#selection #fight{margin-top:auto;font-size:24px;width:90%;padding:8px}
#selection #fight,#selection #back,.writing-buttons button{background:repeating-linear-gradient(5deg,#c9975333 0 2px,transparent 2px 11px),linear-gradient(#f6d294,#e2ac63);border-color:#99642c;box-shadow:0 7px 0 #283335}
#selection #fight .chalk-label{height:6svh;width:auto;max-width:100%}
#back .chalk-label{height:3.5svh;width:auto}
.writing-buttons .chalk-label{height:2.8svh;width:auto;max-width:100%}
#pause .chalk-label{height:2.6svh;width:auto}
#writing-label .chalk-label{height:2.2svh;width:auto;filter:invert(1)}
#elapsed,#countdown,.name,.picker-nav,#mode-label{font-family:YujiSyuku,serif}
@media(max-width:850px){.home-tools{gap:5px}.home-tools .install-tools{gap:5px;font-size:10px}.home-tools .install-tools button{font-size:10px;padding:2px 5px}#selection .picker-nav{font-size:clamp(16px,2.9vw,27px)}#selection .picker-nav button{padding:2px 5px}}
@media(orientation:portrait){#selection{min-width:720px}body:has(#selection:not(.hidden)){overflow:auto}#selection .selection-grid{height:100%}.home-tools{padding-right:40px}}