:root{--bg: #0f0f12;--ink: #f4f1ea;--muted: #b5b3bc;--gold: #e0b84c;--gold-hi: #f2d27a}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,sans-serif;font-size:15px;-webkit-font-smoothing:antialiased}.screen{min-height:100%;max-width:440px;margin:0 auto;padding:calc(24px + env(safe-area-inset-top)) 24px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:20px}.top{display:flex;justify-content:space-between;align-items:center}.brand{font-family:Space Grotesk,sans-serif;font-weight:700;font-size:20px}.muted{font-size:13px;color:var(--muted)}.art{display:flex;justify-content:center}.painting{width:min(228px,60vw);height:auto;aspect-ratio:100 / 162;border-radius:6px;display:block}.song{display:flex;flex-direction:column;gap:6px}.song h1{margin:0;font-family:Space Grotesk,sans-serif;font-weight:700;font-size:40px;line-height:1;color:var(--gold)}.actions{margin-top:auto;display:flex;flex-direction:column;gap:12px}.btn{height:56px;border-radius:28px;font-family:Space Grotesk,sans-serif;font-weight:700;font-size:18px;display:flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer}.btn.primary{border:0;background:var(--gold);color:var(--bg)}.btn.primary:hover{background:var(--gold-hi)}.btn.ghost{border:1.5px solid var(--gold);background:transparent;color:var(--gold)}.btn.ghost:hover{border-color:var(--gold-hi);color:var(--gold-hi)}.links{display:flex;justify-content:center;gap:28px;padding-top:8px}.link{background:none;border:0;padding:0;min-height:44px;color:var(--gold);font:inherit;font-size:14px;text-decoration:underline;cursor:pointer}.note{margin:0;text-align:center;font-size:13px;color:var(--muted);min-height:18px}:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}.painting{object-fit:cover}.duel{padding-left:16px;padding-right:16px;gap:22px}.pad{padding-left:8px;padding-right:8px}.duel h1{margin:0;font-family:Space Grotesk,sans-serif;font-weight:700;font-size:32px;line-height:1.1;outline:none}.songlink{background:none;border:0;padding:0;min-height:44px;cursor:pointer;font-family:Space Grotesk,sans-serif;font-weight:700;font-size:18px;color:var(--gold)}.pair{display:flex;gap:12px;align-items:flex-start}.pair>*{flex:1;min-width:0}.col{display:flex;flex-direction:column;gap:6px}.card{position:relative;display:block;padding:0;border:0;background:#1a1a20;border-radius:8px;overflow:hidden;aspect-ratio:3 / 4}.card img{width:100%;height:100%;object-fit:cover;display:block}.card.tap{cursor:pointer;transition:transform .12s ease}.card.tap:active{transform:scale(.97)}.card.tap:disabled{opacity:.6;cursor:default}.card.picked{outline:3px solid var(--gold);outline-offset:-3px}.card.dim{opacity:.55}.badge{position:absolute;left:10px;top:10px;padding:5px 10px;border-radius:999px;background:var(--gold);color:var(--bg);font-size:13px;font-weight:600}.author{font-size:16px;font-weight:600;overflow-wrap:anywhere}.hint{margin:0;text-align:center;font-size:15px;color:var(--muted)}.muted15{margin:0;font-size:15px;color:var(--muted)}.foot{margin-top:auto;display:flex;flex-direction:column;gap:14px}.bar{height:4px;border-radius:2px;background:#2a2a31}.bar>div{height:4px;border-radius:2px;background:var(--gold);transition:width .2s ease}.row{display:flex;justify-content:space-between;align-items:center}.textbtn{min-height:44px;padding:0 4px;border:0;background:transparent;color:var(--muted);font:inherit;font-size:14px;cursor:pointer}.textbtn:disabled{opacity:.5}.strong{font-size:14px;font-weight:600;min-height:44px;display:flex;align-items:center;color:var(--gold)}.notice{margin-top:24px;display:flex;flex-direction:column;gap:16px;padding:0 8px;flex:1}.notice .actions{margin-top:auto}@media (prefers-reduced-motion: reduce){.card.tap,.bar>div{transition:none}}.painting{aspect-ratio:3 / 4}.h32{margin:0;font-family:Space Grotesk,sans-serif;font-weight:700;font-size:32px;line-height:1.1}.h28{margin:0;font-family:Space Grotesk,sans-serif;font-weight:700;font-size:28px;line-height:1.1}.headblock{display:flex;flex-direction:column;gap:6px}.board{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.board li{display:flex;align-items:center;gap:14px;padding:10px 12px;border-radius:12px;background:#1a1a20}.board li.mine{background:transparent;border:1.5px solid var(--gold)}.board .rank{width:24px;font-family:Space Grotesk,sans-serif;font-weight:700;font-size:20px;color:var(--muted);font-variant-numeric:tabular-nums}.board .rank.gold{color:var(--gold)}.board img{width:36px;height:48px;object-fit:cover;border-radius:4px;background:#2a2a31}.board .who{flex:1;min-width:0;font-size:16px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board .pct{font-size:15px;font-variant-numeric:tabular-nums}.center{justify-content:center;align-self:center}.tag{font-size:12px;padding:3px 8px;border-radius:999px;border:1px solid var(--muted);color:var(--muted)}.places{display:flex;gap:8px}.places button{flex:1;min-height:40px;border-radius:20px;border:1.5px solid #2a2a31;background:transparent;color:var(--muted);font:inherit;font-size:14px;font-weight:600;cursor:pointer}.places button.on{border-color:var(--gold);color:var(--gold)}.poster{padding:12px 12px 8px;background:var(--ink);border-radius:4px;width:min(210px,56vw)}.poster img{width:100%;aspect-ratio:3 / 4;object-fit:cover;display:block}.poster .sig{padding-top:8px;display:flex;justify-content:space-between;gap:8px;font-size:11px;font-weight:600;color:#2d2a32}.bidbox{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;background:#1a1a20}.bidsoon{font-family:Space Grotesk,sans-serif;font-weight:700;font-size:16px;color:var(--gold);text-align:right}.winner{gap:16px}.canvas{position:relative;width:min(318px,82vw);container-type:inline-size;box-shadow:0 22px 44px #0009}.canvas img{display:block;width:100%;aspect-ratio:3 / 4;object-fit:cover}.sign{position:absolute;right:3.1cqw;bottom:2.2cqw;display:flex;align-items:baseline;gap:1.6cqw;font-family:Georgia,Times New Roman,Times,serif;font-style:italic;line-height:1;color:#c9a84c;text-shadow:0 0 1px rgba(0,0,0,.55);pointer-events:none}.sign .names{font-size:2.5cqw;opacity:.6}.sign .phi{font-size:4.7cqw;font-weight:600;opacity:.8}.btn.light{border:0;background:var(--ink);color:var(--bg)}.btn.light:hover{background:#fff}.btn:disabled{opacity:.5;cursor:default}.acct{display:flex;justify-content:center;align-items:center;gap:18px;min-height:44px}.err{margin:0;font-size:14px;color:#ff9c8a}.form{display:flex;flex-direction:column;gap:8px;flex:1}.form label{font-size:14px;font-weight:600}.field{display:flex;align-items:center;gap:6px;height:54px;padding:0 16px;border-radius:12px;background:#1a1a20;border:1.5px solid #2a2a31}.field:focus-within{border-color:var(--gold)}.field span{color:var(--muted);font-size:18px}.field input{flex:1;min-width:0;background:transparent;border:0;outline:none;color:var(--ink);font:inherit;font-size:18px}.form .actions{margin-top:auto}.battle{color:var(--gold)}.sheetwrap{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#05050cb8;display:flex;align-items:flex-end;justify-content:center}.sheet{width:100%;max-width:480px;max-height:100dvh;box-sizing:border-box;padding:16px 20px calc(16px + env(safe-area-inset-bottom,0px));border-radius:26px 26px 0 0;background:#0e0d18;display:flex;flex-direction:column;gap:12px;overflow:auto}.vidbox{display:flex;justify-content:center}.vid{display:block;height:min(52dvh,480px);aspect-ratio:9 / 16;border-radius:12px;background:#000}.sheet .actions{margin-top:0}.textbtn.gold{color:var(--gold);font-weight:600}.textbtn.center,.strong.center{align-self:center;justify-content:center}