:root{--ink:#0C1B2A;--paper:#F4F8F9;--white:#fff;--teal:#0FA3A3;--teal-d:#0B7F7F;--cobalt:#2454E8;--signal:#FFC93C;--line:#D9E3E7;--muted:#5B6B78;--danger:#C93A3A;--r:10px;--display:'Bricolage Grotesque',system-ui,sans-serif;--body:'Figtree',system-ui,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.55 var(--body);color:var(--ink);background:var(--paper)}
h1,h2,h3,h4{font-family:var(--display);line-height:1.1;margin:0 0 .5em;letter-spacing:-.015em}
h1{font-size:clamp(1.8rem,3vw,2.4rem)}h2{font-size:1.5rem}h3{font-size:1.1rem}h4{font-size:.95rem;margin:1em 0 .3em}
a{color:var(--cobalt)}p{margin:0 0 1em}small{color:var(--muted);display:block}
code{font:600 .85em ui-monospace,Menlo,monospace;background:#E7EFF1;padding:.1em .4em;border-radius:5px;word-break:break-all}
img{max-width:100%}
.muted{color:var(--muted)}.fine{font-size:.85rem;color:var(--muted)}.center{text-align:center}
.narrow{max-width:720px;margin:0 auto;padding:40px 20px}.wide{max-width:1200px;margin:0 auto;padding:32px 20px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* buttons */
.btn{display:inline-block;font:600 .95rem var(--body);padding:.6em 1.1em;border-radius:var(--r);border:2px solid var(--ink);background:var(--ink);color:var(--paper);text-decoration:none;cursor:pointer;transition:transform .12s,background .12s}
.btn:hover{background:var(--teal-d);border-color:var(--teal-d)}.btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent;color:var(--ink)}.btn.ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn.danger:hover{background:#9f2a2a;border-color:#9f2a2a}
.btn.lg{font-size:1.05rem;padding:.75em 1.4em}.btn.sm{font-size:.85rem;padding:.4em .8em}.btn.xs{font-size:.78rem;padding:.25em .6em;border-width:1.5px}
button.link{background:none;border:0;color:inherit;text-decoration:underline;cursor:pointer;font:inherit;padding:0;opacity:.8}
:focus-visible{outline:3px solid var(--signal);outline-offset:2px}

/* top bar */
.topbar{display:flex;align-items:center;gap:28px;padding:14px 28px;background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.topbar nav{display:flex;gap:20px;flex:1}.topbar nav a{color:var(--ink);text-decoration:none;font-weight:500}.topbar nav a:hover{color:var(--teal-d)}
.brand{display:flex;align-items:center;gap:10px;font:800 1.15rem var(--display);color:var(--ink);text-decoration:none;letter-spacing:-.02em}
.brand b{color:var(--teal-d)}.mark{width:26px;height:26px;color:var(--ink)}
.usermenu{display:flex;align-items:center;gap:10px;font-size:.9rem}.usermenu img{border-radius:50%}

.flash{padding:12px 16px;border-radius:var(--r);margin:16px 0;border:1px solid;font-weight:500}
.flash.ok{background:#E3F6EE;border-color:#9BD8BB;color:#0E5B3A}.flash.error{background:#FDE9E9;border-color:#F0A9A9;color:#8A2222}
.foot{display:flex;justify-content:space-between;padding:28px;color:var(--muted);font-size:.85rem;border-top:1px solid var(--line);margin-top:60px}

/* landing */
.landing main{overflow:hidden}
.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center;max-width:1180px;margin:0 auto;padding:72px 28px 56px}
.hero h1{font-size:clamp(2.4rem,5.2vw,4.1rem);font-weight:800;letter-spacing:-.035em;line-height:1.02}
.lede{font-size:1.2rem;color:#33475A;max-width:34em}.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0 14px}
.browser{background:var(--white);border:2px solid var(--ink);border-radius:14px;box-shadow:10px 10px 0 var(--ink);overflow:hidden;transform:rotate(1.2deg)}
.browser .bar{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:2px solid var(--ink);background:#EAF1F3}
.dots{display:flex;gap:5px}.dots i{width:10px;height:10px;border-radius:50%;background:var(--ink);opacity:.25}
.url{flex:1;background:var(--white);border:1.5px solid var(--ink);border-radius:8px;padding:4px 12px;font:600 .82rem ui-monospace,Menlo,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .25s}
.url.swap{opacity:0}
.browser .screen{padding:22px}.browser .s-hero{background:var(--teal);color:#04222A;border-radius:10px;padding:18px;margin-bottom:14px;display:grid;gap:4px}
.browser .s-hero b{font:800 1.3rem var(--display)}.browser .s-hero span{font-size:.85rem}
.browser .s-row{display:flex;justify-content:space-between;padding:11px 4px;border-bottom:1.5px dashed var(--line);font-weight:600}
.browser .s-row i{font-style:normal;font-size:.72rem;background:var(--signal);padding:2px 9px;border-radius:99px;align-self:center}
.browser .s-btn{margin-top:16px;background:var(--ink);color:#fff;text-align:center;padding:10px;border-radius:9px;font-weight:700;font-size:.9rem}
.features,.steps,.closing{max-width:1180px;margin:0 auto;padding:56px 28px}
.features h2,.steps h2{font-size:2rem;max-width:18em;margin-bottom:1.2em}
.features dl{display:grid;grid-template-columns:repeat(2,1fr);gap:0 56px;margin:0}
.features dl>div{padding:22px 0;border-top:2px solid var(--ink)}
.features dt{font:700 1.15rem var(--display);margin-bottom:6px}.features dd{margin:0;color:#33475A}
.steps ol{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:0;margin:0}
.steps li{counter-increment:s;background:var(--white);border:2px solid var(--ink);border-radius:14px;padding:22px;display:grid;gap:6px}
.steps li::before{content:counter(s);font:800 2.4rem var(--display);color:var(--teal-d);line-height:1}
.closing{text-align:center;background:var(--ink);color:var(--paper);border-radius:22px;margin:40px auto;padding:64px 28px}
.closing h2{font-size:2.2rem}.closing .btn{background:var(--signal);border-color:var(--signal);color:var(--ink)}

/* forms */
fieldset{border:1px solid var(--line);border-radius:14px;background:var(--white);padding:20px 22px 8px;margin:0 0 20px}
legend{font:700 1rem var(--display);padding:0 8px}
.field{display:block;margin-bottom:16px}.lbl{display:block;font-weight:600;font-size:.88rem;margin-bottom:5px}
input,select,textarea{width:100%;font:inherit;padding:.6em .75em;border:1.5px solid #B9C8CF;border-radius:8px;background:var(--white);color:var(--ink)}
textarea{resize:vertical}input[type=color]{padding:2px;height:42px;cursor:pointer}input[type=range]{padding:0}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px #0FA3A340}
input[type=checkbox]{width:auto;margin-right:8px}
.check{display:flex;align-items:center;gap:6px;margin:8px 0 14px;font-weight:500}
.field small{margin-top:4px}.captcha{display:block;margin:14px 0}
.slug{display:flex;align-items:center;gap:8px}.slug span{color:var(--muted);white-space:nowrap}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:0 18px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 18px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:0 18px}
.row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:12px}.row>*{flex:1 1 160px}.row .btn{flex:0 0 auto}
.qrow{align-items:center}.qrow input:first-child{flex:3 1 260px}
.form-actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}
form.inline{display:inline-block;margin:0}form.inline select{width:auto}
.presets{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.chip-btn{display:flex;align-items:center;gap:6px;border:1.5px solid var(--line);background:var(--white);border-radius:99px;padding:5px 12px 5px 6px;font:600 .82rem var(--body);cursor:pointer}
.chip-btn i{width:16px;height:16px;border-radius:50%;border:1px solid #0002;margin-right:-8px}.chip-btn i:last-of-type{margin-right:2px}
.vars{font-size:.85rem;color:var(--muted)}

/* dashboard shell */
.dash{background:var(--paper)}
.shell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.side{background:var(--ink);color:#DCE7EC;padding:22px 16px;display:flex;flex-direction:column;gap:20px;position:sticky;top:0;height:100vh}
.side .brand{color:#fff}.side .mark{color:#fff}.side .brand b{color:var(--signal)}
.side .co{display:grid;gap:3px;padding:12px;border:1px solid #ffffff26;border-radius:10px}
.side .co a{color:#9fc4cf;font-size:.78rem;word-break:break-all}
.side nav{display:grid;gap:2px}.side nav a{color:#DCE7EC;text-decoration:none;padding:8px 12px;border-radius:8px;font-weight:500}
.side nav a:hover{background:#ffffff14}.side nav a.on{background:var(--signal);color:var(--ink);font-weight:700}
.side-foot{margin-top:auto;display:grid;gap:10px;font-size:.85rem}.side-foot a{color:#9fc4cf}
.pane{padding:30px 38px 60px;max-width:1300px;width:100%}
.pane-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;flex-wrap:wrap}.pane-head h1,.pane-head h3{margin:0}
.actions{display:flex;gap:8px}
.panel{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin-bottom:18px}
.panel h3{margin-bottom:.8em}
.callout{background:#FFF6D8;border:2px solid var(--ink);border-radius:14px;padding:16px 20px;margin-bottom:22px}
.check li,ul.check{list-style:none;padding:0;margin:8px 0 0}ul.check li.done a{color:var(--muted);text-decoration:line-through}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:20px}
.stat{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.stat b{display:block;font:800 2rem var(--display);line-height:1}.stat span{color:var(--muted);font-size:.85rem}
.two{display:grid;grid-template-columns:1.3fr 1fr;gap:18px}
.bars{display:flex;align-items:flex-end;gap:6px;height:140px}.bar-col{flex:1;height:100%;display:flex;align-items:flex-end}.bar-col i{display:block;width:100%;background:var(--teal);border-radius:4px 4px 0 0;min-height:3px}
.funnel{display:grid;gap:10px}.f-row{display:grid;grid-template-columns:90px 1fr 32px;align-items:center;gap:10px;font-size:.9rem}
.f-bar{height:12px;background:#E7EFF1;border-radius:99px;overflow:hidden}.f-bar i{display:block;height:100%;border-radius:99px}
.f-bar .st-new{background:var(--cobalt)}.f-bar .st-reviewing{background:var(--signal)}.f-bar .st-interview{background:#8A5CF6}.f-bar .st-hired{background:#1FA971}.f-bar .st-declined{background:#D46161}
.people{list-style:none;padding:0;margin:0}.people li{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line)}.people li>div{flex:1}
.av{border-radius:50%;vertical-align:middle}
.empty{text-align:center;padding:36px 20px;border:2px dashed var(--line);border-radius:14px;background:var(--white)}
.co-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}.co-list li{display:flex;justify-content:space-between;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:16px 20px}
.co-name{font:700 1.15rem var(--display);text-decoration:none;color:var(--ink)}

/* tables & badges */
.tablewrap{overflow-x:auto;background:var(--white);border:1px solid var(--line);border-radius:14px;margin-bottom:18px}
table{width:100%;border-collapse:collapse}th{text-align:left;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:12px 16px;border-bottom:1px solid var(--line)}
td{padding:12px 16px;border-top:1px solid var(--line);vertical-align:middle}thead+tbody tr:first-child td{border-top:0}
.row-actions{text-align:right;white-space:nowrap}.row-actions form{margin-left:4px}
.badge{display:inline-block;font-size:.72rem;font-weight:700;padding:3px 10px;border-radius:99px;text-transform:capitalize;margin-left:4px}
.st-new{background:#E3EAFE;color:#1D3FBF}.st-reviewing{background:#FFF0C2;color:#7A5900}.st-interview{background:#EDE4FE;color:#5B31C7}.st-hired{background:#DDF5EA;color:#0E6B45}.st-declined{background:#FBE3E3;color:#9B2A2A}
.chip{display:inline-block;font-size:.72rem;font-weight:700;background:#DDF5EA;color:#0E6B45;padding:2px 9px;border-radius:99px}.chip.warn{background:#FFF0C2;color:#7A5900}

/* applications */
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;align-items:center}.filters input,.filters select{width:auto;flex:0 1 200px}
.seg{margin-left:auto;display:flex;border:1.5px solid var(--ink);border-radius:8px;overflow:hidden}.seg a{padding:6px 14px;text-decoration:none;color:var(--ink);font-weight:600;font-size:.85rem}.seg a.on{background:var(--ink);color:#fff}
.board{display:grid;grid-template-columns:repeat(5,minmax(200px,1fr));gap:14px;overflow-x:auto;padding-bottom:10px}
.col{background:#E9F0F2;border-radius:14px;padding:12px;min-height:200px}.col h3{font-size:.9rem;display:flex;justify-content:space-between}.col h3 span{color:var(--muted)}
.card-app{background:var(--white);border-radius:10px;padding:12px;margin-bottom:10px;border:1px solid var(--line);display:grid;gap:8px}
.who{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}.who span{display:grid}.who small{font-size:.78rem}
.meta{display:flex;gap:8px;align-items:center;font-size:.8rem;flex-wrap:wrap;color:#B98A00}.meta small{margin-left:auto}
.move select{font-size:.8rem;padding:.3em .5em}
.detail{display:grid;grid-template-columns:1fr 340px;gap:20px;align-items:start}
.who-big{display:flex;gap:18px;align-items:center}.who-big h2{margin:0 0 4px}
.qa dt{font-weight:700;margin-top:14px}.qa dd{margin:4px 0 0;white-space:pre-wrap;background:var(--paper);padding:10px 12px;border-radius:8px}
.score{display:flex;align-items:baseline;gap:8px}.score b{font:800 3rem var(--display);color:var(--teal-d)}
.transcript{display:grid;gap:10px;margin-top:12px}.msg{padding:10px 14px;border-radius:10px;background:var(--paper)}.msg.ai{background:#E3F4F4}.msg p{margin:4px 0 0;white-space:pre-wrap}
.note{border-top:1px solid var(--line);padding-top:10px;margin-top:10px}.note p{margin:4px 0 0;white-space:pre-wrap}
.log{list-style:none;padding:0;margin:0}.log li{display:flex;gap:10px;align-items:center;padding:6px 0;border-top:1px solid var(--line);font-size:.88rem}.log li small{margin-left:auto}
.invite{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}
.danger-zone{border-color:#F0A9A9;margin-top:30px}.crumbs{margin:0 0 14px}

@media(max-width:900px){
 .hero,.two,.detail,.features dl,.steps ol{grid-template-columns:1fr}.hero{padding-top:40px}.browser{transform:none;box-shadow:6px 6px 0 var(--ink)}
 .shell{grid-template-columns:1fr}.side{position:static;height:auto}.pane{padding:22px 16px}
 .grid2,.grid3,.grid4{grid-template-columns:1fr}.topbar{flex-wrap:wrap;gap:12px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
