/* ==========================================================================
   Design tokens — light by default, dark via system preference or [data-theme]
   ========================================================================== */
:root{
  --bg:#ffffff; --surface:#ffffff; --soft:#fafafa; --soft2:#f4f4f5; --hover:#f4f4f5; --sel:#f1f1fd;
  --line:#ececef; --line2:#dedee3; --text:#18181b; --muted:#52525b; --faint:#6e6e78;
  --brand:#5b5bd6; --accent:#5b5bd6; --accent-fg:#ffffff; --danger:#dc2626; --warn-bg:#fef6e7; --warn-fg:#8a5300;
  --r:10px; --r-sm:7px; --r-lg:14px;
  --shadow:0 1px 2px rgba(15,15,20,.04);
  --shadow-md:0 1px 2px rgba(15,15,20,.04),0 4px 14px -4px rgba(15,15,20,.08);
  --shadow-lg:0 2px 4px rgba(15,15,20,.04),0 24px 48px -12px rgba(15,15,20,.18);
  --ring:0 0 0 3px color-mix(in srgb,var(--brand) 22%,transparent);
  --ease:cubic-bezier(.2,.8,.2,1);
  --font:'Geist',Inter,system-ui,-apple-system,'Segoe UI',sans-serif; --mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  color-scheme:light;
}
:root[data-theme=dark]{
  --bg:#0c0c0e; --surface:#141417; --soft:#111114; --soft2:#1c1c20; --hover:#1c1c21; --sel:#1e1e33;
  --line:#26262b; --line2:#34343a; --text:#ededf0; --muted:#a8a8b3; --faint:#8a8a96;
  --accent:#7c7cf0; --warn-bg:#2b2111; --warn-fg:#f5c26b;
  --shadow:0 1px 2px rgba(0,0,0,.3); --shadow-md:0 1px 2px rgba(0,0,0,.3),0 6px 18px -6px rgba(0,0,0,.5); --shadow-lg:0 24px 60px -12px rgba(0,0,0,.7);
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]){
    --bg:#0c0c0e; --surface:#141417; --soft:#111114; --soft2:#1c1c20; --hover:#1c1c21; --sel:#1e1e33;
    --line:#26262b; --line2:#34343a; --text:#ededf0; --muted:#a8a8b3; --faint:#8a8a96;
    --accent:#7c7cf0; --warn-bg:#2b2111; --warn-fg:#f5c26b;
    --shadow:0 1px 2px rgba(0,0,0,.3); --shadow-md:0 1px 2px rgba(0,0,0,.3),0 6px 18px -6px rgba(0,0,0,.5); --shadow-lg:0 24px 60px -12px rgba(0,0,0,.7);
    color-scheme:dark;
  }
}

/* ==========================================================================
   Base
   ========================================================================== */
