:root{--bg:#f6f7f2;--surface:#fff;--ink:#1d2735;--muted:#6b7280;--line:#dde4e8;--nav:#0f172a;--red:#dc2626;--orange:#f97316;--gold:#f59e0b;--blue:#2563eb;--green:#22c55e;--shadow:0 18px 50px rgba(15,23,42,.1)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,"Segoe UI",system-ui,sans-serif}button,input,select,textarea{font:inherit}.app{min-height:100vh;display:grid;grid-template-columns:270px minmax(0,1fr)}.sidebar{height:100vh;position:sticky;top:0;padding:24px 18px;background:radial-gradient(circle at 0 0,rgba(220,38,38,.3),transparent 34%),linear-gradient(180deg,#1f2937,#0f172a);color:#fff;display:flex;flex-direction:column;z-index:20}.brand{display:flex;gap:12px;align-items:center;padding:4px 9px 28px}.brand strong,.brand small{display:block}.brand small{color:#c4cbd6;font-size:11px;margin-top:3px}.brand-mark{width:48px;height:44px;border-radius:15px;display:grid;place-items:center;font-size:16px;font-weight:950;color:#4a2602;background:linear-gradient(135deg,#fde68a,#f59e0b);box-shadow:0 10px 24px rgba(245,158,11,.22)}.sidebar nav{display:grid;gap:7px}.nav-link{display:flex;align-items:center;gap:11px;padding:13px 14px;border:0;border-radius:13px;color:#cbd5e1;background:transparent;font-weight:750;text-align:left;cursor:pointer}.nav-link span{width:24px;font-size:18px;text-align:center}.nav-link:hover,.nav-link.active{background:rgba(255,255,255,.1);color:#fff}.nav-link.active{box-shadow:inset 3px 0 var(--gold)}.nav-link em{margin-left:auto;font-style:normal;font-size:9px;padding:4px 6px;border-radius:99px;color:#422006;background:#fde047}.side-note{margin-top:auto;padding:13px;font-size:11px;color:#c1cad7;border:1px solid rgba(255,255,255,.1);border-radius:13px}.online-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);margin-right:7px}main{min-width:0}.topbar{min-height:90px;padding:0 32px;display:flex;align-items:center;gap:18px;justify-content:space-between;position:sticky;top:0;z-index:15;background:rgba(246,247,242,.93);backdrop-filter:blur(13px);border-bottom:1px solid var(--line)}.topbar h1,.topbar p{margin:0}.topbar h1{font-size:24px}.eyebrow{text-transform:uppercase;letter-spacing:.11em;color:#dc2626;font-weight:900;font-size:10px;margin:0 0 5px}.content{padding:27px 32px 48px}.page{display:none}.page.active{display:block}.button{border:0;border-radius:12px;padding:11px 16px;font-weight:850;display:inline-flex;justify-content:center;align-items:center;cursor:pointer}.button.primary{color:#fff;background:linear-gradient(135deg,var(--red),var(--orange));box-shadow:0 10px 24px rgba(220,38,38,.22)}.button.secondary{background:#fff;border:1px solid var(--line)}.button.danger{background:#fff1f2;color:#dc2626;border:1px solid #fecdd3}.text-button{border:0;background:transparent;color:var(--red);font-weight:850;cursor:pointer}.menu-button{display:none;border:1px solid var(--line);background:#fff;border-radius:11px;width:42px;height:42px}.hero{min-height:290px;padding:42px;display:grid;grid-template-columns:1fr 300px;align-items:center;border-radius:28px;color:#fff;background:radial-gradient(circle at 85% 10%,rgba(245,158,11,.22),transparent 26%),radial-gradient(circle at 70% 100%,rgba(37,99,235,.25),transparent 30%),linear-gradient(135deg,#b91c1c,#111827);box-shadow:var(--shadow)}.hero h2{max-width:700px;font-size:clamp(31px,4vw,52px);line-height:1.04;margin:14px 0}.hero p{max-width:650px;color:#f5e7e7;font-size:16px;margin-bottom:23px}.hero-pill,.wip-badge{display:inline-flex;padding:7px 11px;border-radius:99px;background:rgba(255,255,255,.12);color:#fde68a;font-weight:850;font-size:11px}.pirate-orb{justify-self:center;width:180px;height:180px;border-radius:50%;display:grid;place-items:center;font-size:75px;color:#fde68a;background:radial-gradient(circle at 35% 30%,#fb923c,#b91c1c 55%,#111827);box-shadow:0 25px 50px rgba(0,0,0,.35),inset 0 0 30px rgba(255,255,255,.2)}.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:21px 0}.stats article,.panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 8px 26px rgba(15,23,42,.04)}.stats span,.stats small{display:block;color:var(--muted);font-size:11px}.stats strong{display:block;font-size:27px;margin:7px 0 3px}.dashboard-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}.panel-title{display:flex;justify-content:space-between;align-items:center}.panel-title h3{margin:0}.recent-list,.progress-list{display:grid;gap:10px;margin-top:16px}.recent-row,.progress-row{border:0;width:100%;cursor:pointer}.recent-row{display:grid;grid-template-columns:45px 1fr auto;align-items:center;gap:11px;padding:9px;border-radius:12px;background:#fafaf7;text-align:left}.recent-row img{width:45px;height:62px;object-fit:contain}.recent-row strong,.recent-row small{display:block}.recent-row small{font-size:10px;color:var(--muted)}.progress-row{display:flex;justify-content:space-between;align-items:center;padding:12px;background:#fafaf7;border-radius:12px;text-align:left}.progress-row strong,.progress-row small{display:block}.progress-row small{font-size:10px;color:var(--muted)}.progress-row span{color:var(--red);font-size:11px;font-weight:850}.toolbar{display:flex;gap:11px;align-items:center;flex-wrap:wrap;margin-bottom:18px}.search{display:flex;align-items:center;gap:8px;flex:1 1 320px;padding:0 13px;background:#fff;border:1px solid var(--line);border-radius:12px}.search input{width:100%;border:0;padding:12px 0;outline:0;background:transparent}select,input,textarea{border:1px solid var(--line);border-radius:11px;padding:11px;background:#fff;color:var(--ink);outline:none}.loading,.result-count{color:var(--muted);font-size:12px;margin-bottom:13px}.sets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:17px}.set-card{padding:0;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:18px;transition:.2s;text-align:left;cursor:pointer}.set-card:hover,.op-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.set-logo-area{height:155px;display:grid;place-items:center;background:radial-gradient(circle at 20% 20%,rgba(245,158,11,.18),transparent 25%),linear-gradient(135deg,#fff0ec,#eef4ff)}.set-logo-placeholder{font-size:30px;font-weight:950;color:#b91c1c}.set-card-body{padding:16px}.set-card-body small,.set-card-body p{color:var(--muted);font-size:11px}.set-card-body h2{margin:5px 0;font-size:18px}.set-card-body p{margin:0 0 12px}.set-card-body strong{font-size:22px}.set-hero{display:flex;justify-content:space-between;align-items:center;gap:25px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:25px;margin-bottom:19px}.set-identity{display:flex;align-items:center;gap:22px}.hero-set-code{min-width:84px;height:84px;border-radius:20px;display:grid;place-items:center;padding:10px;color:#fff;font-weight:950;background:linear-gradient(135deg,#dc2626,#f97316)}.set-identity h2,.set-identity p{margin:0}.set-identity h2{font-size:25px}.set-identity p:last-child{color:var(--muted);font-size:12px}.set-progress{min-width:290px}.set-progress strong{font-size:28px}.set-progress span,.set-progress small{color:var(--muted);font-size:12px}.progress-track{height:9px;background:#eceee8;border-radius:99px;overflow:hidden;margin:9px 0}.progress-track i{display:block;height:100%;background:linear-gradient(90deg,var(--red),var(--gold));border-radius:inherit}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(195px,1fr));gap:16px}.op-card{background:#fff;border:1px solid var(--line);border-radius:17px;overflow:hidden;transition:.2s}.op-card.is-owned{border-color:#86efac;box-shadow:0 0 0 2px rgba(34,197,94,.08)}.card-open{width:100%;padding:0;border:0;background:transparent;text-align:left;color:inherit;cursor:pointer}.card-image-wrap{height:285px;padding:13px;position:relative;display:grid;place-items:center;background:linear-gradient(145deg,#fff0ec,#eef4ff)}.card-image-wrap img{width:100%;height:100%;object-fit:contain}.owned-chip,.quantity-chip,.favorite-chip,.parallel-chip{position:absolute;top:10px;z-index:2;border-radius:99px;padding:6px 8px;font-size:10px;font-weight:900;box-shadow:0 5px 14px rgba(15,23,42,.14)}.owned-chip{left:10px;color:#166534;background:#dcfce7}.parallel-chip{right:10px;color:#7c2d12;background:#ffedd5}.quantity-chip{right:10px;top:42px;background:#111827;color:#fff}.favorite-chip{left:10px;top:42px;background:#fff;color:#e11d48}.op-card-body{padding:14px}.op-card-body small,.op-card-body p{color:var(--muted);font-size:10px}.op-card-body h3{margin:4px 0;font-size:16px}.op-card-body p{margin:0 0 10px}.mark-button{display:block;text-align:center;padding:9px;border-radius:10px;color:#b91c1c;background:#fee2e2;font-size:11px;font-weight:900}.modal-backdrop{display:none;position:fixed;inset:0;z-index:50;padding:20px;background:rgba(15,23,42,.76);place-items:center}.modal-backdrop.open{display:grid}.modal{width:min(820px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:22px;padding:23px;position:relative;box-shadow:0 30px 90px rgba(0,0,0,.35)}.modal-close{position:absolute;right:17px;top:14px;width:38px;height:38px;border:0;border-radius:11px;background:#f2f4f1;font-size:24px}.modal-card-head{display:flex;gap:18px;align-items:center;margin-bottom:18px}.modal-card-head img{width:100px;height:140px;object-fit:contain}.modal-card-head h2,.modal-card-head p{margin:0}.modal-card-head p:last-child{color:var(--muted);font-size:12px}.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.form-grid label{display:grid;gap:6px;font-size:11px;font-weight:850}.form-grid .wide{grid-column:1/-1}.form-grid .check{display:flex;align-items:center;gap:8px}.form-grid .check input{width:auto}.modal-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}.wip-panel{text-align:center;max-width:760px;margin:30px auto;padding:55px;background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow)}.wip-panel .wip-badge{background:#fff7cc;color:#8a6410}.wip-panel h2{font-size:34px;margin:15px 0}.wip-panel p{color:var(--muted)}.scanner-graphic{width:200px;height:260px;margin:0 auto 25px;padding:13px;border:3px dashed #9ea3a0;border-radius:22px;background:#f4f4ef}.scanner-graphic div{height:100%;display:grid;place-items:center;border-radius:14px;font-size:60px;color:#fde68a;background:linear-gradient(135deg,#dc2626,#111827)}.settings-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.setting-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}.good{color:#15803d}.button-stack{display:flex;gap:10px;flex-wrap:wrap}.file-button{cursor:pointer}.danger-panel{border-color:#fecdd3}.notice{padding:13px 15px;border-radius:12px;margin-bottom:15px}.notice.error{background:#fff1f2;color:#991b1b;border:1px solid #fecdd3}.empty{text-align:center;padding:20px;color:var(--muted)}.empty.large{grid-column:1/-1;padding:55px;background:#fff;border:1px dashed var(--line);border-radius:18px}.skeleton{min-height:160px;background:linear-gradient(90deg,#fff,#eceee8,#fff);background-size:200% 100%;animation:pulse 1.4s infinite}@keyframes pulse{to{background-position:-200% 0}}.toast{position:fixed;right:22px;bottom:22px;z-index:100;background:#111827;color:#fff;padding:12px 16px;border-radius:12px;opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translateY(0)}
@media(max-width:1100px){.stats{grid-template-columns:repeat(3,1fr)}.dashboard-grid{grid-template-columns:1fr}.set-hero{align-items:flex-start;flex-direction:column}.set-progress{width:100%}}@media(max-width:820px){.app{grid-template-columns:1fr}.sidebar{position:fixed;left:-285px;width:270px;transition:.2s}.sidebar.open{left:0}.menu-button{display:block}.topbar{padding:0 18px;justify-content:flex-start}.topbar .button{margin-left:auto}.content{padding:22px 18px}.hero{grid-template-columns:1fr}.pirate-orb{display:none}.stats{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:repeat(2,1fr)}.settings-grid{grid-template-columns:1fr}}@media(max-width:560px){.topbar h1{font-size:19px}.topbar>.button{display:none}.hero{padding:28px}.stats{grid-template-columns:1fr}.set-identity{align-items:flex-start;flex-direction:column}.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.card-image-wrap{height:225px;padding:7px}.op-card-body{padding:10px}.op-card-body h3{font-size:13px}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.modal-card-head{align-items:flex-start}.modal-card-head img{width:72px;height:105px}.modal-actions{flex-direction:column-reverse}.modal-actions .button{width:100%}}