body.page-brawl-wrapped main.page-main{max-width:760px;padding-top:2.5rem;padding-bottom:4rem}body.page-brawl-wrapped .hero{text-align:center;margin-bottom:2rem}body.page-brawl-wrapped .hero h1{font-family:var(--serif);font-size:clamp(2.2rem,4.5vw,2.8rem);font-weight:300;line-height:1.15;letter-spacing:-.01em;margin-bottom:.5rem}body.page-brawl-wrapped .hero h1 em{font-style:italic;color:var(--accent)}body.page-brawl-wrapped .hero-sub{color:var(--fg-muted);font-size:1rem;font-weight:300;max-width:40em;margin:0 auto}body.page-brawl-wrapped .tag-form{max-width:28em;margin:0 auto 1rem}body.page-brawl-wrapped .tag-row{display:flex;gap:.5rem}body.page-brawl-wrapped .tag-form input{flex:1;padding:.7rem 1rem;border:1px solid var(--border);background:var(--bg-elev);border-radius:8px;font-family:var(--sans);font-size:.95rem;letter-spacing:.05em;color:var(--fg);transition:border-color .15s ease}body.page-brawl-wrapped .tag-form input:focus{outline:none;border-color:var(--accent)}body.page-brawl-wrapped .tag-form input::placeholder{color:var(--fg-faint);letter-spacing:.05em}body.page-brawl-wrapped .tag-submit{padding:.7rem 1.3rem;border:1px solid var(--fg);background:var(--fg);color:var(--bg);border-radius:8px;font-family:var(--sans);font-size:.85rem;font-weight:500;cursor:pointer;transition:background .15s ease,border-color .15s ease}body.page-brawl-wrapped .tag-submit:hover{background:var(--accent);border-color:var(--accent)}body.page-brawl-wrapped .tag-submit:disabled{opacity:.5;cursor:not-allowed}body.page-brawl-wrapped .hint{text-align:center;font-size:.78rem;color:var(--fg-muted);margin-top:.6rem;font-weight:300}body.page-brawl-wrapped .quota-note{font-size:.8rem;color:var(--fg-muted);text-align:center;margin:0 0 2.5rem;line-height:1.5;font-weight:300}body.page-brawl-wrapped .workspace{display:none}body.page-brawl-wrapped .workspace.active{display:block}body.page-brawl-wrapped .loading-state{display:none;padding:3rem 1rem;text-align:center}body.page-brawl-wrapped .loading-state.active{display:block}body.page-brawl-wrapped .spinner{width:36px;height:36px;border:2px solid var(--fg-faint);border-top-color:var(--accent);border-radius:50%;margin:0 auto 1.25rem;animation:brawlw-spin .8s linear infinite}@keyframes brawlw-spin{to{transform:rotate(360deg)}}body.page-brawl-wrapped .loading-line{font-family:var(--serif);font-size:1rem;color:var(--fg-muted)}body.page-brawl-wrapped .error-state{display:none;background:#fef2f0;border:1px solid #F0BDB5;border-radius:12px;padding:1.25rem;color:var(--accent-warm);font-size:.9rem;text-align:center}body.page-brawl-wrapped .error-state.active{display:block}body.page-brawl-wrapped .result-panel{display:none}body.page-brawl-wrapped .result-panel.active{display:block}body.page-brawl-wrapped .card-wrap{border-radius:14px;overflow:hidden;border:1px solid var(--border);background:var(--bg-elev);max-width:480px;margin:0 auto 1.25rem}body.page-brawl-wrapped .card-wrap img{width:100%;height:auto;display:block}body.page-brawl-wrapped .actions{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}body.page-brawl-wrapped .btn-primary,body.page-brawl-wrapped .btn-secondary,body.page-brawl-wrapped .btn-tertiary{padding:.6rem 1.1rem;border-radius:8px;font-family:var(--sans);font-size:.82rem;font-weight:500;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease;text-decoration:none;display:inline-flex;align-items:center;line-height:1}body.page-brawl-wrapped .btn-primary{background:var(--fg);color:var(--bg);border:1px solid var(--fg)}body.page-brawl-wrapped .btn-primary:hover{background:var(--accent);border-color:var(--accent)}body.page-brawl-wrapped .btn-secondary{background:var(--bg-elev);color:var(--fg);border:1px solid var(--border)}body.page-brawl-wrapped .btn-secondary:hover{border-color:var(--accent);color:var(--accent)}body.page-brawl-wrapped .btn-secondary.copied{background:var(--accent);color:var(--bg);border-color:var(--accent)}body.page-brawl-wrapped .btn-tertiary{background:transparent;color:var(--fg-muted);border:1px solid transparent;font-weight:400}body.page-brawl-wrapped .btn-tertiary:hover{color:var(--accent-warm)}