*{box-sizing:border-box}html,body{margin:0}[hidden]{display:none!important}
body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;font-feature-settings:"cv11","ss01"}
a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer}
h1{font-size:24px;letter-spacing:-.025em;font-weight:620;margin:0 0 6px;line-height:1.2}
h2{font-size:17px;letter-spacing:-.015em;font-weight:600;margin:0 0 12px}h3{font-size:14px;font-weight:600;margin:0 0 6px;letter-spacing:-.005em}
p{margin:0 0 10px}.muted{color:var(--muted)}.faint{color:var(--faint)}.small{font-size:12px}.center{text-align:center}.grow{flex:1;min-width:0}
.ell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
kbd{font-family:var(--mono);font-size:11px;color:var(--faint);border:1px solid var(--line2);border-bottom-width:2px;border-radius:5px;padding:0 5px;background:var(--surface);line-height:1.5}
code{font-family:var(--mono);background:var(--soft2);padding:1px 5px;border-radius:5px;font-size:12px}
svg.i{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.row{display:flex;align-items:center;gap:8px}.row.between{justify-content:space-between}.row.end{justify-content:flex-end}.row.wrap{flex-wrap:wrap}.center-x{justify-content:center}
.stack{display:flex;flex-direction:column;gap:12px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}.pad{padding:20px}
hr.sep{border:0;border-top:1px solid var(--line);margin:16px 0}

/* forms */
label{display:block;font-size:12px;font-weight:550;color:var(--muted);margin:14px 0 6px}
input:not([type=checkbox]):not([type=radio]):not([type=color]),textarea,select{width:100%;border:1px solid var(--line2);border-radius:var(--r-sm);padding:8px 10px;background:var(--surface);outline:none;transition:border-color .15s,box-shadow .15s;font-size:13.5px}
input::placeholder,textarea::placeholder{color:var(--faint)}
input:focus,textarea:focus,select:focus{border-color:var(--brand);box-shadow:var(--ring)}
textarea{min-height:88px;resize:vertical;line-height:1.55}select{width:auto;cursor:pointer}
input[type=checkbox],input[type=radio]{accent-color:var(--brand);width:15px;height:15px;cursor:pointer}
.check{display:flex;align-items:center;gap:8px;margin:0;font-weight:500;color:var(--muted);font-size:13px;cursor:pointer}
.prefix{display:flex;align-items:center;border:1px solid var(--line2);border-radius:var(--r-sm);overflow:hidden;background:var(--surface)}.prefix span{padding:8px 0 8px 10px;color:var(--faint);white-space:nowrap;font-size:13px}.prefix input{border:0!important;box-shadow:none!important;padding-left:2px!important}
.err{color:var(--danger);font-size:13px;margin-top:10px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line2);background:var(--surface);color:var(--text);border-radius:var(--r-sm);padding:7px 13px;font-weight:550;font-size:13.5px;white-space:nowrap;transition:background .15s,border-color .15s,box-shadow .15s;box-shadow:var(--shadow);line-height:1.3}
.btn:hover{background:var(--hover);border-color:var(--line2)}
.btn.pri{background:var(--text);border-color:var(--text);color:var(--bg)}.btn.pri:hover{opacity:.88}
.portal .btn.pri,.p-hero .btn.pri,.in-widget .btn.pri{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.sm{padding:4px 10px;font-size:12.5px;border-radius:6px}.btn.lg{padding:11px 20px;font-size:15px}.btn.block{width:100%}
.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn.danger-t{color:var(--danger)}.btn.ghost{background:none;border-color:transparent;box-shadow:none}.btn.ghost:hover{background:var(--hover)}
.btn:disabled{opacity:.5;cursor:default}.btn svg.i{width:15px;height:15px}
.icon-btn{position:relative;display:grid;place-items:center;width:32px;height:32px;border-radius:8px;color:var(--muted);border:0;background:none}.icon-btn:hover{background:var(--hover);color:var(--text)}.icon-btn svg{width:17px;height:17px}
.dot{position:absolute;top:1px;right:0;background:#e5484d;color:#fff;font-style:normal;font-size:10px;font-weight:700;border-radius:9px;min-width:16px;height:16px;display:grid;place-items:center;padding:0 4px;border:2px solid var(--bg)}

/* pills, tags, badges, labels */
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:550;color:color-mix(in srgb,var(--c) 85%,var(--text));background:color-mix(in srgb,var(--c) 12%,transparent);padding:2px 8px 2px 7px;border-radius:999px;white-space:nowrap;line-height:1.5}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c)}
.tag{display:inline-flex;align-items:center;gap:4px;background:var(--soft2);color:var(--muted);border-radius:6px;padding:1px 7px;font-size:12px;font-weight:500;line-height:1.6}.tag svg{width:11px;height:11px}
.tag .x{border:0;background:none;padding:0 0 0 3px;color:var(--faint)}
.tag.warn{background:var(--warn-bg);color:var(--warn-fg)}.tag.team{background:color-mix(in srgb,var(--brand) 12%,transparent);color:color-mix(in srgb,var(--brand) 85%,var(--text))}
.badge{display:inline-block;background:var(--text);color:var(--bg);border-radius:5px;font-size:10px;font-weight:650;padding:1px 6px;text-transform:uppercase;letter-spacing:.04em;margin:0 2px}.badge.warn{background:var(--warn-bg);color:var(--warn-fg)}
.label{display:inline-block;border-radius:999px;padding:1px 9px;font-size:11px;font-weight:600;color:color-mix(in srgb,var(--c) 85%,var(--text));background:color-mix(in srgb,var(--c) 13%,transparent)}
.count{font-style:normal;font-size:11px;font-weight:600;color:var(--faint);font-variant-numeric:tabular-nums}
.notice{background:var(--warn-bg);border:1px solid color-mix(in srgb,var(--warn-fg) 25%,transparent);color:var(--warn-fg);border-radius:var(--r-sm);padding:10px 14px;margin-bottom:16px;font-size:13px}.notice a{text-decoration:underline;font-weight:600}

/* avatars, logo */
.av{display:inline-grid;place-items:center;border-radius:50%;font-weight:600;flex:none;object-fit:cover}
.logo-mark{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--text);color:var(--bg);font-size:12px;font-weight:700;flex:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.logo-mark.big{width:40px;height:40px;font-size:17px;border-radius:11px}
.logo-mark img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.logo-mark.has-img{background:none!important;overflow:hidden}

/* menus, modals, toast */
.menu{position:relative}.avatar-btn{border:0;background:none;padding:0;display:flex;border-radius:50%}
.menu-pop{display:none;position:absolute;right:0;top:calc(100% + 6px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-lg);min-width:224px;padding:5px;z-index:30}
.menu-pop.on{display:block;animation:pop .14s var(--ease)}.menu-pop.up{top:auto;bottom:calc(100% + 6px);left:0;right:auto}
.menu-pop a,.menu-pop button{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:7px 9px;border-radius:6px;border:0;background:none;color:var(--text);font-size:13px}.menu-pop a:hover,.menu-pop button:hover{background:var(--hover)}
.menu-pop svg.i{color:var(--faint);width:15px;height:15px}.menu-sep{height:1px;background:var(--line);margin:5px 0}
.menu-h{padding:7px 9px 9px;border-bottom:1px solid var(--line);margin-bottom:5px;font-size:13px}.menu-h small{display:block;color:var(--faint)}
.modal{position:fixed;inset:0;background:color-mix(in srgb,#000 32%,transparent);backdrop-filter:blur(2px);display:grid;place-items:center;z-index:60;padding:16px;animation:fade .15s}
.modal-box{width:100%;max-width:440px;box-shadow:var(--shadow-lg);max-height:90vh;overflow:auto;animation:pop .18s var(--ease);border-radius:var(--r-lg)}.modal-box.wide{max-width:580px}
@keyframes fade{from{opacity:0}}@keyframes pop{from{opacity:0;transform:translateY(4px) scale(.985)}}
.toast{position:fixed;bottom:20px;right:20px;background:var(--text);color:var(--bg);padding:10px 16px;border-radius:var(--r);font-weight:500;font-size:13.5px;z-index:99;opacity:0;transform:translateY(8px);transition:.2s var(--ease);pointer-events:none;box-shadow:var(--shadow-lg);max-width:360px}.toast.on{opacity:1;transform:none}
.gbtn{display:flex;justify-content:center;min-height:44px;margin:20px 0 10px}
.demo{margin-top:10px;text-align:left}.demo summary{cursor:pointer;color:var(--muted);font-size:13px;text-align:center;list-style:none}.demo summary::-webkit-details-marker{display:none}
.demo-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}.demo-u{display:flex;gap:10px;align-items:center;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-sm);padding:8px 10px;text-align:left}.demo-u:hover{border-color:var(--brand)}.demo-u small{display:block;color:var(--faint)}
.pick-list{display:flex;flex-direction:column;gap:2px;margin-top:10px;max-height:340px;overflow:auto}.pick-list button{display:flex;gap:10px;align-items:center;border:0;background:none;border-radius:var(--r-sm);padding:8px 10px;text-align:left}.pick-list button:hover{background:var(--hover)}

