/* Proxenos Legal · tools-skin.css
   Re-skins the working tools (profile, esign, agreement, write, huddle, meeting, intake, verify,
   login, rate) to the /why-us system without touching their layout or scripts.
   Include once per tool page, AFTER the page's own <style> blocks and before </head>:
     <link rel="stylesheet" href="/static/tools-skin.css">
   Rules here only change colour, radius, type, borders and shadows. No display, position,
   width or height changes, so every id and every class the scripts read keeps working. */

/* 1. Tokens: the same names the tool pages already read */
:root{
  --bg:#FEFDF5;--cream:#FEFDF5;--surface:#F6F7FB;--border:rgba(0,33,71,0.10);
  --accent:#2563FF;--accent-deep:#1E4FD6;--navy:#002147;--text:#1A1A1A;--muted:#6B7280;--dim:#9CA3AF;
  --emerald:#16A34A;--gold:#D97706;--danger:#DC2626;--star:#F59E0B;--gold-accent:#D97706;
  --tint-blue:#EEF2FF;--tint-blue-2:#DCE6FF;--tint-yellow:#FFF1BF;--sun:#FFE58A;--note:#FFF3C4;--note-line:#F5DE8A;--note-ink:#7A5B00;
  --green-tint:#DCFCE7;--green-ink:#166534;--amber-tint:#FFFBEB;--amber-ink:#92400E;--red-tint:#FEF2F2;--red-ink:#991B1B;
  --r-md:28px;--r-sm:18px;--r-xs:14px;--pill:999px;--shadow:0 18px 48px rgba(0,33,71,0.16);--shadow-sm:0 8px 24px rgba(0,33,71,0.12)
}
body{background:var(--bg);color:var(--text);font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
::selection{background:var(--tint-blue-2)}

/* 2. Type: serif display at regular weight, sentence-case */
h1,h2,.ov-greet,.card-title,.login-card h1,.login-card h2,.rate-card h2,.sh-h,.bw-header h2,.step .t,.steps .t{font-family:'Instrument Serif',serif;font-weight:400;letter-spacing:-0.01em}
.nav-logo span,.nav .logo,.nav a.logo,.nav .brand,.brand,.login-nav .brand{font-family:'Inter',system-ui,sans-serif;font-weight:700;font-size:18px;letter-spacing:-0.01em;color:var(--text)}
.nav-logo .a,.nav .logo span,.nav a.logo span,.brand span,.nav .brand span{color:var(--accent)}

/* 3. No glass, no gradients, no collage backgrounds */
.nav,.login-nav,.sidebar,.main,.sticky-cta,.login-card,.bw-overlay,#proxenos-modal-bg{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.collage,.collage-grid,.collage-overlay,.collage-frost,.hero-over,.hero-glass,.hero-shimmer{display:none!important}
.nav,.login-nav{background:var(--cream);border-bottom:1px solid var(--border);box-shadow:none}
.header-bar,.step-card,.cta-bg{background-image:none!important}

/* 4. Nav and ticker */
.nav .nav-link,.nav-link{color:var(--text);font-size:14px;font-weight:500;border-radius:var(--pill);padding:8px 10px}
.nav .nav-link:hover,.nav-link:hover{background:var(--tint-blue);color:var(--accent)}
.nav-link.on,.nav .nav-link.on{color:var(--accent);font-weight:600}
.nav-signin,.nav .back,.nav .leave,.nav-end{border-radius:var(--pill);font-family:'Inter',sans-serif;font-weight:600}
.nav-signin{background:var(--accent);color:#fff;padding:9px 18px}
.nav-signin:hover{background:var(--accent-deep);opacity:1}
.nav .back{color:var(--muted)}.nav .back:hover{color:var(--accent);background:var(--tint-blue)}
.nav-avatar{background:var(--navy);color:#fff}
.nav-dropdown{border-radius:var(--r-sm);border:1px solid var(--border);box-shadow:var(--shadow-sm);padding:8px}
.nav-dropdown a{border-radius:12px;font-weight:500}.nav-dropdown a:hover{background:var(--tint-blue);color:var(--accent)}
.nav-menu-btn{border-radius:var(--pill);border:1.5px solid var(--border);font-weight:600}
.nav-meter-role,.nav-meter-time,.nav-meter-bal,.nav-meter-status,.nav-meter-end,.nav-title,.nav-time,.nav-status,.nav-people{border-radius:var(--pill)}
.nav-meter-end,.leave,.nav-end{background:var(--danger);color:#fff}
.ticker{background:var(--navy);border-bottom:none}
.ticker-label{background:var(--accent);color:#fff;font-family:'Inter',sans-serif}
.ticker-item{color:rgba(255,255,255,0.88)}.ticker-item .yr,.ticker-item:hover{color:var(--sun)}

/* 5. Buttons: pills, Inter 600 */
.btn,.btn-go,.btn-p,.btn-big,.btn-join,.btn-book,.btn-sm,.sh-btn,.rate-submit,.rate-skip,.extend-btn,.bw-btn,.bw-btn-passkey,.btn-passkey,.modal-btn,.go,.addlink,.savelink,.ai-pill,.vsdk-pill,.vsdk-rb,.ai-rb,.rb,.share,.book,.acts button,.sh-act button,.det-acts button,.cf-add,.upl label,.kinds button,.seg,.seg .seg-opt,.tabs .tab,.tab{
  border-radius:var(--pill);font-family:'Inter',system-ui,sans-serif;font-weight:600;letter-spacing:0;text-transform:none}
.btn,.btn-go,.btn-p,.btn-big,.btn-join,.bw-btn-primary,.modal-btn-primary,.go,.sh-btn,.rate-submit,.extend-btn,.book{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn:hover,.btn-go:hover,.btn-p:hover,.btn-big:hover,.btn-join:hover,.bw-btn-primary:hover:not(:disabled),.modal-btn-primary:hover,.go:hover,.sh-btn:hover,.rate-submit:hover,.book:hover{background:var(--accent-deep);border-color:var(--accent-deep);color:#fff;opacity:1;transform:none;box-shadow:none}
.btn.soft,.btn-big-s,.bw-btn-outline,.modal-btn-cancel,.btn.o,.secondary{background:var(--tint-blue);color:var(--accent-deep);border-color:transparent}
.btn.soft:hover,.btn-big-s:hover,.bw-btn-outline:hover,.modal-btn-cancel:hover,.btn.o:hover{background:var(--tint-blue-2);color:var(--accent-deep)}
.btn.warn,.modal-btn-danger{background:var(--red-tint);color:var(--red-ink);border-color:transparent}
.btn.warn:hover,.modal-btn-danger:hover{background:var(--danger);color:#fff}
.modal-btn-ok{background:var(--emerald);color:#fff}
.btn:disabled,.btn.disabled,.bw-btn:disabled,.btn-go:disabled{background:#B9C8FF;color:#fff;opacity:1;cursor:not-allowed}
.rate-skip{background:transparent;color:var(--muted)}

/* 6. Cards, panels, boxes */
.card,.login-card,.rate-card,.meeting-info,.sh-box,.author-wrap,.side .card,.hero-card,.about-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-md);box-shadow:none}
.login-card{box-shadow:var(--shadow)}
.stat,.tile,.note-box,.det,.req-box,.block,.cf-result,.cf-review,.cf-rec,.drafts,.msg,.notice,.box,.prep,.ov-empty,.empty,.sh-pane,.sh-prev,.sh-pv,.ai-summary,.vsdk-sharing-card,.bw-attorney,.bw-req,.bw-opt-card,.bw-ai-offer,.docwrap,.readgate,.sigs,.preview,.assist,.review,.wc-bar,.trust-item,.step-card,.pil,.att,.visa,.mock-phone,.mock-dash,.mock-video{border-radius:var(--r-sm)}
.tile.chosen,.tile.on,.bw-opt-card.primary,.cf-result.on,.sh-ni.on{border-color:var(--accent);background:var(--tint-blue)}
.note-box,.note,.tip,.hint.note,.bw-when-empty,.notice.warn{background:var(--note);border:1px solid var(--note-line);color:var(--text);border-radius:var(--r-sm)}
.notice.info,.bw-ai-offer{background:var(--tint-blue);border-color:transparent}
.notice.bad,.err,.field-err,.bw-msg.err{color:var(--red-ink)}
.notice.bad{background:var(--red-tint);border-color:transparent}
.toast{background:var(--navy);color:#fff;border-radius:var(--pill);box-shadow:var(--shadow-sm)}
.sep,.dd-sep,.line{background:var(--border)}
.prep-bar,.bar,.mock-prog,.pct-bar,.timer,.wc-line{border-radius:var(--pill)}
.prep-bar>*,.bar i,.bar>i,.mock-fill{background:var(--accent);border-radius:var(--pill)}

/* 7. Status pills: sent amber, signed green, retained blue, declined red, draft navy */
.pill,.tag,.st,.bar-pill,.ago,.chip,.ai-chip,.vsdk-chip,.lang-chip,.bw-chip,.bw-sum-chip,.bw-cf-name,.tags i,.visa-code,.mock-badge,.badge,.kind,.k,.step-num,.n,.att-badge{border-radius:var(--pill)}
.st.sent,.st.viewed,.st.proposed,.pill.scheduled,.pill.requested,.pill.proposed,.pill.sent,.pill.viewed,.tag.sent,.tag.pending,.pending{background:var(--amber-tint);color:var(--amber-ink);border-color:transparent}
.st.signed,.st.completed,.pill.completed,.pill.signed,.pill.confirmed,.prep-dec.confirmed,.tag.signed,.ok,.done .tag,.bw-msg.ok{background:var(--green-tint);color:var(--green-ink);border-color:transparent}
.st.retained,.st.in_progress,.pill.in_progress,.pill.retained,.tag.retained,.filled{background:var(--tint-blue);color:var(--accent-deep);border-color:transparent}
.st.declined,.st.cancelled,.st.no_show,.pill.cancelled,.pill.no_show,.pill.declined,.prep-dec.declined,.tag.declined,.miss{background:var(--red-tint);color:var(--red-ink);border-color:transparent}
.st.draft,.pill.draft,.tag.draft{background:var(--navy);color:#fff;border-color:transparent}
.st.expired,.st.void,.pill.past,.pill.expired,.tag.void{background:var(--surface);color:var(--muted);border-color:transparent}
.bar-pill{background:var(--green-tint);color:var(--green-ink);border-color:transparent}
.tags i,.chip,.bw-chip,.ai-chip{background:#fff;border:1.5px solid var(--border);color:var(--text)}
.tags i.hit,.chip.on,.bw-chip.on,.ai-chip.on{background:var(--tint-blue);border-color:var(--accent);color:var(--accent-deep);font-weight:600}
.tags i.l{background:var(--surface);color:var(--muted);border-color:transparent}
.tab.active,.tab.on,.tabs .on,.seg .seg-opt.on,.seg .on{background:var(--tint-blue);color:var(--accent-deep);border-color:transparent}

/* 8. Forms */
.inp,.input,.field input,.field textarea,.field select,.bw-field input,.bw-other-input,.bw-cf-row input,.bw-req textarea,.cf-search input,.search,.sel,input[type=text],input[type=email],input[type=url],input[type=number],input[type=search],textarea,select{
  border-radius:var(--r-xs);border:1.5px solid var(--border);background:#fff;color:var(--text);font-family:'Inter',system-ui,sans-serif}
.inp:focus,.input:focus,.field input:focus,.field textarea:focus,.bw-field input:focus,.bw-other-input:focus,.bw-cf-row input:focus,.bw-req textarea:focus,.cf-search input:focus,input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,255,0.12);outline:none}
.code-inputs input,.bw-code-inputs input{border-radius:var(--r-xs);font-family:'Instrument Serif',serif;font-weight:400}
label.l,.lbl,.bw-field label,.bw-section-label,.bw-cf-group label,.lang-lbl{color:var(--muted);font-weight:600;letter-spacing:.06em}
.chk input,input[type=checkbox],input[type=radio]{accent-color:var(--accent)}

/* 9. Avatars and photos */
.av,.ph,.who img,.pp,.by img,.author img,.sig img,.nav-avatar img,.att-av,.bw-attorney img,.top img,.top .ph,.flist .f img{border-radius:50%}
.av,.ph,.att-av{background:var(--tint-blue-2);color:var(--navy);border:none}

/* 10. Modals and overlays */
#proxenos-modal-bg,.bw-overlay,.dialog-backdrop{background:rgba(0,33,71,0.45)}
.bw-card,.modal,.dialog,.sh-box.open{border-radius:var(--r-md)}
.bw-close{background:var(--surface)}.bw-close:hover{background:var(--tint-blue-2)}

/* 11. Legacy accents that no longer belong */
.hero-tag,.st-ey,.kicker,.item .k{color:var(--accent-deep)}
[style*="linear-gradient"]{background-image:none}

/* Labelled action buttons are 12px rounded rectangles, like the writing desk's Send (founder, Sept 12, 2026). Round icon buttons, avatars, capsules, chips and tags keep their shapes. */
.btn,.btn-go,.btn-p,.btn-big,.btn-join,.btn-book,.sh-btn,.nav-signin,.nav-menu-btn,.hamburger,.modal-btn{border-radius:12px !important}

/* Second tier, also rectangles (founder, Sept 13, 2026): chips, filters, tabs, segmented controls, sidebar items, visa chips, legal nav. Their containers 14px. */
.sidebar-item,.tab,.tabs button,.chip,.filter{border-radius:12px !important}
.tabs{border-radius:14px !important}