@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
:root{font-family:'VT323','Courier New',monospace;color:#e1e7ce;background:#223d38;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#3f5b49,#223d38 65%);min-height:100dvh}button,textarea,input{font:inherit}button{cursor:pointer;color:inherit;touch-action:manipulation}button:focus-visible,canvas:focus-visible,textarea:focus-visible{outline:3px solid #e4ce8f;outline-offset:4px}main{width:min(730px,100%);padding:24px 28px 16px;margin:auto}header{display:flex;justify-content:space-between;align-items:center;height:52px;margin-bottom:14px;gap:15px}.title{font-size:27px;letter-spacing:2px;color:#eadbb0}.title span{font-size:15px;color:#a9c4a4;letter-spacing:3px;margin-left:5px}#start{border:0;background:none;font-size:18px;padding:10px 0;color:#c4d1b6}kbd{font:12px 'Courier New',monospace;border:1px solid #819c7e;border-radius:3px;padding:3px;margin-left:5px;color:#b0c2a7}.console{border:5px solid #112e2c;border-radius:5px;background:#bacb99;box-shadow:0 0 0 1px #859c6977,0 12px 0 #17312e,0 20px 50px #0c262b66;overflow:hidden}.game-top{height:29px;display:flex;justify-content:space-between;align-items:center;background:#193d36;color:#dce5bd;padding:0 11px;font-size:15px;letter-spacing:.5px;gap:8px}canvas{display:block;width:100%;height:auto;aspect-ratio:4/3;image-rendering:pixelated;image-rendering:crisp-edges;outline:none!important;touch-action:none;background:#8fae71}.message{min-height:110px;background:#edf0cf;color:#243e35;border:4px double #38543a;border-radius:3px;margin:5px;padding:11px 17px 15px;position:relative;font-size:23px;line-height:1.1}#speaker{font-size:16px;letter-spacing:1px;color:#668052;margin-bottom:4px}#text{white-space:pre-line;padding-right:15px}#advance{position:absolute;right:8px;bottom:5px;border:0;background:none;color:#3b6546;font-size:20px;min-width:32px;min-height:30px}#choices{display:flex;flex-wrap:wrap;gap:5px 10px;margin-top:8px}#choices:empty{display:none}#choices button{border:1px solid #9eae7b;background:#e0e6bb;color:#2e4b38;font-size:20px;line-height:1.15;padding:6px 11px;text-align:left;min-height:34px}#choices button:hover,#choices button:focus-visible{background:#b9ce8d}#choices button:disabled{opacity:.6;cursor:default}.under{display:flex;justify-content:space-between;gap:15px;font-size:16px;color:#a9c0a0;margin-top:25px}#saved{font-size:14px;opacity:.7}.controller{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding:0 18px}.dpad{display:grid;grid-template:repeat(3,30px)/repeat(3,30px);gap:0;filter:drop-shadow(0 4px 0 #102d2a)}.dpad button{border:0;background:#577354;color:#dce6bd;font:20px 'VT323';display:grid;place-items:center;min-width:30px;min-height:30px;touch-action:none}.dpad button:active,.dpad button.pressed{background:#8ca372;color:#183b31}.dpad button:nth-child(1){grid-area:1/2;border-radius:4px 4px 0 0}.dpad button:nth-child(2){grid-area:2/1;border-radius:4px 0 0 4px}.dpad div{grid-area:2/2;background:#577354}.dpad button:nth-child(4){grid-area:2/3;border-radius:0 4px 4px 0}.dpad button:nth-child(5){grid-area:3/2;border-radius:0 0 4px 4px}.control-note{font-size:17px;text-align:center;color:#8fae8d;line-height:1.25}.action-buttons{display:flex;gap:18px;align-items:center;transform:rotate(-14deg)}.action-buttons button{border:0;border-radius:50%;width:46px;height:46px;font:27px 'VT323';background:#b89779;color:#233f35;box-shadow:0 5px 0 #18312b;touch-action:none}.action-buttons button:last-child{background:#dbc590}.action-buttons button:active{transform:translateY(3px);box-shadow:0 2px 0 #18312b}.keys{text-align:center;font-size:14px;color:#91ad8d;margin:20px 0 0}dialog{border:4px double #38543a;background:#edf0cf;color:#294833;width:calc(100% - 32px);max-width:500px;padding:25px;border-radius:5px}dialog::backdrop{background:#0d292ac9}dialog h2{font-size:29px;font-weight:400;margin:0 0 12px}dialog p{font-size:19px;line-height:1.2}#closeImport{position:absolute;right:8px;top:7px;background:none;border:0;font-size:25px;color:#3f6141}textarea{width:100%;height:190px;background:#f8f7dc;color:#294833;border:1px solid #9bae82;font:12px/1.6 'Courier New',monospace;padding:10px;resize:vertical}input{max-width:100%;font-size:15px;margin:6px 0 12px}#error{color:#875946;font-size:18px}#load,#example{background:#365d42;color:#f0edc8;border:0;padding:10px 15px;font-size:20px;margin:5px 5px 0 0}#example{background:#d4ddb3;color:#37583b}[hidden]{display:none!important}@media(min-width:800px) and (min-height:900px){main{width:800px}.controller{margin-top:24px}.dpad{grid-template:repeat(3,35px)/repeat(3,35px)}}@media(max-width:600px){main{padding:12px 12px 15px}header{height:44px;margin-bottom:8px}.title{font-size:23px;letter-spacing:1px}.title span{display:block;font-size:11px;letter-spacing:3px;margin-left:21px}#start{font-size:17px}kbd{display:none}.game-top{font-size:12px;height:25px;padding:0 8px}.console{border-width:4px}.message{min-height:103px;font-size:21px;padding:9px 12px 13px;margin:4px}#speaker{font-size:14px}#choices button{font-size:19px;padding:6px 9px}#saved{display:none}.under{margin-top:20px;font-size:15px}.controller{padding:0 8px;margin-top:16px}.dpad{grid-template:repeat(3,36px)/repeat(3,36px)}.dpad button{min-width:36px;min-height:36px;font-size:23px}.action-buttons button{height:49px;width:49px}.control-note{font-size:15px}.keys{font-size:12px;margin-top:16px}}@media(max-width:370px){.title{font-size:21px}.message{font-size:19px}.control-note{display:none}.keys{font-size:11px}}
@media(min-width:800px){main{width:min(730px,max(490px,calc((100dvh - 350px)*1.3333 + 66px)))}.controller{display:none}}
@media(max-width:799px) and (max-height:720px){main{width:min(100%,max(340px,calc((100dvh - 395px)*1.3333 + 32px)))}.message{min-height:88px}.control-note{display:none}.controller{margin-top:12px}.under{margin-top:18px}.keys{margin-top:12px}}

.screen{position:relative}
#card{position:absolute;inset:0;display:grid;place-content:center;gap:6px;text-align:center;pointer-events:none;color:#f3ecc8;background:radial-gradient(ellipse at center,rgba(12,24,30,.72),rgba(12,24,30,.35) 70%,transparent);text-shadow:0 2px 0 #13302c;opacity:0;padding:0 20px}
#card.show{animation:card 4.2s ease forwards}
#card small{font-size:18px;letter-spacing:6px;color:#cfe0b4}
#card strong{font-size:clamp(26px,6vw,40px);font-weight:400;letter-spacing:1px;line-height:1}
@keyframes card{0%{opacity:0;transform:translateY(6px)}12%{opacity:1;transform:none}78%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){#card.show{animation:none;opacity:1}}
#text .unsaid{visibility:hidden}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.spell-button{border:0;border-radius:18px;background:#6c5f8c;color:#f1e9ff;font:19px 'VT323',monospace;letter-spacing:1px;padding:7px 14px;box-shadow:0 4px 0 #18312b;touch-action:manipulation}
.spell-button:active{transform:translateY(2px);box-shadow:0 2px 0 #18312b}

#title{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;color:#f6efcf;text-shadow:0 3px 0 #0b1420;padding:16px}
#title[hidden]{display:none!important}
#title h1{margin:0;font-weight:400;font-size:clamp(40px,10vw,70px);letter-spacing:4px;line-height:.9;animation:glimmer 3s ease-in-out infinite}
#title h1 span{display:block;font-size:.36em;letter-spacing:.5em;color:#cfe0b4;margin-top:8px}
#title .tag{margin:4px 0 14px;font-size:20px;color:#d9d0f5}
.title-buttons{display:flex;flex-direction:column;gap:8px;min-width:230px}
.title-buttons button{border:2px solid #f3dc8a;background:#1b2b45d9;color:#f6efcf;font:22px 'VT323',monospace;padding:6px 16px;border-radius:4px;text-shadow:none}
.title-buttons button:hover,.title-buttons button:focus-visible{background:#3a4f7a}
#title .press{font-size:16px;color:#a9b8d8;animation:blink 1.4s steps(2) infinite;margin:10px 0 0}
@keyframes glimmer{0%,100%{text-shadow:0 3px 0 #0b1420}50%{text-shadow:0 3px 0 #0b1420,0 0 18px #f3dc8a99}}
@keyframes blink{50%{opacity:.3}}
#pops{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.pop{position:absolute;transform:translate(-50%,0);font-size:22px;animation:pop 1.3s ease-out forwards;text-shadow:0 2px 0 #13302c;white-space:nowrap}
.pop.gold{color:#ffe08a}.pop.heart{color:#ff9fb5}
@keyframes pop{0%{opacity:0;transform:translate(-50%,6px) scale(.8)}15%{opacity:1;transform:translate(-50%,-4px) scale(1.1)}100%{opacity:0;transform:translate(-50%,-34px)}}
@media (prefers-reduced-motion:reduce){#title h1,#title .press,.pop{animation:none}}
#gleams{color:#ffe08a;white-space:nowrap}
.magic-buttons{display:flex;flex-direction:column;gap:8px;align-items:center}
.fly-button{background:#4e7f9b}
#book{max-width:660px;max-height:86dvh;overflow:auto}
#closeBook{position:absolute;right:8px;top:7px;background:none;border:0;font-size:25px;color:#3f6141}
.tabs{display:flex;gap:6px;margin:0 0 10px;flex-wrap:wrap}
.tabs button{border:1px solid #9eae7b;background:#e0e6bb;color:#2e4b38;font:20px 'VT323',monospace;padding:4px 12px}
.tabs button[aria-selected=true]{background:#365d42;color:#f0edc8}
.book-head{font-size:19px;margin:4px 0 10px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.card{border:1px solid #b9c79a;background:#f8f7dc;padding:8px;display:flex;flex-direction:column;gap:4px;line-height:1.1}
.card.caught{background:#fffbe6;border-color:#d9b26a}
.card.rare.caught{background:linear-gradient(#fff6d8,#efe4ff)}
.card .thumb{width:48px;height:48px;image-rendering:pixelated;align-self:center}
.card b{font-weight:400;font-size:19px}
.card p{margin:0;font-size:15px;color:#4a5f4a}
.card button{border:0;background:#365d42;color:#f0edc8;font:16px 'VT323',monospace;padding:4px 6px;margin-top:auto}
.treasures{font-size:19px;line-height:1.35;padding-left:20px;margin:0}
@media(max-width:600px){#gleams{font-size:12px}.title-buttons{min-width:200px}}

dialog h3{font-weight:400;font-size:22px;margin:16px 0 8px}
dialog code{font:15px 'Courier New',monospace;background:#e0e6bb;padding:0 3px}
#importDialog,#profilesDialog{max-height:88dvh;overflow:auto;max-width:560px}
.field{display:flex;flex-direction:column;gap:4px;font-size:18px;margin:6px 0}
.field input,#profileName{font:20px 'VT323',monospace;padding:6px 8px;border:1px solid #9bae82;background:#f8f7dc;color:#294833}
.import-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px}
#preview{color:#365d42;font-size:18px;min-height:0;margin:6px 0}
.deck-row,.profile-row{display:flex;gap:8px;align-items:center;border:1px solid #b9c79a;background:#f8f7dc;padding:8px;margin-bottom:6px}
.deck-row>div,.profile-row>div{flex:1;display:flex;flex-direction:column;min-width:0}
.deck-row b,.profile-row b{font-weight:400;font-size:20px;overflow-wrap:anywhere}
.deck-row small,.profile-row small{font-size:15px;color:#5a6f55}
.deck-row.current,.profile-row.current{border-color:#d9b26a;background:#fffbe6}
.deck-row button,.profile-row button,.book-actions button,#newProfile button[type=submit]{border:0;background:#365d42;color:#f0edc8;font:18px 'VT323',monospace;padding:5px 10px;white-space:nowrap}
button.ghost{background:#e0e6bb;color:#2e4b38}button.danger{color:#8a3b2e}
button:disabled{opacity:.6;cursor:default}
.modes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}
.modes label{border:1px solid #b9c79a;background:#f8f7dc;padding:8px;display:flex;flex-direction:column;gap:2px;cursor:pointer}
.modes label:has(input:checked){border-color:#365d42;background:#e7f0cf;box-shadow:inset 0 0 0 1px #365d42}
.modes input{position:absolute;opacity:0}
.modes b{font-weight:400;font-size:20px}.modes small{font-size:15px;color:#5a6f55}
.restore{font-size:17px}
.bars{display:flex;gap:6px;align-items:flex-end;height:110px;margin:4px 0 8px}
.bar{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;height:100%}
.bar .col{flex:1;width:100%;max-width:34px;display:flex;flex-direction:column;justify-content:flex-end}
.bar .ok{background:#6f9a63;display:block}.bar .miss{background:#d9a36a;display:block}
.bar small{font-size:13px;color:#5a6f55}
.deck-progress{display:flex;flex-direction:column;gap:3px;margin-bottom:10px}
.deck-progress b{font-weight:400;font-size:19px}.deck-progress small{font-size:15px;color:#5a6f55}
.meter{display:flex;height:10px;background:#e0e6bb;border:1px solid #b9c79a}
.meter .mastered{background:#6f9a63}.meter .learning{background:#e0c060}
.book-actions{display:flex;gap:8px;margin-top:12px}
@media(max-width:500px){.modes{grid-template-columns:1fr}.profile-row{flex-wrap:wrap}}
#closeProfiles{position:absolute;right:8px;top:7px;background:none;border:0;font-size:25px;color:#3f6141}

#importDialog .lead{font-size:19px;margin:0 0 12px}
.formats{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 6px}
.formats button{border:1px solid #9eae7b;background:#e0e6bb;color:#2e4b38;font:18px 'VT323',monospace;padding:5px 11px;border-radius:14px}
.formats button[aria-pressed=true]{background:#365d42;color:#f0edc8;border-color:#365d42}
.format-help{font-size:16px!important;color:#4a5f4a;margin:4px 0 8px;min-height:2.4em}
.linkish{background:none;border:0;padding:0;font:inherit;color:#365d42;text-decoration:underline;cursor:pointer}
.dropzone{position:relative;border:2px dashed #b9c79a;border-radius:4px;padding:2px;transition:border-color .15s,background .15s}
.dropzone.over{border-color:#365d42;background:#e7f0cf}
.dropzone textarea{border:0;height:170px;font:15px/1.6 'Courier New',monospace;background:#f8f7dc}
.drop-hint{position:absolute;right:10px;bottom:8px;font-size:14px;color:#8a9a78;pointer-events:none}
.upload{display:inline-flex;align-items:center;gap:6px;border:1px solid #9eae7b;background:#e0e6bb;color:#2e4b38;font-size:18px;padding:5px 12px;cursor:pointer}
.upload input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.upload:focus-within{outline:3px solid #e4ce8f;outline-offset:2px}
#fileName{font-size:15px;color:#5a6f55}
.card-preview{margin:10px 0;min-height:30px}
.card-preview p{margin:4px 0;font-size:17px!important}
.preview-ok{color:#2f6a3f}.preview-warn{color:#8a5a2e}.preview-empty{color:#8a9a78}
.card-list{list-style:none;padding:0;margin:4px 0;display:grid;gap:4px}
.card-list li{display:grid;grid-template-columns:minmax(80px,35%) 1fr;gap:10px;background:#f8f7dc;border:1px solid #d6dcb6;padding:5px 9px;font-size:16px;line-height:1.2}
.card-list li b{font-weight:700;color:#294833;overflow-wrap:anywhere}.card-list li span{color:#4a5f4a;overflow-wrap:anywhere}
.card-list li.more{display:block;color:#5a6f55;background:none;border:0;padding:2px 9px}
.optional{color:#8a9a78}
.import-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.import-actions button{border:0;background:#365d42;color:#f0edc8;font:20px 'VT323',monospace;padding:7px 16px}
.import-actions button.ghost{background:#e0e6bb;color:#2e4b38}
#load:disabled{opacity:.5;cursor:default}
.done-big{font-size:24px!important;color:#2f6a3f;margin:6px 0}
#deckSection{margin-top:18px;border-top:1px solid #c9d3a8;padding-top:10px}
#deckSection summary{cursor:pointer;font-size:19px;color:#2e4b38}
#deckList{margin-top:8px}

.formats .ai-chip{background:#efe6ff;border-color:#b9a6e8;color:#4a3a78}
.formats .ai-chip[aria-pressed=true]{background:#5b4a94;border-color:#5b4a94;color:#f4efff}
.ai-helper{background:#f4efff;border:1px solid #cfc3ef;padding:10px 12px;margin:0 0 10px}
.ai-helper ol{margin:0;padding-left:22px;font-size:16px;line-height:1.35;color:#3a3160;display:grid;gap:6px}
#copyPrompt{border:0;background:#5b4a94;color:#f4efff;font:18px 'VT323',monospace;padding:5px 12px}
#aiPrompt{height:150px;margin-top:8px;font:13px/1.5 'Courier New',monospace;background:#fff}
.ai-note{font-size:14px!important;color:#6a5f8a;margin:8px 0 0}