/* command palette */
.cmdk-wrap{place-items:start center;padding-top:12vh}
.cmdk{width:100%;max-width:620px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;animation:pop .16s var(--ease)}
.cmdk-in{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line)}.cmdk-in input{border:0!important;box-shadow:none!important;padding:4px 0!important;font-size:15px!important;background:none!important}
.cmdk-in svg.i{color:var(--faint);width:18px;height:18px}
.cmdk-list{max-height:min(60vh,440px);overflow:auto;padding:6px}
.cmdk-g{font-size:11px;font-weight:600;color:var(--faint);padding:10px 10px 4px;letter-spacing:.02em}
.cmdk-it{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:13.5px}.cmdk-it svg.i{color:var(--faint)}
.cmdk-it.on{background:var(--hover)}.cmdk-it .hint{margin-left:auto;color:var(--faint);font-size:12px}
.cmdk-foot{display:flex;gap:14px;padding:8px 14px;border-top:1px solid var(--line);font-size:11.5px;color:var(--faint)}

/* ==========================================================================
   Portal (customer-facing)
   ========================================================================== */
.top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(1.6) blur(12px);border-bottom:1px solid var(--line)}
.bar-top{display:flex;align-items:center;gap:22px;height:58px}.sp{flex:1}
.brand{display:flex;align-items:center;gap:9px;font-weight:620;font-size:15px;letter-spacing:-.01em}
.tabs{display:flex;gap:2px}.tabs a{padding:6px 11px;border-radius:7px;color:var(--muted);font-weight:500;font-size:13.5px;transition:color .15s,background .15s}.tabs a:hover{color:var(--text);background:var(--hover)}.tabs a.on{color:var(--text);background:var(--soft2)}
.foot{border-top:1px solid var(--line);color:var(--faint);font-size:12px;padding:22px 0;margin-top:48px}.foot a{margin-left:14px}.foot a:hover{color:var(--text)}
main.portal{padding-top:36px;padding-bottom:40px;min-height:70vh}
.p-hero{padding:18px 0 32px}.p-hero h1{font-size:34px;letter-spacing:-.035em;font-weight:640}
.p-home{display:grid;grid-template-columns:1fr 300px;gap:44px}
.eyebrow-s{font-size:11.5px;letter-spacing:.02em;color:var(--faint);font-weight:600;margin:0 0 10px}
.board-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.board-card{padding:18px;display:flex;flex-direction:column;gap:4px;transition:border-color .15s,box-shadow .15s}.board-card:hover{border-color:var(--line2);box-shadow:var(--shadow-md)}.board-card p{margin:0;flex:1;font-size:13.5px}
.board-card svg,.side-nav svg,.fv svg{width:12px;height:12px}
.mini-cl{display:block;padding:12px 14px;margin-bottom:8px;transition:border-color .15s}.mini-cl:hover{border-color:var(--line2)}.mini-cl b{display:block;margin-top:4px;font-weight:550}
.mini-post{display:flex;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line);font-size:13.5px}.mini-post:last-child{border:0}.mini-post:hover{color:var(--brand)}
.mini-v{display:inline-flex;flex-direction:column;align-items:center;min-width:28px;font-size:12px;font-weight:600;color:var(--muted);line-height:1.1;font-variant-numeric:tabular-nums}.mini-v svg{width:9px;height:9px;fill:var(--faint);margin-bottom:2px}
.board-layout{display:grid;grid-template-columns:280px 1fr;gap:40px;align-items:start}.board-layout aside{position:sticky;top:84px}
.side-nav a{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;border-radius:7px;color:var(--muted);font-weight:500;font-size:13.5px}.side-nav a:hover,.side-nav a.on{background:var(--soft2);color:var(--text)}
.list-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:4px}.list-head h1{margin:0}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.filters input{width:190px;padding:6px 10px}.filters select,.list-head select{padding:6px 8px;font-size:13px}
.seg{display:inline-flex;background:var(--soft2);border-radius:8px;padding:2px;gap:2px}.seg button,.seg a{border:0;background:none;padding:4px 11px;border-radius:6px;color:var(--muted);font-weight:500;font-size:13px;transition:color .15s}
.seg .on{background:var(--surface);color:var(--text);box-shadow:var(--shadow-md)}
.empty{padding:48px 16px;text-align:center;color:var(--faint);font-size:13.5px}.empty b{color:var(--muted);font-weight:550}.empty.sm{padding:20px 8px;font-size:12px}.empty.tall{padding-top:28vh}
.empty-ico{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--soft2);color:var(--faint);margin:0 auto 12px}.empty-ico svg.i{width:20px;height:20px}
.post-row{display:flex;gap:16px;padding:16px 4px;border-bottom:1px solid var(--line);align-items:flex-start}
.post-body{flex:1;min-width:0}.post-body:hover .post-title{color:var(--brand)}.post-title{font-weight:580;font-size:15px;letter-spacing:-.005em;transition:color .15s}
.post-desc{color:var(--muted);margin:3px 0 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px}
.pin{color:var(--brand);display:inline-flex}.pin svg{width:13px;height:13px}
.meta{display:flex;gap:10px;align-items:center;margin-top:8px;color:var(--faint);font-size:12px;flex-wrap:wrap}.meta svg{width:13px;height:13px}.meta .row{gap:4px}
.vote{width:46px;min-width:46px;border:1px solid var(--line2);border-radius:var(--r);background:var(--surface);display:flex;flex-direction:column;align-items:center;padding:7px 0 6px;font-weight:600;line-height:1.1;transition:border-color .15s,background .15s,color .15s;font-variant-numeric:tabular-nums;box-shadow:var(--shadow)}
.vote svg{width:11px;height:9px;fill:var(--faint);margin-bottom:4px;transition:fill .15s}.vote:hover{border-color:var(--brand)}.vote:hover svg{fill:var(--brand)}
.vote.on{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,var(--surface));color:var(--brand)}.vote.on svg{fill:var(--brand)}.vote.big{width:56px;padding:10px 0 8px;font-size:16px}
.similar{background:var(--soft);border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 10px;margin-top:8px}.similar a{display:flex;gap:8px;align-items:center;padding:5px 0;font-size:13px}.similar a:hover{color:var(--brand)}
.crumbs{color:var(--faint);margin:0 0 16px;font-size:13px}.crumbs a:hover{color:var(--text)}
.pd{display:grid;grid-template-columns:1fr 300px;gap:44px;align-items:start}
.pd-head{display:flex;gap:18px;align-items:flex-start}.pd-title{font-size:24px;margin:0 0 8px;letter-spacing:-.025em}
.pd-details{white-space:pre-wrap;margin:18px 0 0;font-size:15px;line-height:1.7;color:color-mix(in srgb,var(--text) 90%,var(--muted))}
.cform{display:flex;gap:12px;margin:18px 0}.cform textarea{min-height:70px}.cform.reply{margin:10px 0}.cform.reply textarea{min-height:56px}
.act-h{border-top:1px solid var(--line);padding-top:18px;margin-top:6px;font-size:13px;color:var(--muted);font-weight:600}
.comment{display:flex;gap:12px;padding:14px 0 0}.comment .comment{padding-top:12px}.comment.internal>.grow{background:var(--warn-bg);border-radius:var(--r-sm);padding:8px 10px}
.comment b{font-weight:580}.cbody{white-space:pre-wrap;margin-top:3px;font-size:14px;line-height:1.6}
.c-actions{display:flex;gap:12px;margin-top:4px}.c-actions button{border:0;background:none;padding:0;color:var(--faint);font-size:12px;font-weight:500}.c-actions button:hover,.c-actions .on{color:var(--brand)}
.status-evt{display:flex;gap:10px;align-items:flex-start;padding:14px 0 0;color:var(--muted);font-size:13px}.status-evt .cbody{color:var(--text);background:var(--soft);border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 10px;margin-top:6px}
.pd-side{display:flex;flex-direction:column;gap:14px;position:sticky;top:84px}
.side-h{font-size:11.5px;letter-spacing:.02em;color:var(--faint);font-weight:600;margin:18px 0 8px}
.facts{margin:0;display:grid;grid-template-columns:auto 1fr;gap:9px 16px;font-size:13px}.facts dt{color:var(--faint)}.facts dd{margin:0;font-weight:500}
.voters{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.roadmap{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}
.col{background:var(--soft);border:1px solid var(--line);border-radius:var(--r);display:flex;flex-direction:column;min-height:260px;transition:border-color .15s,background .15s}
.col.drop{background:color-mix(in srgb,var(--brand) 6%,var(--soft));border-color:var(--brand)}
.col-h{display:flex;justify-content:space-between;align-items:center;padding:11px 12px 6px}.col-items{padding:4px 8px 10px;display:flex;flex-direction:column;gap:6px;max-height:70vh;overflow:auto}
.rcard{display:flex;gap:10px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 11px;cursor:pointer;transition:border-color .15s,box-shadow .15s;box-shadow:var(--shadow)}
.rcard:hover{border-color:var(--line2);box-shadow:var(--shadow-md)}.rcard.drag{opacity:.45}
.rt{display:block;font-weight:520;line-height:1.35;font-size:13.5px}.rcard .faint{display:block;margin-top:3px;font-size:12px}
.cl-list{max-width:820px}.cl{display:grid;grid-template-columns:170px 1fr;gap:28px;padding:30px 0;border-bottom:1px solid var(--line)}.cl-date{color:var(--faint);font-size:13px;padding-top:3px}
.cl h2{font-size:21px;margin:8px 0;letter-spacing:-.02em}.cl p{white-space:pre-wrap;color:var(--muted);line-height:1.65}
.cl-posts{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-sm);padding:4px 12px;margin:10px 0}.cl-posts a{display:flex;gap:10px;align-items:center;padding:6px 0;font-size:13.5px}.cl-posts a:hover{color:var(--brand)}
.like{border:1px solid var(--line2);background:var(--surface);border-radius:999px;padding:3px 12px;color:var(--muted);font-size:13px}.like.on{color:#e5484d;border-color:color-mix(in srgb,#e5484d 35%,transparent);background:color-mix(in srgb,#e5484d 8%,var(--surface))}
.profile-h{display:flex;gap:16px;align-items:center}
.act-row{display:block}.act-row:hover{border-color:var(--line2)}
.notif{display:flex;gap:12px;align-items:center;padding:13px 18px;border-bottom:1px solid var(--line);font-size:13.5px}.notif:last-child{border:0}.notif:hover{background:var(--hover)}
.ndot{width:7px;height:7px;border-radius:50%;flex:none}.notif.unread .ndot{background:var(--brand)}.notif.unread{font-weight:550}

/* ==========================================================================
   Admin app shell
   ========================================================================== */
.admin{display:grid;grid-template-columns:244px 1fr;height:100vh;font-size:13.5px;background:var(--bg)}
.a-side{border-right:1px solid var(--line);background:var(--soft);display:flex;flex-direction:column;padding:10px 8px;gap:2px;overflow:auto}
.ws-btn{display:flex;align-items:center;gap:9px;width:100%;border:0;background:none;padding:6px 8px;border-radius:8px;font-weight:600;text-align:left;font-size:13.5px}.ws-btn:hover{background:var(--hover)}.ws-btn svg.i{color:var(--faint);width:14px;height:14px}
.a-search{display:flex;align-items:center;gap:8px;width:100%;margin:6px 0 10px;padding:6px 9px;border:1px solid var(--line);background:var(--surface);border-radius:8px;color:var(--faint);font-size:13px;box-shadow:var(--shadow);text-align:left}.a-search:hover{border-color:var(--line2);color:var(--muted)}.a-search kbd{margin-left:auto}
.a-group{font-size:11px;font-weight:600;color:var(--faint);padding:12px 9px 4px;letter-spacing:.02em}
.a-nav{display:flex;flex-direction:column;gap:1px}
.a-nav a{display:flex;align-items:center;gap:9px;padding:6px 9px;border-radius:7px;color:var(--muted);font-weight:500;transition:background .12s,color .12s}.a-nav a svg.i{color:var(--faint)}
.a-nav a:hover{background:var(--hover);color:var(--text)}.a-nav a.on{background:var(--surface);color:var(--text);box-shadow:var(--shadow),inset 0 0 0 1px var(--line)}.a-nav a.on svg.i{color:var(--text)}
.a-nav .count{margin-left:auto}.a-nav a.on .count{color:var(--muted)}
.a-link{display:flex;align-items:center;gap:9px;padding:6px 9px;color:var(--muted);font-size:13px;border-radius:7px}.a-link:hover{background:var(--hover);color:var(--text)}.a-link svg.i{color:var(--faint)}
.a-portal{display:none}
.a-me{border-top:1px solid var(--line);margin-top:6px;padding-top:6px}.a-me>button{width:100%;border:0;background:none;padding:6px 8px;border-radius:8px;font-size:13px;font-weight:500}.a-me>button:hover{background:var(--hover)}
.a-main{overflow:auto;padding:0}
.a-page{padding:24px 32px 40px;max-width:1280px}
.a-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:20px;flex-wrap:wrap}.a-head h1{margin:0;font-size:20px}.a-head p{margin:3px 0 0;font-size:13px}.a-head input{width:240px}
.a-top{display:flex;align-items:center;gap:10px;height:48px;padding:0 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:color-mix(in srgb,var(--bg) 85%,transparent);backdrop-filter:blur(10px);z-index:5}
.a-top h1{font-size:14px;margin:0;font-weight:600;letter-spacing:-.005em}.a-top .crumb{color:var(--faint);font-size:13.5px}
.auth-wall{min-height:100vh;display:grid;place-items:center;background:var(--soft);padding:16px}.auth-wall .logo-mark{margin-bottom:10px}

