:root{font-family:system-ui,'PingFang SC',sans-serif;color:#fff5d8;color-scheme:light;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#d3aa70}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:1px solid #e2c381;border-radius:7px;background:linear-gradient(#674b2d,#39291d);box-shadow:0 3px 0 #261b16,0 6px 12px #0003;color:#fff0be;padding:10px 18px}button:hover{filter:brightness(1.13)}button:disabled{opacity:.55;cursor:wait}button:focus-visible,a:focus-visible{outline:3px solid #73d6ff;outline-offset:3px}[hidden]{display:none!important}#scene,#encounter{position:fixed;inset:0;width:100%;height:100%;display:block}#scene{transition:filter .7s,transform .7s}body.focus #scene{filter:blur(9px) saturate(1.12);transform:scale(1.035)}#encounter{z-index:2;pointer-events:none}header{position:fixed;top:28px;left:30px;right:30px;display:flex;justify-content:space-between;align-items:center;z-index:5;pointer-events:none}header>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff4ce;font-size:21px;font-weight:900;text-shadow:0 2px 3px #0009;letter-spacing:1px}.brand small{display:block;font-size:7px;letter-spacing:3px;margin-top:5px}.ball-icon{display:block;width:36px;height:36px;border-radius:50%;border:3px solid #f3d8a5;background:linear-gradient(#dd3d32 46%,#322b2b 46% 55%,#f8edcc 55%);box-shadow:0 0 0 4px #534633}.machine-status{position:fixed;right:30px;top:100px;width:170px;padding:15px;background:linear-gradient(130deg,#644733e8,#2c201ee8);border:2px solid #ad8c58;border-radius:10px;box-shadow:0 8px 25px #0004}.machine-status>small{font:7px monospace;letter-spacing:3px;color:#c6a66e}.machine-status>div{display:flex;gap:12px;margin:10px 0;font-size:10px}.machine-status strong{display:block;font:10px monospace;margin-top:8px}.machine-status b{font-size:26px;color:#fff6d3}.machine-status p{font-size:8px;margin:0;color:#c3af8f}.battery{width:20px;height:52px;border:3px solid #e4d09c;background:repeating-linear-gradient(to top,#c9db73 0 7px,#414536 7px 10px)}.dex-toggle{position:fixed;right:28px;bottom:30px;z-index:5;font-size:12px}.dex-toggle span{font-size:20px;vertical-align:middle;margin-right:7px}.dex-toggle b{margin-left:10px;color:#e7cf7b}.action-panel{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);text-align:center;z-index:4;min-width:260px}.action-panel p{display:table;margin:0 auto 10px;padding:7px 14px;background:#33271ed6;border:1px solid #af8b4e;border-radius:20px;font-size:11px}.action-panel>button{background:linear-gradient(#e3b952,#ab7726);color:#39251a;border-color:#ffe8a3;font-weight:800;min-width:210px;box-shadow:0 3px 0 #604023,0 8px 20px #0004}.action-panel small{display:block;color:#fff7e6;text-shadow:0 1px 3px #33291f;font-size:9px;margin-top:10px}#loading{position:fixed;inset:0;background:linear-gradient(135deg,#e6c78f,#a77241);z-index:30;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#3d2a1e;gap:20px}#loading p{font-size:12px}.loading-ball{width:60px;height:60px;border:4px solid #392f26;border-radius:50%;background:linear-gradient(#d82d27 46%,#342a23 46% 55%,#fff2d9 55%);animation:turn 1.5s infinite}@keyframes turn{50%{transform:rotate(25deg)}}#result{position:fixed;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:70px 0 50px;pointer-events:none}#result>*{pointer-events:auto}.result-title{text-align:center;text-shadow:0 2px 6px #302616}.result-title small{font-size:10px;letter-spacing:4px}.result-title h2{font-size:22px;margin:6px 0}#card{border:0;background:transparent;width:min(450px,80vw);height:min(70vh,740px);filter:drop-shadow(0 14px 14px #0005)}.result-actions{display:flex;gap:10px;font-size:12px}body[data-phase=card] .action-panel{display:none}dialog{padding:0;border:0;background:transparent;overflow:visible;width:min(850px,94vw);max-width:94vw;max-height:94vh;color:#231e1c}dialog::backdrop{background:#ffffff0a;backdrop-filter:blur(9px)}.dex-shell{border:4px solid #8c1520;border-radius:25px 25px 12px 12px;background:linear-gradient(120deg,#ff414e,#b70c27);box-shadow:inset 0 0 0 5px #e63547,inset 0 0 0 8px #851326,0 20px 50px #0006;padding:18px}.dex-top{display:flex;align-items:flex-start;gap:12px;height:60px}.dex-top i{width:11px;height:11px;background:#f4d152;border:2px solid #7b2328;border-radius:50%}.dex-top i:last-of-type{background:#a7db7b}.dex-top .scanner{width:48px;height:48px;background:radial-gradient(circle at 32% 25%,white,#85faff 30%,#1ea7ca 65%,#257691);border:5px solid #eae8bd;box-shadow:0 0 0 3px #a11428}.dex-top button{margin-left:auto;background:#a11329;border:1px solid #6b1826;padding:5px 10px}.dex-body{display:grid;grid-template-columns:1.1fr 1fr;gap:22px}.dex-left{border:2px solid #901627;background:#c91932;border-radius:8px;padding:10px}.dex-screen{position:relative;border:6px solid #ebdfc3;box-shadow:0 0 0 3px #7b1724;background:#1a2628;border-radius:8px;min-height:360px;height:min(53vh,510px)}#album-card{border:0;width:100%;height:100%}#album-empty{position:absolute;inset:35% 6% auto;text-align:center;color:#d0e3ad;line-height:2;font-size:13px}#album-empty small{font-size:10px}.dex-navigation{display:flex;justify-content:space-between;align-items:center;margin-top:15px;font:11px monospace;color:#ffdfb0}.dex-navigation button{padding:5px 15px;background:#343334}.dex-right{background:#242e2e;border:4px solid #75202b;border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:14px}.dex-right h2{margin:0;text-align:center;font-size:23px;font-style:italic;color:#ffe589}.lcd{background:linear-gradient(130deg,#e3e69b,#a5be62);border:4px inset #6d7843;padding:12px;box-shadow:inset 0 0 12px #385e4044;color:#384c30}.lcd small{display:block;font:8px monospace;letter-spacing:1px}.lcd strong{display:block;margin:7px 0;font-size:21px}.lcd p{font-size:10px;line-height:1.5;margin:4px 0}.lcd>span{font:9px monospace}#album-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;max-height:145px;overflow:auto}#album-grid button{padding:8px 2px;min-height:35px;border-radius:2px;background:linear-gradient(#38bbd6,#117eab);border:2px outset #7ce5f5;font-size:8px;color:#e5fcff;box-shadow:0 2px 0 #064957}#album-grid button.active{background:#d4d96a;color:#254731;border-color:#ecf0a0}#album-grid button:disabled{opacity:.25;cursor:default}.dex-controls{display:flex;gap:8px;margin-top:auto}.dex-controls button{flex:1;padding:10px 4px;font-size:10px;background:#a2b34a;color:#293c2a;border:3px outset #cfd683;border-radius:1px}.speaker{text-align:center;color:#597063;letter-spacing:5px}@media(max-width:600px){header{top:18px;left:18px;right:18px}.brand{font-size:15px}.brand small{font-size:5px}.ball-icon{width:29px;height:29px}#sound{font-size:10px;padding:7px 10px}.machine-status{right:16px;top:78px;transform:scale(.65);transform-origin:top right}.dex-toggle{right:16px;bottom:20px;font-size:10px;padding:9px}.action-panel{bottom:78px}.action-panel small{font-size:8px}.action-panel>button{min-width:185px}#result{padding:80px 0 75px}#card{width:90vw;height:65vh}.result-actions{gap:6px;font-size:10px}.result-actions button{padding:9px 10px}.dex-shell{padding:12px;border-width:3px}.dex-top{height:48px}.dex-top .scanner{width:36px;height:36px}.dex-body{gap:8px;grid-template-columns:1.1fr .9fr}.dex-left{padding:6px}.dex-screen{min-height:240px;height:47vh;border-width:3px}.dex-right{padding:7px;gap:9px;border-width:2px}.dex-right h2{font-size:16px}.lcd{padding:6px;border-width:2px}.lcd strong{font-size:16px}.lcd p{font-size:9px}#album-grid{grid-template-columns:repeat(3,1fr);max-height:160px}.dex-controls{flex-direction:column}.dex-navigation{font-size:9px}.dex-navigation button{padding:5px 9px}.speaker{font-size:10px;letter-spacing:1px}}

body[data-phase=card]{background:#f5f1e9}body[data-phase=card] #scene,body[data-phase=card] header,body[data-phase=card] .machine-status,body[data-phase=card] .dex-toggle,body[data-phase=card] .result-title{display:none}body[data-phase=card] #result{padding:0 0 24px;pointer-events:auto}body[data-phase=card] #card{width:min(620px,96vw);height:calc(100vh - 80px);filter:drop-shadow(0 15px 18px #594f3a25)}

.result-actions{flex-wrap:wrap;justify-content:center}#view-album{background:linear-gradient(#b8383f,#7c1826);border-color:#dca4a2}.dex-screen{background:radial-gradient(ellipse,#354946,#162322)}@media(max-width:600px){.result-actions{max-width:330px;gap:8px}.result-actions button{min-width:140px}body[data-phase=card] #card{height:calc(100dvh - 125px)}}

.dex-filter{display:flex;flex-direction:column;gap:8px;font-size:11px;color:#e3dbb1}.dex-filter>input{min-width:0;width:100%;padding:9px;border:1px solid #789387;background:#162421;color:#f8efd9;border-radius:4px;font:inherit}.dex-filter label{display:flex;align-items:center;gap:5px}.dex-filter input[type=checkbox]{accent-color:#cbb556}#retry-supply{font-size:10px;padding:6px;width:100%;margin-top:8px}#album-grid button{font-size:10px;min-height:40px}button:active{transform:translateY(1px);box-shadow:0 1px 0 #261b16}body[data-phase=album] #result{visibility:hidden}@media(max-width:600px){#album{max-height:94dvh;overflow-y:auto;border-radius:20px}.dex-body{grid-template-columns:1fr}.dex-top{height:42px}.dex-screen{height:40dvh;min-height:260px}.dex-navigation{margin-top:10px}.dex-right{gap:8px}.dex-right h2,.speaker{display:none}.lcd{display:grid;grid-template-columns:1fr 1fr;align-items:center}.lcd small{grid-column:1/-1}.lcd strong{font-size:18px;margin:3px 0}.lcd>span{grid-column:1/-1}.dex-filter{flex-direction:row;align-items:center;gap:8px}.dex-filter>input{flex:1;width:55%}.dex-filter label{white-space:nowrap;font-size:10px}#album-grid{grid-template-columns:repeat(4,1fr);max-height:86px}#album-grid button{font-size:9px;min-height:38px}.dex-controls{flex-direction:row;margin-top:0}.dex-controls button{padding:8px}.dex-shell{padding:10px}.dex-screen #album-card{display:block}}
#transport-toggle{font-size:10px;padding:7px 9px;margin-top:10px;width:100%;background:#51402b}#album{width:min(960px,95vw)}.dex-shell{position:relative}.dex-body{grid-template-columns:1fr 1.15fr;gap:25px}.dex-left{box-shadow:inset -3px 0 7px #700e1f55}.dex-right h2{font-size:20px;font-style:normal;letter-spacing:2px}.dex-sort{display:flex;gap:7px}.dex-sort select{min-width:0;flex:1;background:#f4e9cb;color:#3a392b;border:1px solid #9d9273;border-radius:4px;padding:7px 4px;font:inherit;font-size:11px}.dex-sort button{padding:6px 9px;font-size:11px}#dex-progress{width:100%;height:6px;margin-top:8px;accent-color:#596e34;grid-column:1/-1}#dex-match{font-size:10px;color:#d3d4ae;margin:0}#dex-no-results{color:#f0d9b8;font-size:12px;line-height:1.7;text-align:center}#album-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:285px;gap:9px;padding:4px;scrollbar-width:thin;scrollbar-color:#e0b975 #293c3a}#album-grid button.dex-card{position:relative;display:flex;align-items:center;flex-direction:column;min-height:150px;padding:5px 5px 9px;border:1px solid #a99a73;border-radius:7px;background:linear-gradient(145deg,#f4ebce,#d6c6a3);color:#393b33;box-shadow:0 3px 0 #121b19;opacity:1;transition:transform .15s,border-color .15s}#album-grid button.dex-card.active{border:2px solid #ffe18a;box-shadow:0 0 0 2px #c79a3a,inset 0 0 15px #f6ca6944}#album-grid button.dex-card:hover:not(:disabled){transform:translateY(-2px)}.dex-art{display:grid;place-items:center;width:100%;height:108px;background:radial-gradient(ellipse,color-mix(in srgb,var(--type-color),transparent 60%),transparent 70%)}.dex-art img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 2px #0003)}.dex-card strong{font-size:12px;font-weight:700}.dex-card small{font-size:9px;margin-top:4px}.dex-card i{position:absolute;top:6px;left:5px;background:#324f42;color:#f3edcc;font:8px system-ui;padding:3px 4px;border-radius:3px}#album-grid button.dex-card.locked{background:#293c3a;color:#87978e;border:1px dashed #627269;box-shadow:none}.dex-card.locked .dex-art{font-size:40px;color:#768477;background:none}.dex-card.locked i{background:none;color:#9ba99e}.dex-top{position:sticky;top:0;z-index:3;background:linear-gradient(110deg,#f33749,#c41c35);border-radius:10px 10px 0 0}@media(max-width:600px){.dex-body{grid-template-columns:1fr;gap:10px}.dex-screen{height:34dvh;min-height:230px}#album-grid{max-height:180px;grid-template-columns:repeat(3,minmax(0,1fr))}#album-grid button.dex-card{min-height:135px}.dex-art{height:91px}.dex-right{padding:10px}.dex-top{margin:-2px -2px 0;padding:2px;height:40px}.dex-filter{flex-wrap:wrap}.dex-filter label{font-size:11px}.dex-sort select{font-size:11px}.dex-sort button{font-size:10px}.dex-right h2{display:block;font-size:14px;margin-bottom:0}.dex-controls button{min-height:36px}.dex-navigation button{min-width:48px;min-height:32px}}
.dex-art{flex:0 0 108px;min-height:0;overflow:hidden;position:relative}.dex-art img{position:absolute;inset:0;width:100%;height:100%}#album-grid button.dex-card{height:154px;flex-shrink:0}.dex-left{display:flex;flex-direction:column}.dex-screen{flex:1;height:auto}.dex-right{gap:10px}.dex-right .lcd{padding:10px}.dex-right .lcd strong{margin:4px 0}#album-grid{max-height:230px}.dex-top{height:54px}@media(max-width:600px){.dex-screen{flex:none;height:34dvh}.dex-art{flex-basis:91px}#album-grid button.dex-card{height:140px}#album-grid{max-height:180px}.dex-top{height:40px}}