:root{--bg: #0b1120;--surface-1: #121a2b;--surface-1a: rgba(18, 26, 43, .96);--surface-2: #1a2436;--surface-3: #222e44;--hair: rgba(255, 255, 255, .07);--text: #e8ecf3;--muted: #94a0b4;--faint: #5b667d;--accent: #f2c94c;--accent-ink: #1b1405;--ok: #5ad48a;--danger: #f2767a;--energy: #7cc4ff;--r-sm: 10px;--r-md: 14px;--r-lg: 20px;--tab-h: 60px;--safe-b: env(safe-area-inset-bottom, 0px);--safe-t: env(safe-area-inset-top, 0px);--col: 560px;--t-Common: #b9bcb0;--t-Rare: #5fe39a;--t-Epic: #5fb0ff;--t-Legendary: #c58aff;--t-Mythic: #ff9a3d;--t-Legend: #ffd84a;--font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Hiragino Sans", "Yu Gothic UI", "Noto Sans JP", "Noto Sans Arabic", Tahoma, sans-serif}*{box-sizing:border-box}html,body{margin:0;block-size:100%;background:var(--bg);color:var(--text);font:15px/1.45 var(--font);-webkit-font-smoothing:antialiased}body.utan{overflow:hidden;overscroll-behavior:none}svg.i{inline-size:22px;block-size:22px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}h1,h2,h3{margin:0;font-weight:700}h1{font-size:22px}h2{font-size:17px}p{margin:8px 0}a{color:inherit}button,input{font:inherit;color:inherit}button{border:0;background:none;cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.muted{color:var(--muted)}.small{font-size:13px}.bad{color:var(--danger)}.grow{flex:1;min-inline-size:0}.btn{min-block-size:44px;padding:0 18px;border-radius:var(--r-md);background:var(--accent);color:var(--accent-ink);font-weight:700}.btn.ghost{background:var(--surface-3);color:var(--text)}.ic{display:inline-flex;flex:none;align-items:center;justify-content:center;inline-size:44px;block-size:44px;border-radius:var(--r-sm);color:var(--text);text-decoration:none}.chip{display:inline-flex;align-items:center;gap:6px;min-block-size:44px;padding:0 10px;border-radius:var(--r-sm);background:var(--surface-2);font-size:13px}.chip .i{inline-size:18px;block-size:18px}#top{display:flex;align-items:center;gap:8px;min-block-size:48px;padding:var(--safe-t) 8px 0;background:var(--surface-1a)}.brand{padding-inline-start:8px;letter-spacing:.08em;color:var(--accent)}body.utan #top{position:fixed;inset-block-start:0;inset-inline:0;z-index:3}.who{flex:none}.tier{flex:none;font-size:13px;font-weight:700}.t-Common{color:var(--t-Common)}.t-Rare{color:var(--t-Rare)}.t-Epic{color:var(--t-Epic)}.t-Legendary{color:var(--t-Legendary)}.t-Mythic{color:var(--t-Mythic)}.t-Legend{color:var(--t-Legend)}.pill{overflow:hidden;min-inline-size:0;padding:2px 8px;border-radius:999px;background:var(--surface-3);color:var(--muted);font-size:12px;white-space:nowrap;text-overflow:ellipsis}.pill.mine{flex:none;background:var(--accent);color:var(--accent-ink);font-weight:700}#page{display:flex;flex-direction:column;gap:12px;max-inline-size:var(--col);margin-inline:auto;padding:12px 12px calc(16px + var(--safe-b))}.card{padding:16px;border-radius:var(--r-lg);background:var(--surface-1)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px;margin-block-start:12px}.thumb{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px;border-radius:var(--r-md);background:var(--surface-2);font-size:13px;text-decoration:none}.thumb img{inline-size:64px;block-size:64px;image-rendering:pixelated}.look{display:flex;gap:8px;margin-block-start:10px}.look input{flex:1;min-inline-size:0;min-block-size:44px;padding:0 12px;border:1px solid var(--hair);border-radius:var(--r-md);background:var(--surface-2)}#stage{position:fixed;inset:0;inline-size:100%;block-size:100%;touch-action:none;cursor:grab}#bubble{position:fixed;z-index:2;overflow:hidden;padding:8px 12px;border-radius:var(--r-md);background:#f6f4ec;color:#14202c;font-weight:600;text-align:center;overflow-wrap:anywhere;pointer-events:none}#hint{position:fixed;inset-block-end:calc(var(--tab-h) + var(--safe-b) + 6px);inset-inline:12px;z-index:1;margin:0;color:#ffffffd1;font-size:13px;text-align:center;text-shadow:0 1px 2px #000;pointer-events:none}#tabs{position:fixed;inset-block-end:0;inset-inline:0;z-index:3;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));block-size:calc(var(--tab-h) + var(--safe-b));padding-block-end:var(--safe-b);background:var(--surface-1a)}#tabs button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-inline-size:0;padding:0 2px;color:var(--muted);font-size:11px}#tabs button span{overflow:hidden;max-inline-size:100%;white-space:nowrap;text-overflow:ellipsis}#tabs button.on{color:var(--text);font-weight:700}#sheet{position:fixed;inset-block-end:calc(var(--tab-h) + var(--safe-b));inset-inline:0;z-index:2;display:flex;flex-direction:column;max-block-size:min(54dvh,calc(100dvh - 48px - var(--tab-h) - var(--safe-b) - 170px));margin-inline:auto;max-inline-size:var(--col);border-radius:var(--r-lg) var(--r-lg) 0 0;background:var(--surface-1a)}#sheet[hidden]{display:none}#sheet>header{display:flex;flex:none;align-items:center;gap:2px;padding:2px 4px 2px 16px;padding-inline:16px 4px}#sheet>header h2{overflow:hidden;flex:1;white-space:nowrap;text-overflow:ellipsis}#sheet .body{overflow-y:auto;padding:0 16px 14px;overscroll-behavior:contain}#sheet.min .body{display:none}#sheet h3{margin:14px 0 6px;color:var(--muted);font-size:13px;font-weight:600}.note{margin:4px 0 8px;padding:10px 12px;border-radius:var(--r-md);background:var(--surface-3);font-size:14px}.legal{margin-block-start:16px}.meter{display:grid;grid-template-columns:minmax(0,7.5em) 1fr 3em;align-items:center;gap:8px;min-block-size:26px;font-size:14px}.meter>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.meter i{display:block;overflow:hidden;block-size:8px;border-radius:4px;background:var(--surface-3)}.meter u{display:block;block-size:100%;border-radius:4px;background:var(--accent);text-decoration:none}.meter b{text-align:end;font-variant-numeric:tabular-nums}.meter.hp u{background:#f2767a}.meter.food u{background:#5ad48a}.meter.warm u{background:#f2a24c}.meter.stam u{background:#7cc4ff}.kv{display:flex;justify-content:space-between;gap:12px;min-block-size:28px;align-items:baseline;font-size:14px;border-block-end:1px solid var(--hair);padding-block:4px}.kv span{flex:none;max-inline-size:55%;color:var(--muted)}.kv b{min-inline-size:0;font-weight:600;text-align:end;overflow-wrap:anywhere}.nft{display:block;inline-size:min(100%,260px);aspect-ratio:1;margin:4px auto 8px;border-radius:var(--r-md)}.seg,.langs{display:flex;flex-wrap:wrap;gap:6px}.seg button,.langs button{min-block-size:44px;min-inline-size:48px;padding:0 14px;border-radius:var(--r-sm);background:var(--surface-3)}.seg button.on,.langs button.on{background:var(--accent);color:var(--accent-ink);font-weight:700}.scrim{position:fixed;inset:0;z-index:9;display:flex;align-items:flex-end;justify-content:center;background:#0000008c}.pick{overflow-y:auto;inline-size:100%;max-inline-size:420px;max-block-size:80dvh;padding:8px 16px calc(16px + var(--safe-b));border-radius:var(--r-lg) var(--r-lg) 0 0;background:var(--surface-1)}.pick header{display:flex;align-items:center;justify-content:space-between}.pick .row{display:flex;align-items:center;gap:10px;inline-size:100%;min-block-size:48px;padding:0 12px;margin-block-start:6px;border-radius:var(--r-md);background:var(--surface-2);text-align:start}.pick .row img{inline-size:26px;block-size:26px;border-radius:6px}body.clear #top,body.clear #tabs,body.clear #sheet{background:#080c166b}body.clear .note{background:#080c1659}body.bare .ui{display:none!important}#show{position:fixed;inset-block-start:calc(6px + var(--safe-t));inset-inline-end:6px;z-index:3;background:#080c1680}#show[hidden]{display:none}@media(orientation:landscape)and (max-height:560px){#sheet{inset-block:48px calc(var(--tab-h) + var(--safe-b));inset-inline:auto 0;inline-size:min(48vw,420px);max-block-size:none;margin:0;border-radius:0}#sheet.min{inset-block-end:auto}:root{--tab-h: 52px}}@media(min-width:1100px)and (min-height:461px),(min-width:900px)and (min-height:461px)and (pointer:fine){#sheet{inset-block:60px 12px;inset-inline:auto 12px;inline-size:400px;max-block-size:none;margin:0;border-radius:var(--r-lg)}#sheet.min{inset-block-end:auto}#tabs{inset-block-end:12px;inset-inline:12px auto;inline-size:min(480px,calc(100vw - 440px));margin-inline-start:calc((100vw - 424px - min(480px,calc(100vw - 440px)))/2);block-size:var(--tab-h);padding:0;border-radius:var(--r-lg)}#hint{inset-block-end:calc(var(--tab-h) + 18px);inset-inline:12px 424px}}