/* inbox: filters | list | detail */
.inbox{display:grid;grid-template-columns:212px 380px 1fr;height:100vh}
.ib-filters{border-right:1px solid var(--line);padding:14px 8px;overflow:auto}
.ib-filters h2{font-size:14px;font-weight:600}
.fv{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:5px 9px;border-radius:7px;color:var(--muted);cursor:pointer;font-weight:500;font-size:13px;transition:background .12s,color .12s}.fv:hover{background:var(--hover);color:var(--text)}
.fv.on{background:var(--soft2);color:var(--text)}.fv i{font-style:normal;color:var(--faint);font-size:12px;font-variant-numeric:tabular-nums}.fv span{display:flex;align-items:center;gap:7px}
.fv .sdot{width:8px;height:8px;border-radius:50%;background:var(--c);flex:none}
.ib-list{border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;background:var(--bg)}
.ib-bar{display:flex;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line);align-items:center}.ib-bar input{padding:6px 9px;font-size:13px}.ib-bar select{padding:6px 7px;font-size:12.5px}
.ib-rows{overflow:auto;flex:1}
.ib-row{display:flex;gap:10px;align-items:flex-start;padding:11px 12px 11px 10px;border-bottom:1px solid var(--line);position:relative;transition:background .1s}.ib-row:hover{background:var(--hover)}
.ib-row.on{background:var(--sel)}.ib-row.on::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--brand)}
.ib-row .ck{margin-top:3px;opacity:.35;transition:opacity .12s}.ib-row:hover .ck,.ib-row .ck:checked{opacity:1}
.ib-link{display:flex;gap:10px;align-items:flex-start;flex:1;min-width:0}
.ib-t{display:block;font-weight:550;line-height:1.35;margin-bottom:3px;letter-spacing:-.003em}.ib-row .pill{font-size:11px;padding:1px 7px 1px 6px}
.ib-sub{display:flex;align-items:center;gap:6px;color:var(--faint);font-size:12px;flex-wrap:wrap}
.ib-detail{overflow:auto;padding:0;background:var(--bg)}
.ib-detail>.pd-admin,.ib-detail>.notice{margin:0}
.bulkbar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:7px 12px;background:var(--sel);border-bottom:1px solid var(--line);font-size:12.5px;font-weight:500}.bulkbar select,.bulkbar input{padding:4px 6px!important;width:auto!important;font-size:12.5px!important}

