:root { --bg:#fff; --band:#F3F5F9; --ink:#16181D; --ink-2:#3B4150; --muted:#5B6270; --line:#E4E6EB; --line-strong:#C9CED8; --accent:#1D4ED8; --heart:#D62839;
  --ok:#14532D; --ok-bg:#E3F4E8; --warn-bg:#FDF6DC; --warn:#4A3500; --bad-bg:#FDE2E2; --bad:#8A1C1C;
  --display:'Bricolage Grotesque',system-ui,sans-serif; --body:'IBM Plex Sans',system-ui,sans-serif; }
* { box-sizing:border-box } [hidden] { display:none !important }
body { margin:0; background:var(--band); color:var(--ink); font-family:var(--body); font-size:15px; line-height:1.5 }
h1,h2,h3,p { margin:0 } h1 { font-family:var(--display); font-size:26px; line-height:1.2 } h2 { font-family:var(--display); font-size:18px; margin:18px 0 8px }
a { color:var(--ink) } .muted { color:var(--muted) } .small { font-size:13px } .note { font-size:13px; color:var(--ink-2) }
.bar { display:flex; flex-wrap:wrap; align-items:center; gap:8px 24px; padding:10px 24px; background:var(--bg); border-bottom:1px solid var(--line) }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; font-family:var(--display); font-weight:700; font-size:19px } .brand em { font-style:normal; color:var(--muted); font-weight:400 }
nav { display:flex; flex-wrap:wrap; gap:4px } nav button { min-height:38px; padding:0 12px; border:0; border-radius:8px; background:transparent; color:var(--ink-2); font:inherit; font-weight:600; cursor:pointer }
nav button:hover { background:var(--band) } nav button.is-on { background:var(--accent); color:#fff }
.pill { display:inline-block; min-width:18px; padding:0 6px; border-radius:999px; background:var(--heart); color:#fff; font-size:11px; line-height:18px; text-align:center } .pill:empty { display:none }
.who { margin-left:auto; display:flex; align-items:center; gap:12px; font-size:14px; color:var(--ink-2) }
.wrap { max-width:1180px; margin:0 auto; padding:24px }
.card { padding:22px; background:var(--bg); border:1px solid var(--line); border-radius:12px }
.auth { max-width:440px; margin:48px auto; display:flex; flex-direction:column; gap:12px }
form { display:flex; flex-direction:column; gap:12px } label { display:flex; flex-direction:column; gap:4px; font-size:14px; font-weight:600 }
label:has(> input[type=checkbox]), label:has(> input[type=radio]) { flex-direction:row; align-items:center; gap:8px; font-weight:500 }
input, select, textarea { font:inherit; font-size:15px; padding:8px 10px; border:1px solid var(--line-strong); border-radius:8px; background:var(--bg); color:var(--ink); width:100% }
input[type=checkbox], input[type=radio] { width:auto; accent-color:var(--accent) } input[type=file] { padding:6px }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:0 16px; border:1px solid var(--line-strong); border-radius:8px; background:var(--bg); color:var(--ink); font:inherit; font-weight:600; cursor:pointer }
.btn.primary { background:var(--accent); border-color:var(--accent); color:#fff } .btn.danger { color:var(--bad) } .btn.ok { color:var(--ok) } .btn:disabled { opacity:.5; cursor:default }
.link { padding:0; border:0; background:none; color:var(--accent); font:inherit; font-size:14px; font-weight:600; text-decoration:underline; cursor:pointer }
.row-btns { display:flex; flex-wrap:wrap; align-items:center; gap:10px } .row-btns.sticky { position:sticky; bottom:0; padding:12px 0; background:var(--band) }
.head { display:flex; flex-direction:column; gap:4px; margin-bottom:14px }
.filters { display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin-bottom:12px } .filters label { flex-direction:row; align-items:center; gap:6px } .filters input[type=search] { width:280px }
.list { display:flex; flex-direction:column; gap:8px }
.item { display:grid; grid-template-columns:1fr auto; gap:6px 16px; padding:12px 14px; background:var(--bg); border:1px solid var(--line); border-radius:10px }
.item .t { font-weight:600 } .item .m { font-size:13px; color:var(--muted) } .item .acts { display:flex; flex-wrap:wrap; gap:6px; align-items:flex-start }
.item .acts .btn { min-height:32px; padding:0 10px; font-size:13px }
.tag { display:inline-block; padding:0 8px; border-radius:999px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; line-height:18px; margin-right:6px }
.tag.draft { background:var(--band); color:var(--ink-2) } .tag.pending { background:var(--warn-bg); color:var(--warn) } .tag.approved { background:var(--ok-bg); color:var(--ok) }
.tag.cancelled, .tag.rejected, .tag.flag { background:var(--bad-bg); color:var(--bad) } .tag.postponed { background:var(--warn-bg); color:var(--warn) } .tag.ai { background:#EEF2FD; color:var(--accent) }
.editor { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:24px; align-items:start } .editor .col { display:flex; flex-direction:column; gap:14px }
fieldset { margin:0; padding:14px 16px 16px; border:1px solid var(--line); border-radius:12px; background:var(--bg); display:flex; flex-direction:column; gap:10px } legend { padding:0 6px; font-weight:700; font-size:14px }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px } .kinds, .days, .cats { display:flex; flex-wrap:wrap; gap:6px 16px }
.date-row { display:grid; grid-template-columns:1fr 1fr 1fr auto auto; gap:8px; align-items:end } .date-row .x { min-height:38px }
.preview { position:sticky; top:16px; padding:16px; background:var(--bg); border:1px solid var(--line); border-radius:12px } .preview h2 { margin-top:0 }
.preview-rows { display:flex; flex-direction:column; gap:2px; margin:8px 0 }
.prow { display:flex; align-items:baseline; gap:8px; padding:4px 6px; font-size:13px; line-height:20px; white-space:nowrap; overflow:hidden }
.prow .dot { flex:0 0 8px; width:8px; height:8px; border-radius:50%; background:#7F97E8 } .prow .tt { flex:0 0 64px; color:var(--ink-2) } .prow .nn { overflow:hidden; text-overflow:ellipsis; font-weight:600 } .prow .ll { margin-left:auto; color:var(--muted) }
.pday { font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-2); padding:6px 6px 0 }
.two { display:grid; grid-template-columns:380px minmax(0,1fr); gap:24px; align-items:start }
.logo-preview { display:flex; align-items:center; justify-content:center; aspect-ratio:3/2; max-width:240px; border:1px dashed var(--line-strong); border-radius:8px; background:#fff } .logo-preview img { max-width:100%; max-height:100%; object-fit:contain; padding:8px }
.sp { display:grid; grid-template-columns:96px 1fr auto; gap:12px; align-items:center } .sp img { width:96px; height:64px; object-fit:contain; border:1px solid var(--line); border-radius:8px; background:#fff }
.inline { flex-direction:row; flex-wrap:wrap; align-items:center; margin-bottom:12px } .inline input, .inline select { width:auto }
@media (max-width:900px) { .editor, .two { grid-template-columns:1fr } .preview { position:static } .date-row { grid-template-columns:1fr 1fr } .wrap { padding:16px } }
/* v2: search, toolbar, toast, clickable rows, settings */
.search { flex:1 1 260px; max-width:420px; margin:0 } .search input { height:38px; border-radius:999px; background:var(--band); border-color:transparent; padding-left:14px } .search input:focus { background:var(--bg); border-color:var(--line-strong); outline:none }
.who .btn.primary { min-height:36px; padding:0 14px }
.toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin-bottom:12px; padding:8px 12px; background:var(--bg); border:1px solid var(--line); border-radius:10px } .toolbar .spacer { flex:1 } .toolbar label { flex-direction:row; align-items:center; gap:6px } .toolbar .btn { min-height:34px; padding:0 12px; font-size:14px }
.item { grid-template-columns:auto 1fr auto; cursor:pointer } .item:hover { border-color:var(--line-strong); box-shadow:0 1px 3px rgba(22,24,29,.08) } .item .sel { padding-top:2px } .item .sel input { width:18px; height:18px } .item.no-sel { grid-template-columns:1fr auto }
.item.is-selected { border-color:var(--accent); background:#F3F6FD }
.toast { position:fixed; left:50%; bottom:24px; transform:translateX(-50%); display:flex; align-items:center; gap:16px; padding:12px 18px; background:var(--ink); color:#fff; border-radius:10px; font-size:14px; box-shadow:0 6px 24px rgba(0,0,0,.25); z-index:50 } .toast .link { color:#9DB5FF }
.item.cat-row { display:grid; grid-template-columns:52px minmax(0,1fr) auto auto auto; padding:8px 12px; gap:10px; align-items:center } .cat-row .sw { width:22px; height:22px; border-radius:6px; border:1px solid rgba(0,0,0,.1) } .cat-row input[type=text] { font-weight:600; border-color:transparent; background:transparent } .cat-row input[type=text]:hover, .cat-row input[type=text]:focus { border-color:var(--line-strong); background:var(--bg) } .cat-row .btn { min-height:32px; padding:0 10px; font-size:13px } .cat-row.off { opacity:.55 }
input[type=color] { width:44px; height:38px; padding:2px }
/* sponsors v2 */
.stack { display:flex; flex-direction:column; gap:16px } .mt0 { margin-top:0 } .two { grid-template-columns:minmax(0,1fr) 380px }
.seg { display:inline-flex; border:1px solid var(--line-strong); border-radius:999px; overflow:hidden; margin:8px 0 } .seg button { min-height:36px; padding:0 14px; border:0; border-right:1px solid var(--line-strong); background:var(--bg); color:var(--ink); font:inherit; font-size:14px; font-weight:600; cursor:pointer } .seg button:last-child { border-right:0 } .seg button[aria-checked=true] { background:#E8EEFC; color:var(--accent) }
.order { display:flex; flex-direction:column; gap:6px; margin:8px 0 }
.orow { display:grid; grid-template-columns:24px 28px 72px minmax(0,1fr) auto; gap:12px; align-items:center; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:var(--bg); cursor:grab }
.orow.dragging { opacity:.4 } .orow.over { border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent) }
.orow .grip { color:var(--muted); font-size:18px; line-height:1; text-align:center } .orow .pos { font-weight:700; color:var(--muted); font-variant-numeric:tabular-nums }
.orow .logo { width:72px; height:48px; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:6px; background:#fff; overflow:hidden } .orow .logo svg, .orow .logo img { width:100%; height:100%; object-fit:contain }
.orow .nm { font-weight:600 } .orow .nm .m { font-weight:400 } .orow.off { opacity:.5 }
.orow .btn { min-height:30px; padding:0 10px; font-size:13px }
.today { display:grid; grid-template-columns:repeat(auto-fill, minmax(120px,1fr)); gap:10px } .tcell { display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--ink-2) } .tcell .logo { aspect-ratio:3/2; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:8px; background:#fff; padding:4px } .tcell .logo svg, .tcell .logo img { width:100%; height:100%; object-fit:contain } .tcell b { color:var(--muted) }