*{box-sizing:border-box} :root{font-family:"Malgun Gothic","Apple SD Gothic Neo",sans-serif;color:#344d40;background:#e8eddc;font-synthesis:none}body{margin:0;min-height:100dvh;overflow:hidden;background:radial-gradient(ellipse at 15% 12%,#fff9dc 0,transparent 45%),radial-gradient(ellipse at 95% 90%,#b7c9a5 0,transparent 55%),#e9eedd}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #cf9c49;outline-offset:3px}button:disabled{cursor:default;opacity:.5}.ambient{position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(103deg,transparent 0 80px,#ffffff16 82px 84px,transparent 86px 200px)}.ambient:after{content:'❧';position:absolute;right:-50px;bottom:-150px;font:600px Georgia;color:#66845212;transform:rotate(-25deg)}#app{position:absolute;width:390px;height:700px;transform-origin:top left;padding:16px 22px 12px;display:flex;flex-direction:column;gap:12px}header{display:flex;justify-content:space-between;align-items:center;height:43px}.brand{display:flex;gap:9px;font-size:14px;font-weight:bold;letter-spacing:-.5px}.brandmark{font-size:35px;line-height:37px}.brand small{display:block;font-size:9px;font-weight:400;margin-top:4px;letter-spacing:2px;color:#78806b}.tools{display:flex;gap:7px}.icon{border:1px solid #536c3d20;background:#ffffff60;color:#52664a;border-radius:50%;width:34px;height:34px;font-size:17px}.heading{display:flex;justify-content:space-between;align-items:center;margin-top:9px}.eyebrow{font-size:8px;letter-spacing:1.8px;color:#8b967d}h1{font-family:Georgia,"Batang",serif;font-size:22px;font-weight:400;letter-spacing:-1px;margin:8px 0 0}.album{border:0;background:none;color:#68795a;font-size:10px;padding:10px 0}.album span{display:block;margin:5px 0;font-size:9px;color:#929b80}.mission{height:60px;display:flex;align-items:center;justify-content:space-between;padding:9px 14px;background:#fcfaeeaa;border:1px solid #fffdf2;border-radius:12px;box-shadow:0 3px 8px #70855a05}.mission small{font-size:9px;color:#7a856d;display:block}.stats{text-align:right}.stats>span{font:22px Georgia}.stats small{font-size:7px;letter-spacing:1.5px;margin-top:3px}#targets{display:flex;align-items:center;gap:10px;height:27px}.target{font-size:21px;line-height:26px}.target.done{opacity:.23}.target.current{border-bottom:2px solid #a5ae84}#frame{position:relative;flex:1;min-height:0;border:6px solid #faf7e9;outline:1px solid #acb69870;border-radius:100px 100px 9px 9px;overflow:hidden;box-shadow:0 9px 22px #546c3b20;background:#9aab91} #frame>canvas,#enemyPreview>canvas,#pointers{position:absolute;inset:0;width:100%;height:100%}#veil{opacity:1}.frame-label{position:absolute;bottom:9px;left:12px;right:12px;display:flex;justify-content:space-between;font-size:7px;letter-spacing:2px;color:#fff9e5;pointer-events:none;text-shadow:0 1px 3px #233d30}.intro{position:absolute;inset:0;background:linear-gradient(#eaf0da30,#eff0dcaa);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.intro[hidden]{display:none}.seal{font:46px Georgia;color:#fff8d9;text-shadow:0 3px 9px #425d47}h2{font-family:Georgia,"Batang",serif;font-weight:400;font-size:27px;line-height:1.45;margin:8px 0;color:#304e3d}.intro p{font-size:11px;line-height:1.9;color:#49634d;margin:3px 0 20px}.primary{background:#405f4b;color:#fff9e8;border:1px solid #496950;border-radius:8px;padding:13px 24px;font-size:12px;box-shadow:0 4px 10px #2b443d20;min-height:44px}.primary span{margin-left:30px}.intro small{font-size:8px;color:#5c7157;margin-top:12px}.progress>div:first-child{display:flex;justify-content:space-between;font-size:10px;color:#768267;margin-bottom:8px}.progress b{font:13px Georgia;color:#47654b}.track{height:4px;background:#ced7bb;border-radius:3px;overflow:hidden}.track i{display:block;width:0;height:100%;background:#789263;transition:width .3s}footer{font-size:10px;text-align:center;color:#60735b;min-height:43px}#feedback{height:22px}.footrow{display:flex;justify-content:space-between;align-items:center;font-size:8px;color:#8b977f}#combo{font-size:7px;letter-spacing:.8px}.light{position:absolute;transform:translate(-50%,-50%);width:48px;height:48px;border:1px solid #fff5d1c0;border-radius:50%;background:#fffcebf0;box-shadow:0 0 22px #fff0b944,0 3px 5px #233b3c20;font-size:25px;display:grid;place-items:center;touch-action:manipulation}.light:after{content:'';position:absolute;inset:-4px;border-radius:50%;background:conic-gradient(#faf2c9 calc(var(--life)*1turn),transparent 0);mask:radial-gradient(transparent 64%,black 67%);pointer-events:none}.light.urgent{animation:pulse .45s infinite alternate}@keyframes pulse{to{scale:1.09}}dialog{border:1px solid #bec8aa;border-radius:22px;background:#f7f5e8;color:#344d40;max-width:min(90vw,380px);max-height:85dvh;padding:27px;text-align:center;box-shadow:0 25px 80px #172f3d40}dialog::backdrop{background:#20382b65;backdrop-filter:blur(5px)}dialog h2{font-size:24px}dialog p{font-size:12px;line-height:1.8;color:#70816b}dialog button{margin:5px}.secondary{border:1px solid #bcc7ab;border-radius:8px;padding:12px 18px;background:transparent;color:#4a654c;min-height:44px}.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:18px 0}.gallery-grid button{margin:0;border:1px solid #c9d1b9;border-radius:8px;background:#eef0df;padding:12px 6px;font-size:11px;color:#476047}.gallery-grid small{display:block;margin-top:6px;color:#819174;font-size:9px}.gallery-art{position:static;display:block;width:100%;height:auto;max-height:50dvh;object-fit:contain;margin:12px auto;border-radius:60px 60px 8px 8px}.safe-probe{position:fixed;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);visibility:hidden}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.mode-tabs{display:flex;gap:4px;background:#dce4ce;padding:3px;border-radius:10px;flex-shrink:0}.mode-tabs button{flex:1;border:0;border-radius:8px;padding:8px;color:#6a7c5e;background:transparent;font-size:11px}.mode-tabs button[aria-pressed=true]{background:#faf8eb;color:#36553c;box-shadow:0 2px 5px #465b3312}.mode-tabs small{font-size:8px;margin-left:5px}#app:has(#battleHud:not([hidden])){gap:8px}#battleHud{display:flex;gap:10px;align-items:center;min-height:47px;padding:5px 9px;background:#f7f6e9b0;border-radius:9px}#battleHud[hidden]{display:none}#enemyPreview{width:34px;height:40px;position:relative;overflow:hidden;border-radius:5px;outline:1px solid #a8b493}#battleHud b{display:block;font-size:10px}#battleHud small{display:block;font-size:8px;color:#7c896f;margin-top:4px}#battleTime{margin-left:auto;font:20px Georgia;color:#596d50}#app:has(#battleHud:not([hidden])) .heading{margin-top:0}#app:has(#battleHud:not([hidden])) h1{font-size:18px}#app:has(#battleHud:not([hidden])) .mission{height:51px}.join-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;justify-content:center;margin-top:18px}.join-row label{width:100%;font-size:11px;color:#6c7b61}.join-row input{width:150px;min-width:0;border:1px solid #b8c5a7;border-radius:8px;background:#fffdf4;padding:12px;font:16px monospace;letter-spacing:3px;color:#36553c}.room-code{font:36px monospace;letter-spacing:8px!important}.ink-drop{position:fixed;width:21px;height:23px;background:#151823;border-radius:43% 57% 58% 42%;z-index:10;pointer-events:none;box-shadow:-5px -6px 0 -4px #151823,7px 5px 0 -5px #151823}.ink-splash{position:fixed;width:72px;height:60px;background:#151823;border-radius:39% 61% 43% 57%;z-index:10;pointer-events:none;box-shadow:22px -19px 0 -21px #151823,-29px 8px 0 -21px #151823,15px 31px 0 -24px #151823;animation:inkburst .65s forwards}@keyframes inkburst{0%{transform:translate(-50%,-50%) scale(.4);opacity:1}30%{transform:translate(-50%,-50%) scale(1.2);opacity:.95}100%{transform:translate(-50%,-50%) scale(1.35);opacity:0}}.light:disabled{opacity:1}#roomMessage{min-height:20px;color:#9b665a}

#countdownText{font:700 clamp(90px,25vw,150px)/1.15 Georgia;color:#405f4b;text-shadow:0 6px 0 #d5dfc4;margin:12px 0;min-width:190px}
.record-summary{background:#e4ead6;border-radius:12px;padding:12px;font-size:12px;line-height:1.8;color:#36533d}
.match-history{list-style:none;padding:0;max-height:140px;overflow:auto;text-align:left}.match-history li{padding:8px 3px;border-bottom:1px solid #dce3cd;font-size:12px;display:flex;justify-content:space-between;gap:10px}.match-history small{font-size:9px;color:#7c896f}
#emoteBar{display:flex;justify-content:center;gap:12px;flex-shrink:0}#emoteBar[hidden]{display:none}#emoteBar button{width:48px;height:36px;border:1px solid #c7d2b8;background:#faf7e9;border-radius:16px;font-size:22px;touch-action:manipulation}
.emote-bubble{position:absolute;z-index:15;top:180px;right:26px;border:1px solid #b4c5a2;background:#fffbee;border-radius:18px 18px 3px 18px;box-shadow:0 4px 18px #405f4b30;padding:14px;font-size:18px;pointer-events:none}.emote-bubble.mine{top:auto;bottom:145px;right:auto;left:26px;border-radius:18px 18px 18px 3px}

.coin-summary{background:#f2e6be;border:1px solid #d8c28b;border-radius:12px;padding:12px;margin-top:10px;font-weight:bold;font-size:14px}.coin-pack{border:1px solid #d8c28b;background:linear-gradient(135deg,#fff9e7,#edf0db);border-radius:18px;padding:20px;margin:18px 0}.coin-pack>span{font-size:28px;color:#b08c37;letter-spacing:8px}.coin-pack h3{font-size:19px;margin:10px 0}.coin-pack strong{font-size:25px}.coin-pack small{display:block;margin-top:12px;font-size:11px;color:#718167}

dialog:has(.coin-pack){padding:20px}dialog:has(.coin-pack) p{font-size:11px;line-height:1.6;margin:10px 0}.coin-pack{padding:12px;margin:12px 0}.coin-pack h3{margin:6px 0}.coin-pack small{margin-top:8px}

/* Coin shop: six keyboard-accessible cards with a scrollable mobile dialog. */
dialog:has(.coin-grid){padding:20px;max-height:calc(100dvh - 32px);overflow-y:auto;width:min(390px,calc(100vw - 24px))}
.coin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0 8px}
.coin-choice{display:flex;flex-direction:column;align-items:center;gap:5px;position:relative;margin:0;padding:10px 6px 12px;min-width:0;border:1px solid #c8ceb5;border-radius:14px;background:#fffdf1;color:#38513d}
.coin-choice.best{background:linear-gradient(145deg,#fcf1cf,#e5ebd6)}
.coin-choice[aria-pressed=true]{border:2px solid #496b45;padding:9px 5px 11px;box-shadow:0 0 0 2px #496b4520}
.pack-badge{height:19px;font-size:10px;letter-spacing:.5px;color:#886726;font-weight:bold}
.coin-choice strong{font:700 29px Georgia;line-height:1.1}.coin-choice strong small{font:11px sans-serif;margin-left:4px}
.coin-choice>small{font-size:10px;color:#768269}.pack-price{font-size:14px;font-weight:bold}.pack-discount{font-size:11px;color:#8d582e;font-weight:bold}
dialog .coin-note{font-size:10px;line-height:1.7;margin:9px 0}dialog:has(.coin-grid) .primary{width:100%;margin:8px 0 2px;font-size:13px}

.admission-number{font:700 56px Georgia;color:#496b45;margin:24px 0}

.ranking-tabs{display:flex;gap:5px;padding:4px;border-radius:12px;background:#e0e7d2;margin:14px 0}.ranking-tabs button{flex:1;min-height:44px;margin:0;border:0;border-radius:9px;background:transparent;color:#617454}.ranking-tabs button[aria-pressed=true]{background:#fffbed;color:#36553c;box-shadow:0 2px 6px #435f3520;font-weight:bold}
.ranking-list{list-style:none;padding:0;margin:14px 0;max-height:38dvh;overflow-y:auto;text-align:left}.ranking-list li{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:6px;padding:13px 8px;border-bottom:1px solid #dbe2cf;font-size:11px}.ranking-list b{font:20px Georgia;color:#9b7c36}.ranking-list strong{font-size:12px;color:#36553c}.ranking-list .ranking-me{background:#e4ead6;border-radius:8px}.ranking-note{font-size:10px!important;line-height:1.7!important}

/* Original watercolor woodland art direction. */
:root{color:#314d40;background:#e7e4cf}body{background:linear-gradient(#f5edda78,#c9d7b475),url('/assets/forest-atelier.png') center/cover fixed}.ambient{background:linear-gradient(90deg,#2b4a3a26,transparent 30%,transparent 70%,#2b4a3a26)}.ambient:after{content:''}#app{background:linear-gradient(135deg,#fff9e9f5,#efe9d5f2);box-shadow:0 0 90px #233b3022;padding:17px 22px 12px;gap:11px}.brand{font-family:Georgia,'Batang',serif;font-size:16px;color:#344c3c;letter-spacing:.5px}.brandmark{color:#7c8b55}.brand small{font-family:sans-serif;letter-spacing:3px;font-size:8px;color:#8c825f}.icon{background:#fffaf0;border-color:#b7b29580;color:#6f7851}.mode-tabs{background:#d9ddc7;border:1px solid #bfc5a280;border-radius:20px;padding:4px}.mode-tabs button{border-radius:16px;min-height:33px}.mode-tabs button[aria-pressed=true]{background:#42634d;color:#fff6df;box-shadow:0 2px 5px #253f3425}.heading{margin-top:4px}h1{font-size:23px;font-weight:600;color:#354c3c}.eyebrow{color:#998654;letter-spacing:2px}.album{color:#737e55}.mission{background:#fffaf0;border:1px solid #d2c6a780;border-radius:5px 15px 5px 15px;box-shadow:0 3px 8px #816b3210}.stats>span{color:#9d793d}#frame{border:5px solid #fff8e6;outline:1px solid #b5a77c;border-radius:78px 78px 8px 8px;box-shadow:0 7px 20px #4a513526,0 0 0 4px #d6c9a339}.intro{justify-content:flex-end;padding:20px 12px 25px;background:linear-gradient(180deg,transparent 10%,#fff4d605 32%,#fff4d6d9 66%,#fff5de 100%)}.intro .seal{font-size:24px;color:#627447;text-shadow:none;line-height:1}.intro h2{font-size:26px;font-weight:600;line-height:1.35;letter-spacing:-.8px;margin:5px 0 7px}.intro p{font-size:10px;margin:0 0 13px;color:#647252}.intro small{color:#817951;margin-top:9px}.primary{background:linear-gradient(135deg,#527451,#365942);border-color:#365942;border-radius:22px;color:#fff6dd;box-shadow:0 3px 0 #294732,0 5px 14px #30493022;letter-spacing:.4px}.primary:hover{filter:brightness(1.08)}.secondary{background:#fffaf0;border-color:#c6b991;border-radius:18px}.track{height:5px;background:#d8d5ba}.track i{background:linear-gradient(90deg,#9aab6e,#567a50)}.progress>div:first-child{color:#747758}.footrow{color:#8e876b}.light{background:radial-gradient(circle at 35% 25%,#fffef4,#f9edcf);border:2px solid #fff7dc;box-shadow:0 0 20px #ffed9d88,0 3px 7px #35452a33}.light:after{background:conic-gradient(#c0a358 calc(var(--life)*1turn),transparent 0)}dialog{background:linear-gradient(#fff9e8f5,#f6efdb),url('/assets/forest-atelier.png') center/cover;border:1px solid #b9ac82;box-shadow:0 0 0 5px #fff8df40,0 25px 80px #173c3266;border-radius:28px 28px 12px 12px}dialog::backdrop{background:#263f3470;backdrop-filter:blur(7px)}dialog h2{color:#36553e;font-weight:600}dialog p{color:#6f7858}.record-summary{background:#e6ead4;border:1px solid #c8cfaf}.coin-summary{background:#f7e9bc;border-color:#d8c184}.ranking-tabs{background:#e2e4cc}.ranking-tabs button[aria-pressed=true]{background:#496b4e;color:#fff8e5}.ranking-list li{border-color:#d8d2b8}.coin-choice{background:#fffaeb}.coin-choice.best{background:linear-gradient(135deg,#faeab7,#e4ead0)}#battleHud{background:#fff8e7;border:1px solid #d5cba9}#emoteBar button{background:#fff8e5;border-color:#b9c39b}

.intro{justify-content:flex-start;padding-top:18px;background:linear-gradient(180deg,#fff7dfd9, #fff7df35 38%,transparent 56%,#fff5deed 100%)}.intro .seal{display:none}.intro h2{font-size:23px;margin:0 0 5px}.intro p{font-size:9px;line-height:1.6}.intro .primary{position:absolute;bottom:35px}.intro>small{position:absolute;bottom:15px;margin:0}


.together-active .mode-tabs{display:none}.together-active .album{display:none}#battleHud{min-height:110px;padding:9px;gap:11px;flex-shrink:0}#enemyPreview{width:74px;height:90px;flex-shrink:0;border:3px solid #fff8e5;border-radius:9px;box-shadow:0 2px 7px #455d3725}#battleHud .enemy-details{flex:1;min-width:0}#battleHud .enemy-caption{font-size:8px;letter-spacing:.3px;margin:0 0 6px}#battleHud b{font-size:12px}#enemyScore{display:block;font:600 18px Georgia;color:#42634d;margin-top:6px}#battleHud .enemy-track{height:5px;border-radius:4px;background:#d7d9bd;overflow:hidden;margin-top:8px}.enemy-track i{height:100%;display:block;width:0;background:#80995c;transition:width .2s}.battle-clock{text-align:right;max-width:90px}#battleTime{display:block;font:25px Georgia;color:#806437;margin:6px 0}#battleLead{font-size:8px!important;line-height:1.6}#app:has(#battleHud:not([hidden])) .heading{margin:0}#app:has(#battleHud:not([hidden])) #frame{border-radius:35px 35px 8px 8px}.paint-burst{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}.paint-balloon{position:absolute;width:38px;height:45px;border-radius:48% 48% 46% 46%;background:radial-gradient(circle at 32% 25%,#ffffffbb,transparent 28%),var(--paint);box-shadow:inset -5px -5px 9px #0002;pointer-events:none;z-index:5}.paint-balloon:after{content:'';position:absolute;bottom:-4px;left:15px;width:8px;height:7px;background:var(--paint);clip-path:polygon(50% 0,100% 100%,0 100%)}