/* admin post detail: content + properties panel */
.pd-admin{display:grid;grid-template-columns:1fr 272px;min-height:100%;align-items:stretch}
.pd-admin .pd-main{padding:24px 28px 40px;min-width:0}
.pd-admin .pd-side{position:sticky;top:0;align-self:start;gap:0;border-left:1px solid var(--line);background:var(--soft);min-height:100vh;padding:14px 14px 30px}
.pd-admin .pd-side>.card{background:none;border:0;box-shadow:none;padding:0}
.pd-admin .pd-title{font-size:21px}
.admin-panel label{margin:12px 0 5px;font-size:11.5px;color:var(--faint)}.admin-panel select,.admin-panel input{width:100%;font-size:13px;padding:6px 8px}
.admin-panel textarea{font-size:13px}
.admin-panel .side-h{margin-top:4px}

/* admin lists, tables, editor */
.cl-row{display:flex;gap:14px;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}.cl-row:last-child{border:0}.cl-row:hover{background:var(--hover)}
.editor{display:flex;flex-direction:column;gap:14px;max-width:860px}.title-in{font-size:22px!important;font-weight:620;border:0!important;box-shadow:none!important;padding:4px 0!important;letter-spacing:-.02em;background:none!important}
.chip{margin:0;cursor:pointer}.chip input{display:none}.chip span{display:inline-block;border:1px solid var(--line2);border-radius:999px;padding:3px 11px;font-size:12px;font-weight:550;color:var(--muted);transition:.12s}
.chip input:checked+span{color:color-mix(in srgb,var(--c) 85%,var(--text));border-color:color-mix(in srgb,var(--c) 45%,transparent);background:color-mix(in srgb,var(--c) 12%,transparent)}
.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.link-list{max-height:280px;overflow:auto;margin-top:8px;display:flex;flex-direction:column}.link-list .check{padding:7px 4px;border-bottom:1px solid var(--line);color:var(--text)}
.table-wrap{overflow:auto}.tbl{width:100%;border-collapse:collapse;font-size:13px}.tbl th{text-align:left;font-size:12px;color:var(--faint);font-weight:550;padding:9px 14px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--soft)}
.tbl td{padding:9px 14px;border-bottom:1px solid var(--line)}.tbl tr:last-child td{border-bottom:0}.tbl tr[data-u]{cursor:pointer}.tbl tr[data-u]:hover td{background:var(--hover)}
.mini-c{padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}
.form-narrow{max-width:660px}.form-wide{max-width:840px}
.member{display:flex;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line)}
.st-list{display:flex;flex-direction:column;gap:6px}.st-row{display:flex;gap:8px;align-items:center}
.st-row input[type=color],#ns input[type=color],input[type=color]{width:34px;height:32px;padding:2px;border:1px solid var(--line2);border-radius:7px;background:var(--surface);cursor:pointer}
.st-row select{width:auto}.st-move{display:flex;flex-direction:column}.st-move button{border:0;background:none;font-size:9px;color:var(--faint);padding:0 4px;line-height:1.3}.st-move button:disabled{opacity:.25}
.hook-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--soft2);color:var(--muted)}
.code{position:relative;margin:10px 0}.code pre{font-family:var(--mono);background:#0e0e11;color:#e4e4e7;border:1px solid #232327;border-radius:var(--r-sm);padding:14px;overflow:auto;font-size:12px;line-height:1.6;margin:0;white-space:pre}
.code .copy{position:absolute;top:8px;right:8px;background:#26262b;color:#fff;border-color:#34343a;box-shadow:none}
.switch{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);margin:0;color:var(--text);font-size:14px;font-weight:500;cursor:pointer}.switch small{display:block;color:var(--faint);font-weight:400}

/* analytics */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}.kpi{padding:16px 18px}.kpi b{display:block;font-size:26px;letter-spacing:-.03em;font-weight:620;margin-top:4px;font-variant-numeric:tabular-nums}.kpi small{color:var(--faint);font-size:12px}
.chart{display:flex;align-items:flex-end;gap:8px;height:150px;padding-top:12px}.chart .bar{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;height:100%;justify-content:flex-end}
.chart .bar i{display:block;width:100%;max-width:38px;background:linear-gradient(to top,var(--brand),color-mix(in srgb,var(--brand) 70%,#fff));border-radius:5px 5px 2px 2px;min-height:2px;transition:height .4s var(--ease)}.chart .bar span{font-size:10.5px;color:var(--faint);white-space:nowrap;font-variant-numeric:tabular-nums}
.hbar{display:grid;grid-template-columns:120px 1fr 36px;gap:10px;align-items:center;padding:5px 0;font-size:13px}.hbar i{display:block;height:6px;border-radius:4px;background:var(--c,var(--brand))}.hbar b{text-align:right;font-weight:550;font-variant-numeric:tabular-nums}

/* settings tabs */
.a-page .seg{margin-bottom:20px}

/* ==========================================================================
   Marketing
   ========================================================================== */
.hero{text-align:center;padding:84px 24px 52px}.hero h1{font-size:clamp(38px,6vw,64px);line-height:1.02;letter-spacing:-.045em;margin:0 0 18px;font-weight:650}.hero>p{font-size:18px;color:var(--muted);max-width:560px;margin:0 auto 28px}
.eyebrow{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-size:12px;color:var(--muted);margin-bottom:22px;background:var(--surface)}
.preview{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--soft);padding:0 16px 16px;box-shadow:var(--shadow-lg);margin-bottom:80px}
.preview-bar{display:flex;gap:6px;align-items:center;padding:12px 0}.preview-bar i{width:10px;height:10px;border-radius:50%;background:var(--line2)}.preview-bar span{margin-left:12px;font-size:12px;color:var(--faint)}
.preview .roadmap{margin-top:0}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 40px;padding-bottom:70px}.feat .n{font-size:12px;color:var(--faint);margin-bottom:8px;font-family:var(--mono)}.feat p{color:var(--muted)}
.steps{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;border-top:1px solid var(--line);padding-top:60px;padding-bottom:60px}.steps h2{font-size:30px;letter-spacing:-.03em}
.steps ol{margin:0;padding:0;list-style:none;counter-reset:s}.steps li{counter-increment:s;display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}.steps li::before{content:counter(s);display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid var(--line2);font-size:12px;color:var(--muted);flex:none}
.pricing{padding:40px 24px 70px}.pricing h2{font-size:30px;margin-bottom:28px;letter-spacing:-.03em}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.price{display:flex;flex-direction:column}.price.hot{border-color:var(--text);box-shadow:var(--shadow-lg)}.amt{font-size:34px;font-weight:650;letter-spacing:-.035em;margin:6px 0 10px}.amt small{font-size:14px;color:var(--faint);font-weight:500}
.price ul{padding:0 0 0 18px;margin:0 0 18px;color:var(--muted);flex:1}.price li{padding:3px 0}
.cta-band{text-align:center;padding:70px 24px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--soft);margin-bottom:30px}.cta-band h2{font-size:30px;letter-spacing:-.03em;margin-bottom:22px}
.onboard{max-width:460px;margin:60px auto}.onboard.wide{max-width:640px}.step{display:inline-block;font-size:12px;color:var(--faint);margin-bottom:10px}
.swatches{display:flex;gap:10px}.swatches label{margin:0}.swatches input{display:none}.swatches span{display:block;width:28px;height:28px;border-radius:50%;cursor:pointer;box-shadow:0 0 0 2px var(--bg),0 0 0 3px transparent;transition:box-shadow .12s}.swatches input:checked+span{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--text)}
.new-ws{border-style:dashed}.new-ws:hover{border-color:var(--line2)}

