:root{--navy:#102336;--navy2:#173148;--sky:#d6e9e8;--ink:#203246;--muted:#627485;--white:#fff;--cream:#fcf8ec;--gold:#f8c86c;--green:#197967;--red:#c85352;--line:#d8e4e3;--shadow:0 16px 42px rgba(18,38,47,.14)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;background:#dceae4;background-image:radial-gradient(circle at 8% 5%,#fff8d9 0,transparent 34%),radial-gradient(circle at 87% 12%,#b5d7d9 0,transparent 33%),linear-gradient(180deg,#e7f3e9,#dbe8e3)}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.5)}button:focus-visible,select:focus-visible,input:focus-visible,[role=button]:focus-visible{outline:3px solid #f3af4b;outline-offset:3px}#app{max-width:1500px;margin:0 auto;padding:18px 18px 48px}.sitebar{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-bottom:14px}.logo{display:flex;gap:12px;align-items:center}.crest{display:grid;place-items:center;background:linear-gradient(145deg,#1b5061,#0e263a);color:#fff;border:2px solid #fbce78;box-shadow:3px 4px 0 #244055;aspect-ratio:1;width:57px;border-radius:17px;font-size:28px}.logo h1{font-family:Georgia,"Yu Mincho",serif;font-size:clamp(21px,2.5vw,32px);letter-spacing:1px;color:#123448;margin:0}.eyebrow{font-size:10px;font-weight:900;letter-spacing:2.4px;color:#60818c;text-transform:uppercase}.header-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.tag{display:inline-flex;align-items:center;gap:5px;border:1px solid #d1e1df;border-radius:99px;padding:8px 12px;background:#fffaf1;font-weight:850;font-size:12px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:7px;min-height:44px;padding:11px 17px;border:0;border-radius:12px;background:#fff;color:#284553;font-weight:900;font-size:14px;box-shadow:0 3px 0 rgba(0,0,0,.08);transition:transform .12s,filter .12s}.btn:hover:not(:disabled){transform:translateY(-1px);filter:brightness(.97)}.btn.main{background:#147a69;color:#fff;box-shadow:0 4px 0 #0e554c}.btn.gold{background:#f4bf61;color:#3d2b12;box-shadow:0 4px 0 #c38b37}.btn.navy{background:#17374a;color:#fff}.btn.red{background:#c74a51;color:#fff}.btn.light{background:#eef6f3;color:#24575a;box-shadow:none;border:1px solid #c6dfda}.btn.ghost{background:transparent;border:1px solid #b8ccd0;box-shadow:none}.btn.xs{min-height:33px;padding:7px 11px;font-size:11px}.btn.big{font-size:17px;min-height:57px;padding:14px 23px;border-radius:15px}.btn.block{width:100%}.btnrow{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.card{background:rgba(255,255,255,.95);border:1px solid #d4e0dc;border-radius:22px;box-shadow:var(--shadow)}.pad{padding:22px}.hero{background:linear-gradient(115deg,#102b3f 0%,#215967 68%,#326f68);color:#fff;border-radius:23px;padding:27px 32px;overflow:hidden;position:relative;margin-bottom:18px}.hero:after{content:'✦　♜　✦';position:absolute;font-size:105px;color:#ffffff18;right:-25px;top:-4px;pointer-events:none}.hero h2{font:700 clamp(25px,3.2vw,42px) Georgia,"Yu Mincho",serif;letter-spacing:.5px;margin:0 0 11px;line-height:1.2;position:relative}.hero p{color:#deebe9;line-height:1.8;font-size:14px;max-width:760px;position:relative;margin:0}.setup{display:grid;grid-template-columns:1.12fr .88fr;gap:17px}.section-title{font-size:18px;margin:0 0 15px;color:#1e3a4d}.muted{color:var(--muted)}.small{font-size:12px;line-height:1.7}.tiny{font-size:11px;line-height:1.5}.fieldgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.field{display:grid;gap:6px}.field label{font-size:12px;font-weight:850;color:#526d7a}.field select,.field input{border:1px solid #c5d5d6;background:#fbfefc;border-radius:11px;padding:10px 11px;min-height:47px;width:100%;color:#193947}.settingnote{background:#e9f6ee;padding:12px 14px;border-radius:12px;font-size:12px;line-height:1.75;margin-top:12px;color:#306054}.avatar-edit{display:grid;grid-template-columns:42px 1fr 160px;gap:8px;align-items:center;margin:8px 0;padding:8px;background:#f4f9f6;border:1px solid #e0eae6;border-radius:13px}.avatar-number{height:37px;width:37px;display:grid;place-items:center;background:#e2edeb;border-radius:11px;font-weight:900}.avatar-edit input,.avatar-edit select{width:100%;min-width:0;border:1px solid #c6d6d2;padding:9px 10px;background:#fff;border-radius:10px}.rules{display:grid;gap:10px}.rule{display:flex;align-items:flex-start;gap:12px;background:#f1f8f3;padding:12px;border-radius:13px}.rule .ico{font-size:25px;min-width:31px}.rule strong{font-size:13px}.rule div:last-child{font-size:12px;line-height:1.65;color:#5b6c75}.rule strong{color:#183f45}.divider{height:1px;background:#d9e4e0;margin:17px 0}.boardlayout{display:grid;grid-template-columns:minmax(0,1.58fr) minmax(325px,.77fr);gap:17px;align-items:start}.boardcard{overflow:hidden}.mapheader{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:17px 19px 0}.mapheader h2{margin:0;font-size:18px}.mapviewport{overflow-x:auto;overflow-y:hidden;padding:8px 10px 16px}.worldmap{width:100%;height:auto;min-width:660px;border-radius:17px;display:block;box-shadow:inset 0 4px 10px #0002;background:#cce8d3}.mapnode{cursor:default}.mapnode.reachable{cursor:pointer;filter:drop-shadow(0 0 8px #ffe49a)}.mapnode.reachable .node-base{stroke:#f9b83c;stroke-width:6;animation:glow 1.3s ease-in-out infinite alternate}.mapnode.reachable:hover .node-base{fill:#fff0af}.mapnode.current .node-base{stroke:#172d3e;stroke-width:5}@keyframes glow{from{stroke:#fff6af}to{stroke:#ef9234}}.legends{display:flex;gap:7px;flex-wrap:wrap;padding:0 17px 16px}.legend{font-size:11px;background:#edf5f2;color:#466370;padding:6px 9px;border-radius:99px;font-weight:850}.sidebar{display:grid;gap:15px}.roundbar{background:linear-gradient(135deg,#183a4a,#1e5561);border-radius:17px;padding:16px;color:white;display:flex;justify-content:space-between;gap:12px;align-items:center}.roundbar strong{font-size:21px}.roundbar small{color:#c9e0dc}.playerlist{display:grid;gap:8px}.playercard{display:flex;align-items:center;gap:9px;padding:10px 11px;border-radius:14px;border:2px solid transparent;background:#f2f7f5}.playercard.active{background:#fff4d8;border-color:#edb95c}.playercard .face{height:44px;width:44px;background:#fff;display:grid;place-items:center;border-radius:12px;font-size:28px;flex:none}.playercard .pdetails{flex:1;min-width:0}.playercard .pdetails b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playercard .pdetails span{font-size:11px;color:#586e75}.playercard .stats{text-align:right;font-size:11px;font-weight:850;white-space:nowrap}.hpbar{height:7px;background:#d7e5df;border-radius:99px;overflow:hidden;margin-top:5px}.hpbar i{display:block;height:100%;background:#e66564;border-radius:99px}.panel-title{font-size:16px;margin:0 0 12px}.turnbox{background:#eaf5f0;border:1px solid #bfddd2;border-radius:19px;padding:16px}.turnbox .active-title{font-size:18px;margin:0 0 4px}.diceface{background:#fff;border:2px solid #b9d9ce;border-radius:14px;font-size:43px;padding:11px;line-height:1}.dicegrid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.dicegrid .btn{padding:8px 0;font-size:20px}.reachbutton{background:white;border:1px solid #b8d8cb;border-radius:9px;padding:10px;font-weight:900;min-height:43px}.notice{background:#fff9eb;border:1px solid #f1e1b8;padding:11px 12px;border-radius:13px;font-size:12px;line-height:1.75;margin-top:11px}.eventlog{font-size:12px;line-height:1.6;color:#607781;margin:7px 0 0;border-bottom:1px solid #e7eeea;padding-bottom:7px}.eventlog:last-child{border-bottom:0}.badge{display:inline-flex;font-size:11px;font-weight:900;padding:5px 9px;background:#e3f2ed;color:#226454;border-radius:99px}.badge.gold{background:#fff0c8;color:#906023}.badge.red{background:#fbe5df;color:#ad4d43}.overlay{position:fixed;inset:0;background:rgba(12,30,43,.76);z-index:30;display:grid;place-items:center;padding:16px;overflow:auto}.dialog{background:#fffdfa;border:1px solid #d2ccae;border-radius:24px;box-shadow:0 27px 90px #0007;width:min(700px,100%);max-height:min(95vh,900px);overflow:auto;padding:25px}.dialog:focus{outline:0}.dialog h2{margin:4px 0 9px;color:#1a3d49;font-size:clamp(22px,2.5vw,29px)}.dialog h3{margin:12px 0 9px}.dialog .eventbig{font-size:53px;line-height:1.3;text-align:center}.dialog-intro{font-size:14px;line-height:1.8;color:#62717a}.quest-label{font-size:11px;font-weight:900;color:#267569;letter-spacing:1.1px}.questbox{background:#e9f7ed;border:2px solid #a9dac3;border-radius:18px;padding:16px;margin:13px 0}.quest-en{font-size:clamp(18px,2.4vw,27px);line-height:1.5;font-weight:900;white-space:pre-wrap;overflow-wrap:anywhere;margin:9px 0}.quest-jp{font-size:13px;line-height:1.7;color:#3e625e}.sample{background:#fff5d9;border:1px solid #ebd48e;border-radius:12px;padding:14px;margin:11px 0;font-size:14px;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere}.rubric{background:#f3f7f6;border:1px solid #d8e6df;border-radius:12px;padding:12px;font-size:13px;line-height:1.8;color:#4c6670}.dialog-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.dialog-actions .btn{flex:1;min-width:145px}.statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:13px 0}.statgrid div{background:#f0f7f3;border-radius:11px;padding:11px;text-align:center;font-size:11px;color:#5f7580}.statgrid strong{display:block;font-size:18px;color:#183e50}.enemycard{display:flex;gap:14px;align-items:center;background:linear-gradient(125deg,#24465b,#172c3e);border-radius:17px;padding:16px;color:white;margin:12px 0}.enemycard .enemyavatar{font-size:56px}.enemycard b{font-size:19px}.enemycard .hpbar{background:#66818b}.enemycard .hpbar i{background:#ff7675}.shopitems{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:15px}.shopitem{background:#eff7f2;border:1px solid #d2e2d7;border-radius:14px;padding:13px;display:grid;gap:7px}.shopitem b{font-size:14px}.shopitem span{font-size:12px;line-height:1.55;color:#5b6e77}.ranking{display:grid;gap:8px}.rankrow{display:flex;gap:12px;align-items:center;background:white;border:1px solid #e3e8dd;border-radius:15px;padding:12px 14px}.rankrow:first-child{background:#fff4d4;border-color:#e7c875}.rankrow strong{font-size:17px}.rankrow .rankamount{margin-left:auto;font-weight:900;font-size:19px}.banner{border-radius:16px;background:linear-gradient(110deg,#1e5260,#147766);color:#fff;padding:18px}.banner h2{color:white}.footer{text-align:center;font-size:11px;line-height:1.8;color:#667e87;padding:23px 0}.savehint{font-size:11px;color:#6c8088}.spacer{flex:1}.scoreshort{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.pillscore{font-size:11px;background:#f2f6f3;border-radius:99px;padding:7px 9px;font-weight:800}.p-avatar{font-size:21px}.empty{color:#889696;font-size:12px}.avatarchosen{color:#1e6957}.rulebox{line-height:1.8;font-size:13px;color:#45636a}.rulebox ul{padding-left:20px}.rulebox li{margin:6px 0}input[type=file]{max-width:100%}.reviewline{font-size:12px;color:#647780;line-height:1.7}.kbd{background:#e9f1ee;padding:3px 7px;border-radius:6px;font-weight:900}
@media(max-width:1180px){.boardlayout{grid-template-columns:1fr}.sidebar{grid-template-columns:1.1fr 1fr}.sidebar>.card:last-child{grid-column:1/-1}.worldmap{min-width:650px;max-width:100%}}
@media(max-width:780px){.setup{grid-template-columns:1fr}.sidebar{grid-template-columns:1fr}.sidebar>.card:last-child{grid-column:auto}.pad{padding:17px}.hero{padding:20px}.mapviewport{padding:6px}.dialog{padding:19px}}
@media(max-width:480px){#app{padding:12px 9px 30px}.sitebar{gap:9px}.crest{width:47px;font-size:23px}.logo h1{font-size:21px}.header-actions{width:100%}.header-actions .btn{padding:8px;font-size:11px;min-height:34px}.avatar-edit{grid-template-columns:34px 1fr 115px;gap:5px}.avatar-edit input,.avatar-edit select{font-size:12px;padding:8px}.fieldgrid{gap:8px}.field select,.field input{padding:8px;font-size:12px}.shopitems{grid-template-columns:1fr}.statgrid{gap:5px}.statgrid div{padding:8px}.statgrid strong{font-size:15px}.dialog-actions .btn{min-width:125px}.hero h2{font-size:24px}}
@media(prefers-reduced-motion:reduce){.mapnode.reachable .node-base{animation:none}.btn{transition:none}}
/* V2: objectively scored quizzes, listening and bundled world-flag images */
.answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:14px}
.answer-option{display:flex;align-items:center;text-align:left;gap:12px;min-height:72px;background:#fff;border:2px solid #d0dfda;border-radius:15px;padding:11px 14px;color:#243c47;font-size:15px;font-weight:800;box-shadow:0 3px 0 #e0e9e3;cursor:pointer;transition:transform .12s,background .12s}
.answer-option:hover:not(:disabled){transform:translateY(-2px);background:#f3f8f6;border-color:#509a85}
.answer-option:disabled{opacity:1;cursor:default}
.answer-mark{display:grid;flex:none;place-items:center;background:#e4f0ed;color:#346c65;width:36px;height:36px;border-radius:10px;font-weight:900;font-size:17px}
.answer-option.right-answer{border-color:#19a078;background:#e0f8e9;color:#12644d}
.answer-option.right-answer .answer-mark{background:#148660;color:white}
.answer-option.wrong-answer{border-color:#d65d63;background:#ffe7e7;color:#9b303d}
.answer-option.wrong-answer .answer-mark{background:#c34c57;color:white}
.answer-option.muted-answer{opacity:.57}
.answer-icon{margin-left:auto;font-size:23px;font-weight:900}
.quiz-feedback{margin-top:15px;padding:14px 17px;border-radius:14px;font-size:14px;line-height:1.8;border:2px solid #d6e7dc;background:#f5faf5}
.quiz-feedback.correct{border-color:#91d6b5;background:#e8f9ed}
.quiz-feedback.incorrect{border-color:#f0bdac;background:#fff4eb}
.quiz-feedback strong{display:block;font-size:19px}
.audio-panel{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:12px;padding:12px;background:#fff;border-radius:13px;border:1px solid #c8dbd2}
.audio-panel .btn{flex:1;min-width:175px}
.audio-transcript{width:100%;color:#195065;font-size:16px;font-weight:900;background:#f1f7fb;border-radius:11px;padding:13px}
.flag-wrapper{display:flex;align-items:center;justify-content:center;background:#fff;border-radius:15px;padding:13px;margin-top:12px;border:1px solid #d3e3df}
.quizflag{width:min(300px,100%);height:auto;max-height:180px;aspect-ratio:3/2;object-fit:contain;border:1px solid #c8d0cf;box-shadow:0 5px 15px #14253618}
@media(max-width:600px){.answer-grid{grid-template-columns:1fr}.answer-option{min-height:58px}.quizflag{max-height:140px}}