:root{--gold: #f0c850;--ink: #0b1410;--panel: rgba(10, 14, 12, .84);--text: #e6ebe1;--muted: #9fb09f;--t-Common: #b9bcb0;--t-Rare: #5fe39a;--t-Epic: #5fb0ff;--t-Legendary: #c58aff;--t-Mythic: #ff9a3d;--t-Legend: #ffd84a;--t-Visitor: #d0d6cc}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--ink);color:var(--text);overflow:hidden;touch-action:none;font-family:Segoe UI,system-ui,-apple-system,Roboto,sans-serif;-webkit-user-select:none;user-select:none}#game{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}#game canvas{image-rendering:pixelated}em{font-style:italic;font-weight:400;opacity:.78}.en{font-style:italic;opacity:.8;font-size:.82em}.hidden{display:none!important}.pill{position:fixed;top:10px;background:var(--panel);border:2px solid var(--gold);border-radius:14px;padding:6px 14px;z-index:20;pointer-events:none}.pill .row{font-size:17px;display:flex;gap:6px;align-items:center}.pill .sub{font-size:12px;font-weight:600;color:#c8d4c4;margin-top:2px}#hud-left{left:10px}#hud-right{right:10px;text-align:right}#hud-right .row{justify-content:flex-end}.banana{width:18px;height:18px;border-radius:50%;background:#f5cd3c;border:3px solid #96701a;display:inline-block}#pisang{color:#ffe178;font-size:20px}#brand{position:fixed;top:8px;left:50%;transform:translate(-50%);text-align:center;z-index:20;pointer-events:none;line-height:1}#brand b{display:block;font-size:30px;letter-spacing:1px;color:#ffd84a;text-shadow:2px 3px 0 #140c06,-1px 3px 0 #140c06}#brand span{font-size:12px;font-weight:700;color:#ebe1be}.panel{position:fixed;background:var(--panel);border:2px solid #5a6e5a;border-radius:14px;z-index:25}#chat{left:10px;bottom:30px;width:min(420px,calc(100vw - 20px));padding:8px 10px}.tabs{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.tabs span{font:700 12px/1 inherit;padding:5px 9px;border-radius:9px;background:#28342c;color:#c8d2c8}.tabs span.on{background:var(--gold);color:#14100a}#chat-min{margin-left:auto;background:#28342c;color:#c8d2c8;border:0;border-radius:8px;width:28px;height:24px;font-weight:700}#log{height:150px;overflow-y:auto;margin:6px 0;font-size:14px;line-height:1.25;pointer-events:auto}#log p{margin:0 0 6px}#log b{margin-right:4px}#log em{display:block;font-size:12px;color:var(--muted);margin-left:2px}#log .sys b{color:#96aa96}#log .warn{color:#ff9a8a}#chat-form{display:flex;gap:6px}#chat-input{flex:1;background:#1e2822;border:1px solid #3c4c40;border-radius:9px;color:var(--text);padding:8px 10px;font-size:15px;-webkit-user-select:text;user-select:text}button{font-family:inherit;cursor:pointer}#chat-form button{background:var(--gold);border:2px solid #14100a;border-radius:10px;font-weight:700;padding:0 10px;line-height:1}#chat-form button em,#buttons button em{display:block;font-size:11px}#chat-open{position:fixed;left:10px;bottom:34px;z-index:25;font-size:22px;background:var(--panel);border:2px solid var(--gold);border-radius:12px;width:48px;height:44px}#buttons{position:fixed;right:10px;bottom:30px;display:flex;gap:8px;z-index:25}#buttons button{background:#1e2c24;color:#e6ebe1;border:2px solid #14100a;border-radius:14px;font-size:17px;font-weight:700;padding:8px 16px;min-width:70px}#buttons button.on{background:var(--gold);color:#14100a}#buttons button.soon{opacity:.55}#menu{right:10px;bottom:96px;padding:10px;width:270px}#menu h4{margin:0 0 6px;font-size:14px}#menu h4 em{font-size:12px}#menu button{display:block;width:100%;text-align:left;margin:6px 0;background:#1e2c24;color:var(--text);border:1px solid #3c4c40;border-radius:10px;padding:8px 10px;font-size:14px}#menu button b{color:#ffe178;float:right}#menu small{color:var(--muted);display:block;margin-top:4px;font-size:11px}#menu button.on{border-color:var(--gold);background:#2e3a24}#menu .np{background:#1a231d;border-radius:10px;padding:8px 10px;margin:6px 0;font-size:14px}#menu .np em{display:block;font-size:12px}#menu .vol{display:flex;gap:8px;align-items:center;margin:6px 0}#menu .vol input{flex:1;accent-color:#f0c850}#menu button.mini{display:inline-block;width:auto;margin:0;padding:5px 8px;font-size:12px}#card{left:50%;top:50%;transform:translate(-50%,-50%);width:min(340px,calc(100vw - 24px));padding:14px;text-align:center}#card canvas{image-rendering:pixelated;width:128px;height:160px;display:block;margin:0 auto 6px}#card h3{margin:4px 0 2px;font-size:20px}#card .tier{font-weight:800}#card table{width:100%;margin:8px 0;font-size:14px;border-collapse:collapse}#card td{padding:3px 4px;border-bottom:1px solid #2c3a30}#card td:last-child{text-align:right;font-weight:700}#card .note{font-size:11px;color:var(--muted)}#card button{margin-top:8px;background:var(--gold);border:2px solid #14100a;border-radius:10px;padding:6px 16px;font-weight:700}#labels{position:fixed;inset:0;pointer-events:none;z-index:15;overflow:hidden}.tag{position:absolute;transform:translate(-50%,-100%);background:#0a0e0cd1;font:700 12px/1.2 inherit;padding:2px 6px;border-radius:6px;white-space:nowrap}.bub{position:absolute;transform:translate(-50%,-100%);background:#faf6e8;border:2px solid #281e14;color:#1e1810;font:600 14px/1.2 inherit;padding:4px 9px;border-radius:10px;white-space:nowrap;text-align:center}.bub em{display:block;font-size:12px;color:#645a4b}.bub:after{content:"";position:absolute;left:50%;bottom:-9px;margin-left:-6px;border:6px solid transparent;border-top-color:#281e14}.float{position:absolute;transform:translate(-50%,-100%);font:800 14px/1 inherit;color:#ffe178;text-shadow:1px 2px 0 #140c06}#notice{position:fixed;bottom:6px;left:50%;transform:translate(-50%);font-size:11px;font-weight:700;color:#b4c0b4;z-index:20;white-space:nowrap;pointer-events:none}#loading{position:fixed;inset:0;background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:50;gap:8px}#loading b{font-size:40px;color:#ffd84a}#loading span{color:var(--muted)}@media(max-width:760px){#brand b{font-size:22px}#brand{top:6px}.pill{padding:4px 9px}.pill .row{font-size:13px}.pill .sub{font-size:10px}#pisang{font-size:15px}#hud-right .en{display:none}#chat{bottom:26px}#log{height:96px;font-size:13px}#buttons button{font-size:14px;padding:6px 10px;min-width:56px}#notice{font-size:9px}#notice em{display:none}}@media(max-width:560px){#brand{top:62px}#brand b{font-size:18px}#brand span{font-size:9px}}@media(max-height:460px){#log{height:70px}#brand{display:none}}