/* ==========================================================================
   Attachments, widget
   ========================================================================== */
.gallery{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.gallery img{width:132px;height:96px;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--line);cursor:zoom-in;background:var(--soft2)}
.gallery.sm img{width:96px;height:70px}img.loading{opacity:.4}img.broken{opacity:.2}
.attach{margin-top:8px}.attach-list{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}.attach-item{position:relative;display:inline-grid;place-items:center;width:54px;height:54px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--soft);font-size:12px;color:var(--faint);overflow:hidden}
.attach-item img{width:100%;height:100%;object-fit:cover}.attach-item button{position:absolute;top:2px;right:2px;border:0;background:rgba(0,0,0,.65);color:#fff;border-radius:50%;width:18px;height:18px;line-height:16px;padding:0;font-size:12px}
.attach-btn{display:inline-flex;align-items:center;gap:5px;margin:0;font-size:12px;font-weight:500;color:var(--muted);cursor:pointer;padding:3px 0}.attach-btn:hover{color:var(--text)}.attach-btn svg.i{width:14px;height:14px}
.tags-edit{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.tags-edit input{width:120px!important;padding:4px 8px!important}
body.in-widget{background:var(--bg)}.widget{display:flex;flex-direction:column;height:100vh}
.w-head{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}.w-x{border:0;background:none;font-size:22px;line-height:1;color:var(--faint);padding:0 2px}.w-x:hover{color:var(--text)}
.w-tabs{display:flex;gap:2px;padding:8px 10px;border-bottom:1px solid var(--line)}.w-tabs a{flex:1;text-align:center;padding:6px 4px;border-radius:7px;color:var(--muted);font-weight:500;font-size:13px}.w-tabs a.on{background:var(--soft2);color:var(--text)}
.w-body{flex:1;overflow:auto}.w-pad{padding:14px}.w-list{padding:0 12px}.w-list .post-row{padding:14px 2px}.w-list .post-title{font-size:14px}.w-back{display:block;padding:12px 14px 0;color:var(--muted);font-size:13px}
.w-body .pd{display:block;padding:12px 14px}.w-body .pd-side{position:static;margin-top:18px}.w-body .pd-title{font-size:19px}.w-body .vote.big{width:50px}
.w-cl{padding:12px 0;border-bottom:1px solid var(--line)}.w-cl b{display:block;margin:6px 0 4px}.w-cl p{color:var(--muted);font-size:13px;white-space:pre-wrap;margin:0}
.w-foot{padding:9px;text-align:center;font-size:11px;color:var(--faint);border-top:1px solid var(--line)}.w-foot:hover{color:var(--text)}

/* ==========================================================================
   Accessibility, responsive
   ========================================================================== */
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:5px}
.btn:focus-visible,.vote:focus-visible{outline-offset:1px}
.only-mobile{display:none}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media (max-width:1180px){.inbox{grid-template-columns:190px 320px 1fr}.pd-admin{grid-template-columns:1fr}.pd-admin .pd-side{position:static;min-height:0;border-left:0;border-top:1px solid var(--line)}}
@media (max-width:900px){
  .p-home,.board-layout,.pd,.steps{grid-template-columns:1fr}.board-layout aside,.pd-side{position:static}.roadmap{grid-template-columns:1fr 1fr}.feat,.price-grid,.grid3{grid-template-columns:1fr}.kpis{grid-template-columns:1fr 1fr}
  .admin{grid-template-columns:1fr;height:auto}.a-side{flex-direction:row;flex-wrap:wrap;align-items:center;border-right:0;border-bottom:1px solid var(--line);padding:8px}
  .a-nav{flex-direction:row;flex-wrap:wrap}.a-side>.grow,.a-link,.a-group,.a-search kbd{display:none}.a-search{width:auto;margin:0}.a-me{border:0;margin:0;padding:0}
  .inbox{grid-template-columns:1fr;height:auto}.ib-filters{display:none}.ib-rows{max-height:55vh}.a-page{padding:18px 16px}.cl{grid-template-columns:1fr;gap:6px}
  .only-mobile{display:block;width:auto!important}.ib-bar{flex-wrap:wrap}.bulkbar{font-size:12px}
}
@media (max-width:600px){
  .wrap{padding:0 16px}.bar-top{gap:8px}.tabs a{padding:6px 7px;font-size:13px}.brand span:last-child{display:none}.roadmap{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}.filters input{width:100%}.m-top .tabs{display:none}
  .top .sp{display:none}.top .tabs{flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}.top .tabs::-webkit-scrollbar{display:none}#who{gap:4px;flex:none}#who .btn.pri{display:none}
  .toast{left:16px;right:16px;bottom:16px;max-width:none}
}

/* redesign refinements: views live in the sidebar under Feedback; inbox = list | detail */
.a-sub{display:flex;flex-direction:column;gap:1px;margin:2px 0 8px 14px;padding-left:10px;border-left:1px solid var(--line)}
.a-sub .a-group{padding:10px 9px 3px;font-size:10.5px}.a-sub .fv{padding:4px 8px;font-size:12.5px}
.inbox{grid-template-columns:400px 1fr}
.ib-head{display:flex;align-items:center;gap:8px;padding:12px 12px 2px}.ib-head h1{font-size:15px;margin:0;font-weight:600}
.ib-bar{border-bottom:1px solid var(--line)}
.ib-sub{flex-wrap:nowrap;white-space:nowrap;overflow:hidden}.ib-sub>span{overflow:hidden;text-overflow:ellipsis}.ib-sub .tag{flex:none}
.ap-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:14px}.ap-actions .btn{justify-content:flex-start}.ap-actions .btn svg.i{width:13px;height:13px}
.pd-admin .facts.only-portal{display:none}.pd-admin .facts-card .side-h:first-of-type{margin-top:14px}
.pd-admin .pd-side{gap:4px}
@media (max-width:1180px){.inbox{grid-template-columns:340px 1fr}}
@media (max-width:900px){.a-sub{display:none}.inbox{grid-template-columns:1fr}}
.kanban{display:grid;gap:10px;overflow-x:auto;padding-bottom:12px;align-items:start;grid-auto-columns:minmax(230px,1fr)}
.kanban .col{min-height:calc(100vh - 170px)}.kanban .col-items{max-height:calc(100vh - 210px)}
.inbox>*,.ib-list,.ib-rows,.ib-row,.ib-link>.grow{min-width:0}
@media (max-width:600px){.ib-head{flex-wrap:wrap}.ib-row .pill{display:none}.ib-bar select,.ib-bar input{flex:1 1 140px}}
/* row metadata: keep each piece whole and fade the line out instead of truncating every word */
.ib-sub>span,.ib-sub>.tag{flex:0 0 auto;overflow:visible}
.ib-sub{-webkit-mask-image:linear-gradient(to right,#000 88%,transparent);mask-image:linear-gradient(to right,#000 88%,transparent)}