
:root {
  --bg:#FAFAF7; --panel:#FFFFFF; --ink:#111; --body:#3F3F46; --muted:#52525B; --faint:#71717A;
  --line:#E7E5E4; --line-strong:#D6D3D1; --accent:#312E81; --accent-mid:#4338CA; --accent-soft:#EEF2FF;
  --ok:#15803D; --ok-bg:#F0FDF4; --warn:#92400E; --warn-bg:#FFFBEB; --danger:#991B1B; --danger-bg:#FEF2F2;
  --font:"Inter",system-ui,-apple-system,sans-serif; --radius:12px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
body{margin:0;min-height:100vh;font-family:var(--font);background:var(--bg);color:var(--body);-webkit-font-smoothing:antialiased;padding-bottom:4.5rem}
.banner{background:var(--accent-soft);border-bottom:1px solid #C7D2FE;color:var(--accent);font-size:.75rem;font-weight:600;text-align:center;padding:.45rem 1rem}
.chrome{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;padding:.85rem 1.1rem;border-bottom:1px solid var(--line);background:rgba(255,255,255,.92);backdrop-filter:blur(8px);position:sticky;top:0;z-index:20}
.biz{font-weight:700;font-size:1rem;color:var(--ink);letter-spacing:-.02em}
.biz small{display:block;font-weight:500;font-size:.72rem;color:var(--muted);margin-top:.1rem}
.nav-pills{display:flex;flex-wrap:wrap;gap:.35rem}
.nav-pills a,.nav-pills button{font:inherit;font-size:.75rem;font-weight:600;padding:.4rem .65rem;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--muted);text-decoration:none;cursor:pointer}
.nav-pills a.is-on,.nav-pills button.is-on{background:var(--accent);color:#fff;border-color:var(--accent)}
.shell{max-width:640px;margin:0 auto;padding:1rem 1rem 2rem}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;margin-bottom:.75rem;box-shadow:0 1px 2px rgba(17,17,17,.03)}
.card h1,.card h2,.card h3{color:var(--ink);letter-spacing:-.02em;margin:0 0 .5rem}
.card h1{font-size:1.5rem}
.card h2{font-size:1.15rem}
.muted{color:var(--muted);font-size:.875rem}
.faint{color:var(--faint);font-size:.75rem}
label{display:block;font-size:.8rem;font-weight:600;color:var(--ink);margin:0 0 .3rem}
input,select,textarea{width:100%;font:inherit;font-size:.9375rem;padding:.65rem .75rem;border:1px solid var(--line-strong);border-radius:8px;background:#fff;color:var(--ink);margin-bottom:.75rem}
textarea{min-height:80px;resize:vertical}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;font:inherit;font-weight:600;font-size:.875rem;padding:.65rem 1rem;border-radius:10px;border:1px solid transparent;cursor:pointer;min-height:40px;text-decoration:none;color:inherit}
.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-primary:hover{background:#1E1B4B}
.btn-secondary{background:#fff;border-color:var(--line-strong);color:var(--ink)}
.btn-ok{background:var(--ok);color:#fff}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--muted)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.65rem}
.badge{display:inline-block;font-size:.65rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:.18rem .45rem;border-radius:999px}
.badge-live{background:var(--ok-bg);color:var(--ok)}
.badge-coming{background:var(--warn-bg);color:var(--warn)}
.badge-mock{background:#F4F4F5;color:#52525B}
.badge-url{background:#DBEAFE;color:#1E40AF}
.badge-upload{background:#FCE7F3;color:#9D174D}
.item{display:grid;grid-template-columns:56px 1fr;gap:.75rem;align-items:start}
.thumb{width:56px;height:56px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:.62rem;font-weight:700;text-align:center;line-height:1.2;color:#E0E7FF;background:var(--accent)}
.thumb.short{background:#1E3A5F}.thumb.review{background:#14532D;color:#BBF7D0}
.thumb.gbp{background:#1E293B;color:#93C5FD}.thumb.note{background:#3B0764;color:#E9D5FF}
.thumb.offer{background:#7C2D12;color:#FED7AA}
.kind{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--faint)}
.title{font-size:.95rem;font-weight:600;color:var(--ink);margin:.15rem 0 .3rem}
.body{font-size:.8125rem;color:var(--muted);line-height:1.45;margin:0}
.item-card.is-approved{opacity:.72;border-color:#BBF7D0}
.item-card.is-skipped{opacity:.45}
.status-bar{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.85rem}
.status-bar i{font-style:normal;font-size:.72rem;font-weight:600;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.25rem .55rem;color:var(--muted)}
.status-bar .ok{color:var(--ok)}.status-bar .run{color:var(--accent-mid);background:var(--accent-soft);border-color:#C7D2FE}
.run-banner{background:var(--ok-bg);border:1px solid #BBF7D0;color:#14532D;border-radius:10px;padding:.75rem 1rem;margin-bottom:.85rem;font-size:.875rem;font-weight:600}
.coming-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--line);opacity:.72}
.coming-row:last-child{border-bottom:0}
.coming-row button{pointer-events:none}
.field-hint{font-size:.75rem;color:var(--faint);margin:-.5rem 0 .75rem}
.toast{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;font-size:.8rem;font-weight:600;padding:.55rem 1rem;border-radius:999px;z-index:50;opacity:0;pointer-events:none;transition:opacity .2s}
.toast.is-on{opacity:1}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;display:flex;border-top:1px solid var(--line);background:rgba(250,250,247,.96);backdrop-filter:blur(8px);z-index:30}
.bottom-nav a{flex:1;text-align:center;padding:.7rem .25rem;font-size:.68rem;font-weight:600;color:var(--muted);text-decoration:none}
.bottom-nav a.is-on{color:var(--accent-mid)}
@media(min-width:768px){.bottom-nav{display:none}}
.login-wrap{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:1.5rem}
.login-card{width:min(100%,400px)}
.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:.5rem 0 1rem}
.photo-ph{aspect-ratio:1;border-radius:8px;background:linear-gradient(135deg,#EEF2FF,#E0E7FF);display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;color:var(--accent);text-align:center;padding:.35rem}
.review-snip{font-size:.8125rem;border-left:3px solid var(--line-strong);padding:.4rem .75rem;margin:.4rem 0;color:var(--muted)}
