:root{--ink:#253d37;--muted:#809089;--green:#347664;--dark:#285d4e;--light:#e8f0e9;--paper:#f7f8f2;--line:#e4e9df;--yellow:#efbd58;--shadow:0 8px 30px #274f3510;font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #d5a444;outline-offset:4px}button{border:0}a{color:inherit}svg{display:block}button svg{width:19px;height:19px}.loading{display:grid;min-height:100vh;place-items:center;color:var(--green)}.topbar{height:96px;max-width:1510px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 52px;gap:24px}.brand{display:flex;align-items:center;gap:13px;text-decoration:none}.brandmark{width:47px;height:47px;border-radius:15px;background:var(--green);display:grid;place-items:center;color:#ffefd0}.brandmark svg{width:29px;height:29px}.brand-name{font-size:15px;font-weight:800;letter-spacing:.6px}.brand-sub{font-size:10px;letter-spacing:2.5px;color:var(--muted);margin-top:6px}.topnav{display:flex;background:#edf0e8;padding:5px;border-radius:14px;gap:4px}.navbtn{padding:11px 19px;background:transparent;color:#7e8a80;border-radius:10px;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;white-space:nowrap}.navbtn.active{background:#fff;color:var(--green);box-shadow:0 2px 7px #223b2910}.topright{display:flex;gap:15px;align-items:center}.private{font-size:11px;display:flex;align-items:center;gap:5px;color:#7d8c80}.private svg{width:14px;height:14px}.small-login{display:flex;gap:7px;align-items:center;background:none;color:var(--ink);font-size:12px;font-weight:700}.small-login svg{width:19px;height:19px}main{max-width:1510px;margin:auto;padding:22px 52px 32px}.eyebrow{font-size:10px;letter-spacing:2.5px;color:var(--green);font-weight:800;display:flex;align-items:center;gap:7px}.eyebrow .dot{background:#79aa77;border-radius:50%;width:6px;height:6px}.pagehead{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:25px}.pagehead h1{font-size:32px;letter-spacing:1px;margin:10px 0 9px;line-height:1.3}.pagehead p{color:#8a968c;font-size:13px;margin:0;line-height:1.7}.daytag{font-size:12px;color:#85917f;display:flex;align-items:center;gap:9px;background:#eff1e5;padding:10px 14px;border-radius:20px}.daytag svg{width:19px;height:19px;color:#c6a347}.campus-layout{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:25px;align-items:start}.map-shell{background:#e3edd6;border:7px solid white;border-radius:25px;overflow:hidden;box-shadow:var(--shadow);position:relative;isolation:isolate}.campus-map{width:100%;height:auto;aspect-ratio:1000/660;touch-action:none;user-select:none;-webkit-user-select:none}.campus-map text{font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;pointer-events:none}.map-top{position:absolute;top:19px;left:21px;background:#fffffff0;box-shadow:0 3px 12px #65844810;padding:9px 13px;border-radius:11px;font-size:11px;display:flex;align-items:center;gap:7px;color:#5d7956;pointer-events:none}.map-top .dot{width:6px;height:6px;background:#7daa69;border-radius:50%}.map-controls{position:absolute;bottom:18px;right:19px;display:grid;grid-template-columns:35px 35px 35px;grid-template-rows:35px 35px;gap:4px;touch-action:none}.map-controls button{border-radius:9px;background:#fffffff2;color:var(--green);display:grid;place-items:center;box-shadow:0 2px 3px #44663315}.map-controls button svg{width:17px;height:17px}.map-controls button:first-child{grid-column:2}.map-controls button:nth-child(2){grid-row:2;grid-column:1}.map-controls button:nth-child(3){grid-row:2;grid-column:2}.map-controls button:nth-child(4){grid-row:2;grid-column:3}.map-bottom{position:absolute;bottom:20px;left:21px;font-size:10px;color:#6b805c;background:#f8fbeeeb;border-radius:9px;padding:9px 12px;pointer-events:none}.building{cursor:pointer;outline:none}.building:hover .building-name,.building:focus .building-name{fill:#285d4e}.building:hover{filter:brightness(1.04)}.map-caption{display:flex;justify-content:space-between;padding:15px 8px;color:#899182;font-size:11px;gap:12px}.map-caption span{display:flex;align-items:center;gap:6px}.map-caption svg{width:14px;height:14px}.sidebar{display:flex;flex-direction:column;gap:16px}.profile-card{background:#fff;border:1px solid var(--line);border-radius:21px;padding:23px 23px 20px;text-align:center;box-shadow:var(--shadow);position:relative}.card-kicker{text-align:left;font-size:11px;color:#9aa38f;letter-spacing:1px;display:flex;justify-content:space-between;align-items:center}.card-kicker span{font-size:9px;border:1px solid #e1e7d8;padding:3px 7px;border-radius:5px;letter-spacing:1px}.avatar-stage{height:135px;display:grid;place-items:center;position:relative}.avatar-stage:before{content:"";width:110px;height:100px;border-radius:50%;background:#f3f4e8;position:absolute;bottom:12px}.avatar-stage svg{width:90px;height:124px;position:relative}.profile-name{font-size:18px;font-weight:800;margin-top:2px}.profile-meta{font-size:11px;color:var(--muted);margin-top:7px}.coinbox{background:#fbf7e9;border-radius:13px;padding:16px 10px;margin:21px 0 15px;border:1px solid #f4edda}.coin-label{font-size:10px;color:#a39772;margin-bottom:6px}.coin-value{font-family:Arial,sans-serif;color:#8f7434;font-size:36px;font-weight:700;letter-spacing:-1px;display:flex;gap:9px;justify-content:center;align-items:center}.coin-icon{width:25px;height:25px;border-radius:50%;border:2px solid #dca444;box-shadow:inset 0 0 0 3px #f7d277;background:#eabb54;display:inline-grid;place-items:center;color:#fff9d6;font-size:13px;font-weight:800;line-height:1;vertical-align:middle;flex-shrink:0}.coin-value .coin-icon{width:29px;height:29px;font-size:16px}.btn{background:var(--green);color:#fff;border:1px solid transparent;border-radius:11px;padding:13px 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:13px;font-weight:700;min-height:45px;transition:background .15s,transform .15s}.btn:hover{background:var(--dark)}.btn:active{transform:translateY(1px)}.btn.full{width:100%}.btn.secondary{background:white;color:var(--green);border-color:var(--line)}.btn.secondary:hover{background:#f1f5ef}.btn.soft{background:var(--light);color:var(--green)}.btn.small{padding:9px 12px;min-height:38px;font-size:12px}.textbtn{background:none;color:#7a8c7c;font-size:11px;padding:10px 3px;text-decoration:none}.profile-card .textbtn{margin-top:5px}.welcome-note{background:#eeefdf;border:1px solid #e7e8d7;padding:20px;border-radius:18px}.note-head{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;margin-bottom:9px;color:#6f795a}.note-head svg{width:18px;height:18px}.welcome-note p{font-size:11px;color:#8b9279;line-height:1.9;margin:0}.quick-card{border:1px solid var(--line);border-radius:17px;background:#fff;padding:16px;display:flex;gap:12px;align-items:center;width:100%;text-align:left}.quick-card>svg{width:35px;height:35px;padding:7px;background:#f6f0dc;border-radius:11px;color:#b39b53}.quick-card strong{font-size:12px;display:block;margin-bottom:4px}.quick-card span{font-size:10px;color:var(--muted)}.quick-card .arrow{margin-left:auto;font-size:17px;color:#9bab97}.footer{margin-top:24px;border-top:1px solid var(--line);padding:19px 3px 0;display:flex;justify-content:space-between;align-items:center;color:#9ba491;font-size:10px;letter-spacing:.4px}.footer button{font-size:11px;background:none;color:#71836f;display:flex;align-items:center;gap:7px}.footer svg{width:15px;height:15px}.balance-pill{padding:11px 17px;border-radius:14px;background:#fff6dc;display:flex;gap:8px;align-items:center;color:#8f7333;font-weight:700}.balance-pill small{font-weight:400;color:#9d8b62}.balance-pill .coin-icon{width:20px;height:20px;font-size:11px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.tab{background:#eaf0e7;color:#7b8975;border-radius:25px;padding:10px 20px;font-size:12px}.tab.active{background:var(--green);color:#fff}.shop-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.reward-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:15px;overflow:hidden}.reward-art{height:148px;border-radius:13px;display:grid;place-items:center;background:#f3f0e4;position:relative;margin-bottom:17px}.reward-art svg{width:84px;height:84px;stroke-width:1.1;color:#a39166;filter:drop-shadow(0 7px 2px #675c3920)}.reward-card:nth-child(3n+2) .reward-art{background:#e9f0e7}.reward-card:nth-child(3n+2) .reward-art svg{color:#829e7e}.reward-card:nth-child(3n) .reward-art{background:#f5e9e1}.reward-card:nth-child(3n) .reward-art svg{color:#bf957b}.tier{position:absolute;top:11px;left:11px;font-size:9px;border-radius:7px;padding:5px 8px;background:#ffffffab;color:#8a8c73}.stock{font-size:10px;color:#9aa58f;margin:8px 0 17px}.reward-card h3{font-size:15px;margin:0}.reward-bottom{display:flex;align-items:center;justify-content:space-between;gap:6px}.price{font:700 18px Arial,sans-serif;color:#9a7e40;display:flex;align-items:center;gap:6px}.price .coin-icon{width:20px;height:20px;font-size:10px}.reward-bottom .btn{padding:9px 15px;min-height:37px;font-size:11px}.empty{background:white;border:1px dashed #cfdaca;border-radius:18px;padding:48px 22px;text-align:center;color:var(--muted);font-size:13px;line-height:1.8;grid-column:1/-1}.empty svg{width:35px;height:35px;margin:0 auto 15px;color:#b4c0aa}.empty .btn{margin-top:18px}.panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:25px}.panel h2{font-size:17px;margin:0 0 20px}.account-layout{display:grid;grid-template-columns:280px 1fr;gap:24px}.statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:25px}.stat{background:#fff;border:1px solid var(--line);border-radius:17px;padding:21px}.stat small{color:var(--muted);font-size:11px}.stat strong{display:block;font-size:29px;margin:10px 0 2px;font-family:Arial,sans-serif}.stat span{font-size:10px;color:#9faa93}.record{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid #f0f2ea}.record:last-child{border-bottom:0}.record strong{font-size:13px}.record small{display:block;font-size:10px;color:#95a08e;margin-top:7px}.record .amount{font-size:17px;color:var(--green);white-space:nowrap;font-weight:700}.record .amount.negative{color:#b89252}.badge{font-size:10px;padding:6px 9px;border-radius:7px;background:#f6efd8;color:#a08b4c;white-space:nowrap}.badge.done{background:#eaf1e5;color:#779467}.costume-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.costume{background:#f4f6ec;border:2px solid transparent;border-radius:15px;padding:15px;text-align:center}.costume.selected{border-color:var(--green)}.costume svg{height:110px;margin:0 auto 10px}.costume strong{display:block;font-size:11px;margin-bottom:10px}.costume .btn{font-size:10px;min-height:32px;padding:7px 9px}.teacher-layout{display:grid;grid-template-columns:1fr 290px;gap:22px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:12px}th{font-size:10px;color:#93a088;font-weight:500;padding:13px 10px;background:#f6f7ef;white-space:nowrap}td{padding:15px 10px;border-bottom:1px solid #f0f2e9;white-space:nowrap}td .btn{min-height:30px;padding:5px 9px;font-size:10px}input[type=checkbox]{accent-color:var(--green);width:17px;height:17px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.section-title h2{margin:0}.toolbar{display:flex;gap:12px;margin-bottom:17px;align-items:center}.toolbar input{flex:1;min-width:0}.toolbar select{width:auto}.field{display:block;margin-bottom:17px}.field>span{display:block;font-size:12px;color:#61785f;margin-bottom:8px;font-weight:700}input:not([type=checkbox]),select{display:block;width:100%;border:1px solid #dfe6d8;border-radius:10px;padding:12px 13px;color:var(--ink);background:#fbfcf8;font-size:13px;min-height:44px}input::placeholder{color:#adb6a4}.field small{display:block;font-size:10px;color:#95a088;line-height:1.7;margin-top:7px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}.helper{font-size:11px;color:#8a9782;line-height:1.9}.grantbox{position:sticky;top:24px}.grantbox h2{margin-bottom:8px}.grantbox .helper{margin-bottom:24px}.error{color:#ab5c4e;font-size:12px;line-height:1.7;min-height:20px;margin:9px 0}.info-banner{background:#edf1e5;color:#7f8a6e;font-size:12px;line-height:1.8;padding:16px 20px;border-radius:13px;margin-bottom:22px}.modal-overlay{position:fixed;inset:0;background:#203a32a6;backdrop-filter:blur(5px);z-index:50;display:grid;place-items:center;padding:20px;overflow:auto}.modal{background:#fffef9;border-radius:24px;max-width:470px;width:100%;padding:32px;box-shadow:0 24px 80px #13261e35;position:relative;max-height:calc(100dvh - 40px);overflow:auto}.modal.wide{max-width:650px}.modal h2{font-size:24px;margin:10px 0 9px}.modal .sub{font-size:12px;color:#8b9982;line-height:1.9;margin:0 0 25px}.close{position:absolute;top:15px;right:15px;background:#eff2e9;color:#819174;width:32px;height:32px;display:grid;place-items:center;border-radius:50%}.close svg{width:16px;height:16px}.modal .eyebrow{margin-top:3px}.login-switch{display:flex;background:#f0f3e9;padding:4px;border-radius:11px;margin:22px 0}.login-switch button{flex:1;background:none;border-radius:8px;padding:10px;font-size:12px;color:#89987d}.login-switch button.active{background:#fff;color:var(--green);box-shadow:0 2px 8px #34532710}.modal-actions{display:flex;gap:10px;margin-top:22px}.modal-actions .btn{flex:1}.confirm-art{width:100%;height:140px;background:#f4f0df;border-radius:15px;display:grid;place-items:center;margin:20px 0}.confirm-art svg{width:75px;height:75px;color:#b5a067}.confirm-summary{display:flex;justify-content:space-between;padding:13px 0;font-size:12px;border-bottom:1px solid var(--line)}.confirm-summary strong{color:var(--green)}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,30px);background:#2d5e4f;color:white;border-radius:12px;padding:14px 23px;z-index:100;font-size:13px;opacity:0;pointer-events:none;transition:.2s;max-width:90%;text-align:center;box-shadow:0 6px 20px #23472d22}#toast.show{opacity:1;transform:translate(-50%,0)}.hall-display{background:#f6f2e4;border-radius:17px;text-align:center;padding:27px;margin:20px 0}.hall-display svg{width:55px;height:55px;color:#bfaa67;margin:0 auto 15px}.hall-display strong{font-size:22px}.hall-display p{font-size:11px;color:#9d9271;line-height:1.8}.avatar-select{display:flex;gap:12px;margin:8px 0 22px}.avatar-option{padding:12px;border:2px solid #e5eada;border-radius:13px;background:#f7f8f0;flex:1;text-align:center;font-size:11px}.avatar-option:has(input:checked){border-color:var(--green)}.avatar-option svg{height:80px;margin:auto}.avatar-option input{position:absolute;opacity:0;width:1px}.avatar-option:focus-within{outline:3px solid #d5a444;outline-offset:2px}.avatar-option span{display:block;margin-top:6px}.offline{padding:13px;background:#f8eddf;color:#a1855f;text-align:center;font-size:12px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:1500px){.campus-layout{grid-template-columns:minmax(0,1fr) 315px}.profile-card{padding:28px}.avatar-stage{height:160px}.avatar-stage svg{height:145px;width:100px}.profile-name{font-size:21px}}
@media(max-width:1150px){.topbar{padding:0 28px;gap:15px}.topnav .navbtn{padding:10px 13px}.brand-name{font-size:12px}.brand-sub{font-size:8px}.private{display:none}main{padding:22px 28px}.campus-layout{grid-template-columns:minmax(0,1fr) 250px;gap:18px}.profile-card{padding:18px}.avatar-stage{height:110px}.avatar-stage svg{height:104px}.coinbox{margin:15px 0 12px;padding:12px}.coin-value{font-size:30px}.welcome-note{padding:15px}.shop-grid{grid-template-columns:repeat(3,1fr)}.map-bottom{font-size:9px;bottom:17px;left:14px}.map-top{left:14px;top:14px;font-size:9px}.map-controls{bottom:14px;right:13px;grid-template-columns:29px 29px 29px;grid-template-rows:29px 29px}.pagehead h1{font-size:28px}.teacher-layout{grid-template-columns:1fr 245px}}
@media(max-width:850px){.topbar{height:auto;min-height:85px;flex-wrap:wrap;padding:20px 24px 12px}.brand-name{font-size:14px}.topright{margin-left:auto}.topnav{order:3;width:100%;justify-content:center;margin-top:4px}.topnav .navbtn{flex:1;justify-content:center;font-size:12px}.brand-sub{font-size:9px}main{padding:18px 24px}.campus-layout{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}.profile-card{display:grid;grid-template-columns:85px 1fr;column-gap:15px;padding:20px;text-align:left}.profile-card .card-kicker{grid-column:1/-1;margin-bottom:8px}.avatar-stage{grid-row:2/5;height:120px;grid-column:1}.avatar-stage:before{width:80px;height:75px}.profile-name{grid-column:2;font-size:16px;margin-top:9px}.profile-meta{grid-column:2}.coinbox{grid-column:2;padding:8px;margin:12px 0}.coin-label{display:none}.coin-value{font-size:25px;justify-content:flex-start;margin-left:8px}.profile-card>.btn,.profile-card>.textbtn{grid-column:1/-1}.welcome-note{display:none}.quick-card{align-self:stretch;flex-direction:column;justify-content:center;gap:16px;text-align:center}.quick-card .arrow{display:none}.quick-card>svg{height:49px;width:49px;padding:11px}.quick-card strong{font-size:13px}.quick-card span{font-size:11px}.map-top{top:18px;left:20px}.map-controls{grid-template-columns:38px 38px 38px;grid-template-rows:38px 38px;right:20px;bottom:18px}.map-bottom{bottom:20px;left:20px;font-size:10px}.daytag{font-size:10px}.account-layout{grid-template-columns:1fr}.account-layout .profile-card{max-width:450px}.teacher-layout{grid-template-columns:1fr}.grantbox{position:static}.shop-grid{gap:15px}.reward-art{height:130px}.costume-grid{grid-template-columns:repeat(4,1fr)}.statgrid{gap:12px}}
@media(max-width:560px){.topbar{padding:17px 17px 10px;gap:9px}.brandmark{width:39px;height:39px;border-radius:12px}.brandmark svg{width:25px;height:25px}.brand-name{font-size:11px}.brand-sub{font-size:8px;letter-spacing:1.4px}.brand{gap:9px}.small-login{font-size:10px;padding:8px 0}.topnav .navbtn{padding:10px 8px;font-size:11px;gap:5px}.navbtn svg{width:16px;height:16px}main{padding:19px 17px}.pagehead{margin-bottom:21px}.pagehead h1{font-size:25px;letter-spacing:0;margin:9px 0}.pagehead p{font-size:11px}.daytag{display:none}.eyebrow{font-size:9px;letter-spacing:2px}.campus-map{aspect-ratio:1000/760}.map-shell{border-width:5px;border-radius:19px}.map-top{font-size:8px;top:9px;left:9px;padding:7px 9px}.map-bottom{font-size:8px;left:9px;bottom:9px;max-width:180px;padding:7px}.map-controls{grid-template-columns:31px 31px 31px;grid-template-rows:31px 31px;gap:3px;right:9px;bottom:9px}.map-caption{font-size:9px;padding:12px 2px;gap:5px}.map-caption span:last-child{display:none}.sidebar{grid-template-columns:1fr;gap:12px}.profile-card{padding:17px;grid-template-columns:75px 1fr 105px;gap:0 12px}.profile-card .card-kicker{grid-column:1/-1;font-size:10px}.avatar-stage{grid-row:2/5;height:106px}.avatar-stage svg{height:98px;width:70px}.profile-name{font-size:15px;margin-top:17px}.profile-meta{font-size:10px;margin-top:4px}.coinbox{grid-column:3;grid-row:2/4;align-self:center;padding:10px 4px}.coin-value{font-size:24px;margin:0;justify-content:center}.coin-value .coin-icon{width:21px;height:21px;font-size:11px}.profile-card>.btn{grid-column:2/4;margin-top:12px;padding:10px;font-size:11px;min-height:38px}.profile-card>.textbtn{grid-column:1/-1}.quick-card{display:none}.footer{margin-top:20px;font-size:8px;gap:10px;align-items:flex-start;line-height:1.8}.footer button{font-size:9px;white-space:nowrap}.shop-grid{grid-template-columns:repeat(2,1fr);gap:12px}.reward-card{padding:11px;border-radius:16px}.reward-art{height:110px;margin-bottom:14px}.reward-art svg{width:60px;height:60px}.reward-card h3{font-size:12px}.stock{font-size:9px;margin:8px 0 12px}.price{font-size:15px;gap:4px}.price .coin-icon{width:17px;height:17px;font-size:9px}.reward-bottom .btn{font-size:10px;padding:8px 10px;min-height:33px}.tier{font-size:8px;top:8px;left:8px;padding:4px 6px}.balance-pill{padding:9px 10px;font-size:12px;gap:5px}.balance-pill small{display:none}.tabs{gap:6px;margin-bottom:19px}.tab{font-size:10px;padding:9px 14px}.panel{padding:18px}.panel h2{font-size:15px}.statgrid{gap:8px}.stat{padding:15px 11px;border-radius:13px}.stat small{font-size:9px}.stat strong{font-size:24px}.stat span{font-size:8px}.modal{padding:27px 22px;border-radius:20px}.modal h2{font-size:22px}.modal .sub{font-size:11px}.costume-grid{grid-template-columns:repeat(2,1fr)}.toolbar{flex-wrap:wrap}.toolbar select{flex:1}.teacher-layout{gap:16px}.form-row{gap:11px}.account-layout .profile-card{max-width:none}.record{gap:10px}.record strong{font-size:11px}.record .amount{font-size:14px}.record small{font-size:9px}.info-banner{font-size:10px;padding:12px 14px}.section-title .btn{font-size:10px;padding:9px 11px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* Bright illustrated campus, with all game controls rendered as real buttons. */
:root{--ink:#244269;--muted:#7990a5;--green:#327aab;--dark:#245d87;--light:#e7f2fc;--paper:#f2f7fc;--line:#dce8f2;--shadow:0 8px 28px #254e8112}
body{background:linear-gradient(180deg,#e8f5ff 0,#f7fbff 420px,#f2f7fc 100%)}.brandmark{background:linear-gradient(155deg,#3ca2d2,#2669a0);box-shadow:0 4px 0 #d4e4f1}.topnav{background:#dfedfa;border:1px solid #ccdff0}.navbtn.active{box-shadow:0 3px 0 #bad0e5;color:#24577f}.brand-name{color:#24446d}.brand-sub{color:#7290ac}.private{color:#7a91a5}.btn{box-shadow:0 3px 0 #1f4e7520}.btn.secondary{box-shadow:none}.tabs .tab{background:#e4eff8;color:#6a88a1}.tabs .tab.active{background:#327aab;color:white}.eyebrow{color:#5f8aa8}.badge.done{background:#e1f3e9;color:#388268}.badge.rejected{background:#fbe8e2;color:#b36d5a}.campus-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 20px;gap:18px}.campus-heading h1{font-size:28px;letter-spacing:.5px;margin:10px 0 0;color:#234775}.campus-heading .eyebrow{font-size:9px;letter-spacing:2px}.campus-help{font-size:12px;color:#6f8aa3;display:flex;gap:7px;align-items:center}.campus-help svg{width:17px;height:17px}.anime-campus{border:5px solid #fff;border-radius:24px;background:#e4f1fb;box-shadow:0 10px 35px #234c7920}.anime-campus .campus-map{aspect-ratio:1000/660;display:block;width:100%;height:auto}.game-profile{position:absolute;top:21px;left:22px;z-index:3;display:flex;align-items:center;gap:13px;background:#f6fcffef;border:2px solid #3777a9;box-shadow:0 4px 0 #1c4d6e22;border-radius:19px;padding:10px 21px 10px 10px;min-width:225px;pointer-events:none}.game-avatar{width:65px;height:65px;overflow:hidden;border:2px solid #9abbd6;border-radius:50%;background:#deeffb}.game-avatar svg{width:62px;height:88px;transform:translateY(2px) scale(1.35);transform-origin:top center}.game-profile strong{display:block;font-size:18px;font-weight:900;color:#254977}.game-profile span{display:block;font-size:11px;color:#6483a0;margin-top:6px}.game-wallet{position:absolute;right:23px;top:22px;z-index:3;border-radius:17px;background:linear-gradient(#315c86,#264867);border:2px solid #fff3d0;box-shadow:0 4px 0 #173e5f25;display:flex;align-items:center;gap:11px;padding:10px 12px 10px 15px;color:#fff}.wallet-number{display:flex;align-items:center;gap:10px;font-size:29px;font-weight:800;font-family:Arial,sans-serif}.game-wallet small{font-size:10px;color:#c8e1f4}.game-wallet .coin-icon{width:33px;height:33px;font-size:17px;box-shadow:inset 0 0 0 3px #ffdc72,0 2px 0 #946b16}.coin-add{height:37px;width:37px;background:linear-gradient(#84d85d,#4db035);border:2px solid #d0f9a9;color:white;border-radius:11px;display:grid;place-items:center;box-shadow:0 3px 0 #22581e}.coin-add:hover{filter:brightness(1.06)}.coin-add svg{width:25px;height:25px;stroke-width:3}.map-shortcuts{position:absolute;bottom:19px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:3}.map-shortcuts button{display:flex;flex-direction:column;align-items:center;gap:6px;justify-content:center;width:87px;min-height:77px;padding:10px;background:linear-gradient(#fff,#eaf4fd);color:#2c4f7a;border:2px solid #4f85af;border-radius:17px;box-shadow:0 4px 0 #1c4e6a35;font-size:12px;font-weight:800;white-space:nowrap}.map-shortcuts button svg{width:28px;height:28px;color:#3b8bbf;stroke-width:1.9}.map-shortcuts button:nth-child(1) svg{color:#c4893e}.map-shortcuts button:nth-child(3) svg{color:#d9a13c}.map-shortcuts button:hover{background:#fff;transform:translateY(-2px)}.anime-campus .map-controls{bottom:21px;right:22px;grid-template-columns:39px 39px 39px;grid-template-rows:39px 39px;gap:5px}.anime-campus .map-controls button{background:linear-gradient(#fff,#e7f4ff);border:2px solid #5685ab;color:#2c6091;box-shadow:0 3px 0 #1e506029;border-radius:11px}.return-spawn{position:absolute;left:19px;bottom:23px;display:flex;align-items:center;gap:5px;border:1px solid #e3c997;background:#fff9e9e8;padding:10px;border-radius:10px;color:#967640;font-size:10px}.return-spawn svg{width:15px;height:15px}.map-caption{color:#6d88a0;padding:17px 3px;font-size:11px}.campus-login-strip{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid #dce8f1;border-radius:15px;padding:15px 20px;gap:15px;font-size:12px;color:#6c87a1}.request-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.request-record{gap:20px}.request-record .review-note{color:#658399;line-height:1.8}.request-options{display:flex;flex-direction:column;gap:11px;margin-bottom:22px}.request-option{display:flex;align-items:center;gap:13px;padding:16px;border:2px solid #dde8f0;border-radius:14px;background:#f8fcff;cursor:pointer}.request-option:has(input:checked){border-color:#4a92c1;background:#edf7ff}.request-option.disabled{opacity:.52;cursor:default}.request-option input{display:inline-block;width:18px;min-height:18px;accent-color:#3788b9;margin:0}.request-option span{flex:1}.request-option strong{font-size:13px;color:#385c7b}.request-option small{display:block;font-size:10px;color:#829aaf;margin-top:7px}.request-option b{font-size:23px;color:#ba8a36}.confirm-summary{gap:18px}.confirm-summary strong{text-align:right}.modal .sub strong{display:block;margin-top:7px;color:#3b81ad;font-weight:700}.stat small,.helper{color:#7890a1}.footer{color:#8aa0af}.footer button{color:#627f99}.avatar-select .avatar-option{background:#edf6fc}.avatar-option:has(input:checked){border-color:#4384b2}
@media(min-width:1500px){.anime-campus{max-height:none}.game-profile{top:27px;left:28px}.game-wallet{top:28px;right:28px}.map-shortcuts{bottom:26px}.map-shortcuts button{width:97px;min-height:88px;font-size:13px}}
@media(max-width:850px){.campus-heading h1{font-size:24px}.campus-help{font-size:10px}.game-profile{top:14px;left:14px;min-width:185px;padding:8px 13px 8px 8px;border-radius:16px;gap:9px}.game-avatar{width:48px;height:48px}.game-avatar svg{width:46px;height:64px}.game-profile strong{font-size:15px}.game-profile span{font-size:10px;margin-top:4px}.game-wallet{top:14px;right:14px;padding:8px 10px;gap:7px}.wallet-number{font-size:24px;gap:7px}.game-wallet .coin-icon{width:26px;height:26px;font-size:13px}.coin-add{width:32px;height:32px}.game-wallet small{display:none}.map-shortcuts{bottom:14px;gap:7px}.map-shortcuts button{width:68px;min-height:64px;padding:8px 7px;border-radius:13px;font-size:10px;gap:5px}.map-shortcuts button svg{height:25px;width:25px}.anime-campus .map-controls{bottom:15px;right:14px;grid-template-columns:31px 31px 31px;grid-template-rows:31px 31px;gap:4px}.return-spawn{left:13px;bottom:18px;padding:8px;font-size:9px}.map-caption{font-size:10px}.campus-login-strip{font-size:11px}}
@media(max-width:560px){.campus-heading{margin-bottom:15px}.campus-heading h1{font-size:22px}.campus-help{display:none}.campus-heading .eyebrow{font-size:8px;letter-spacing:1.5px}.anime-campus{overflow:visible;border-radius:17px;margin-bottom:77px}.anime-campus .campus-map{border-radius:12px;overflow:hidden;aspect-ratio:1000/660}.game-profile{top:9px;left:9px;min-width:0;gap:6px;padding:5px 9px 5px 5px;border-width:1.5px;border-radius:12px;max-width:58%}.game-avatar{width:32px;height:32px;flex-shrink:0}.game-avatar svg{width:31px;height:44px}.game-profile strong{font-size:11px;max-width:115px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.game-profile span{font-size:8px;margin-top:3px}.game-wallet{top:10px;right:8px;padding:6px;gap:5px;border-width:1.5px;border-radius:10px}.wallet-number{font-size:17px;gap:5px}.game-wallet .coin-icon{width:20px;height:20px;font-size:10px;border-width:1.5px}.coin-add{width:26px;height:26px;border-radius:8px;border-width:1.5px}.coin-add svg{width:20px;height:20px}.map-shortcuts{bottom:-75px;width:100%;gap:6px;justify-content:flex-start;left:0;transform:none}.map-shortcuts button{flex:1;width:auto;min-height:61px;font-size:9px;padding:8px 3px;border-radius:12px}.map-shortcuts button svg{width:22px;height:22px}.anime-campus .map-controls{bottom:10px;right:8px;grid-template-columns:27px 27px 27px;grid-template-rows:27px 27px;gap:3px}.anime-campus .map-controls button{border-width:1px;border-radius:8px}.anime-campus .map-controls svg{width:15px;height:15px}.return-spawn{font-size:8px;padding:6px;left:7px;bottom:10px;gap:3px}.return-spawn svg{width:12px;height:12px}.map-caption{font-size:9px;line-height:1.8;margin-top:10px;padding:13px 2px}.campus-login-strip{flex-direction:column;align-items:stretch;padding:15px;font-size:10px;text-align:center}.campus-login-strip .btn{width:100%}.request-status{gap:5px}.request-status .btn{padding:8px;min-height:35px;font-size:10px}.request-record{align-items:flex-start;gap:9px}.request-record .badge{font-size:8px}.request-option{gap:10px;padding:13px}.request-option strong{font-size:11px}.request-option small{font-size:9px}.request-option b{font-size:20px}}
/* Keep controls outside the walking surface so no destination hides the player. */
.campus-controls-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 18px;background:linear-gradient(#f5fbff,#e7f2fc);border-top:2px solid #d6e6f3;min-height:95px}.campus-controls-row .map-shortcuts{position:static;transform:none;margin:0;order:2;display:flex;width:auto;justify-content:center;gap:8px}.campus-controls-row .map-shortcuts button{width:79px;min-height:66px;border-radius:13px;font-size:11px;padding:8px}.campus-controls-row .map-shortcuts button svg{width:24px;height:24px}.campus-controls-row .return-spawn{position:static;order:1;flex-shrink:0;background:white;border-color:#ccddea;color:#6287a5}.anime-campus .campus-controls-row .map-controls{position:static;order:3;flex-shrink:0;grid-template-columns:32px 32px 32px;grid-template-rows:32px 32px;gap:4px}.anime-campus{overflow:hidden;margin-bottom:0}.campus-heading{--campus-width:min(100%,calc((100dvh - 270px) * 1.51515));max-width:var(--campus-width);margin-inline:auto}.anime-campus{width:min(100%,calc((100dvh - 270px) * 1.51515));margin-inline:auto}.map-caption,.campus-login-strip{max-width:min(100%,calc((100dvh - 270px) * 1.51515));margin-inline:auto}.campus-heading h1{font-size:23px;margin-top:7px}.campus-help{font-size:10px}.anime-campus .game-profile{min-width:0;max-width:57%;padding:7px 13px 7px 7px;gap:8px;top:14px;left:14px}.anime-campus .game-avatar{height:48px;width:48px}.anime-campus .game-avatar svg{width:46px;height:64px}.anime-campus .game-profile strong{font-size:14px}.anime-campus .game-profile span{font-size:9px}.anime-campus .game-wallet{top:16px;right:15px;padding:8px 10px;gap:7px}.anime-campus .wallet-number{font-size:24px}.anime-campus .game-wallet small{font-size:9px}
@media(min-width:851px){.topbar{height:81px}main{padding-top:13px}.campus-heading{margin-bottom:15px}.campus-controls-row .map-shortcuts{gap:6px}.campus-controls-row .map-shortcuts button{width:70px}.campus-controls-row{padding:12px 14px;gap:10px}.anime-campus .map-controls button{border-width:1px}}
@media(max-width:850px){.anime-campus,.campus-heading,.map-caption,.campus-login-strip{width:100%;max-width:100%}.campus-controls-row{padding:12px;gap:10px;min-height:87px}.campus-controls-row .map-shortcuts button{width:67px;font-size:10px;min-height:61px}.campus-controls-row .return-spawn{font-size:9px}.campus-heading h1{font-size:23px}.anime-campus .game-profile strong{font-size:14px}}
@media(max-width:560px){.anime-campus{margin-bottom:0;overflow:hidden}.campus-controls-row{display:grid;grid-template-columns:1fr auto;gap:13px;padding:12px}.campus-controls-row .map-shortcuts{grid-column:1/-1;order:1;width:100%;gap:6px}.campus-controls-row .map-shortcuts button{flex:1;width:auto;min-height:59px;font-size:9px}.campus-controls-row .return-spawn{order:2;justify-self:start}.anime-campus .campus-controls-row .map-controls{order:3;grid-template-columns:29px 29px 29px;grid-template-rows:29px 29px}.anime-campus .game-profile{top:8px;left:8px;gap:6px;padding:5px 9px 5px 5px}.anime-campus .game-avatar{width:31px;height:31px}.anime-campus .game-avatar svg{width:30px;height:43px}.anime-campus .game-profile strong{font-size:10px}.anime-campus .game-profile span{font-size:8px}.anime-campus .game-wallet{top:9px;right:8px;padding:6px;gap:5px}.anime-campus .wallet-number{font-size:17px}.anime-campus .game-wallet small{display:none}.map-caption{margin-top:0}.campus-heading h1{font-size:22px}}

.draw-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.draw-preview>div{display:flex;flex-direction:column;align-items:center;background:#eef7ff;border-radius:12px;padding:8px 4px}.draw-preview svg{width:76px;height:106px;max-width:100%}.draw-preview span{font-size:14px;text-align:center;color:#254469}

textarea{width:100%;font:inherit;font-size:16px;line-height:1.6;padding:12px;border:1px solid #b8cddd;border-radius:10px;resize:vertical}.record .btn{margin-top:8px}td .btn{margin:3px}

.uncollected>svg{filter:grayscale(1);opacity:.45}.draw-preview small{font-size:12px;text-align:center;color:#47647b;margin-top:5px}.collection-progress{font-size:18px;color:#254b76}.uncollected{background:#f1f3f5}

.teacher-board{max-width:1400px;margin:auto}.board-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.board-heading h1{font-size:30px;margin:6px 0}.board-heading p{font-size:16px;color:#526580;margin:8px 0}.board-tools{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:20px 0}.board-tools label{font-size:14px;font-weight:700;display:grid;gap:5px}.board-tools select,.board-tools input{border:1px solid #cdd5e2;border-radius:12px;background:white;padding:12px;font-size:16px;min-height:48px}.board-tools input{flex:1;min-width:180px}.board-tools .btn{min-height:48px}.board-selection{display:flex;align-items:center;gap:14px;flex-wrap:wrap;min-height:64px;padding:12px 18px;background:#eef1ff;border-radius:14px;margin-bottom:18px;color:#414879}.board-selection span{font-size:14px}.student-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:14px}.student-tile{background:white;border:2px solid #e5e8f0;border-radius:18px;overflow:hidden;position:relative;min-height:216px;color:#27374c;box-shadow:0 3px 0 #27374c08}.student-tile.chosen{border-color:#6157bf;background:#f1efff;box-shadow:0 0 0 2px #6157bf33}.student-card-main{display:flex;align-items:center;flex-direction:column;width:100%;border:0;background:transparent;color:inherit;padding:25px 10px 10px;min-height:180px}.student-card-main>svg{width:74px;height:104px}.student-card-main strong{font-size:18px;margin:8px 0 4px;overflow-wrap:anywhere}.student-card-main>span:last-child{font-size:13px;color:#64758b}.student-coins{position:absolute;right:9px;top:9px;min-width:38px;padding:8px;border-radius:24px;background:#76bc37;color:white;font-size:18px;font-weight:800}.student-selected{position:absolute;top:12px;left:12px;color:#6055bd;font-size:22px}.student-manage{border:0;border-top:1px solid #edf0f4;width:100%;padding:10px;background:transparent;color:#637084;min-height:44px;font-size:14px}.class-tile,.add-student-tile{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;padding:16px}.class-tile{background:#f0efff;color:#514697}.class-icon{background:#e2defa;border-radius:50%;padding:18px}.class-icon svg,.add-student-tile>svg{width:50px;height:50px}.class-tile strong,.add-student-tile strong{font-size:18px}.class-tile>span:last-child{font-size:14px}.add-student-tile{color:#3885b1;border-style:dashed}.student-actions{display:grid;gap:12px}.quick-award-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.quick-award-option{border:2px solid #e0e9d5;background:#f5fbef;border-radius:16px;padding:20px 10px;display:flex;flex-direction:column;align-items:center;gap:9px;min-height:150px;color:#294638}.quick-award-option>span{font-size:32px;font-weight:900;color:#5caa23}.quick-award-option strong{font-size:16px}.quick-award-option small{font-size:13px;color:#667b67}.award-recipients{font-size:16px;line-height:1.6;max-height:130px;overflow:auto;background:#f0f3f8;padding:14px;border-radius:12px}.custom-award summary{padding:14px 0;font-size:16px;cursor:pointer}.custom-award form{padding-top:8px}.board-empty{font-size:16px}.teacher-board button:focus-visible{outline:3px solid #5d50bb;outline-offset:2px}.student-card-main:hover,.quick-award-option:hover{background:#eeefff}@media(max-width:600px){.board-heading h1{font-size:25px}.board-heading{align-items:start}.student-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.board-tools input{width:100%;flex-basis:100%}.quick-award-options{grid-template-columns:repeat(2,minmax(0,1fr))}.board-selection{padding:12px}.board-selection .btn{flex:1}.student-tile{min-height:210px}}
/* English labels wrap naturally on classroom iPads and smaller screens. */
html[lang=en] .brand-name{max-width:310px;line-height:1.35;font-size:14px;letter-spacing:0}
html[lang=en] .topbar{gap:18px}
html[lang=en] .tabs{flex-wrap:wrap}
html[lang=en] .tab{white-space:normal;line-height:1.4}
html[lang=en] .btn{white-space:normal;line-height:1.35}
html[lang=en] .reward-bottom{flex-wrap:wrap;gap:10px}
html[lang=en] .reward-card h3{min-height:2.6em;line-height:1.3}
html[lang=en] .campus-controls-row{flex-wrap:wrap}
html[lang=en] .campus-controls-row .map-shortcuts{flex:1;flex-wrap:wrap}
html[lang=en] .campus-controls-row .map-shortcuts button{white-space:normal;width:94px;line-height:1.25}
html[lang=en] .game-wallet small{max-width:65px;line-height:1.3}
html[lang=en] .campus-heading h1{line-height:1.3}
html[lang=en] .campus-help{max-width:145px}
html[lang=en] .modal h2{padding-right:24px}
html[lang=en] .request-record{flex-wrap:wrap}
@media(max-width:700px){html[lang=en] .campus-controls-row .map-shortcuts{order:0;flex-basis:100%}html[lang=en] .campus-controls-row .map-shortcuts button{flex:1;min-width:65px}html[lang=en] .brand-name{max-width:220px;font-size:12px}html[lang=en] .board-heading{flex-wrap:wrap}}
.language-control select{font:inherit;font-size:14px;min-height:40px;max-width:140px;padding:8px 26px 8px 10px;color:#254b76;background:#fff;border:1px solid #aac5d9;border-radius:10px;cursor:pointer}.topright{flex-wrap:wrap}.language-control select:focus-visible{outline:3px solid #3885b1;outline-offset:2px}@media(max-width:560px){.topright{gap:10px}.language-control select{max-width:125px;font-size:14px}.topbar{flex-wrap:wrap}}