/* Paisa Stack — shared calculator styles (extracted from the main site) */
  :root{
    --bg:#FFFFFF;
    --bg-soft:#FBFAF7;
    --surface:#F5F4EF;
    --surface-2:#ECEAE1;
    --border: rgba(18,32,61,0.12);
    --border-2: rgba(18,32,61,0.22);
    --ink:#12203D;
    --text-dim:#5B6472;
    --text-dimmer:#8891A0;
    --amber:#A8781E;
    --amber-soft: rgba(168,120,30,0.10);
    --teal:#1F8F73;
    --teal-soft: rgba(31,143,115,0.10);
    --rose:#C6432F;
    --rose-soft: rgba(198,67,47,0.10);
    --mono: 'JetBrains Mono', monospace;
    --sans: 'Inter', sans-serif;
    --display: 'Fraunces', serif;
    --navy-deep:#0E1B33;
    --navy-mid:#152645;
    --gold:#D4AF5A;
    --gold-dim:#9FB0CC;
    --radius: 12px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  [id]{scroll-margin-top: 90px;}
  body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:var(--sans);
    line-height:1.6;
  }
  h1,h2,h3{font-family:var(--display); margin:0; font-weight:600; color:var(--ink);}
  a{color:inherit; text-decoration:none;}
  .mono{font-family:var(--mono);}
  ::selection{background:var(--amber-soft); color:var(--amber);}

  .tool-window{background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; box-shadow:0 2px 18px rgba(27,35,51,0.05);}
  .tool-titlebar{display:flex; align-items:center; gap:8px; padding:12px 18px; background:var(--surface); border-bottom:1px solid var(--border);}
  .tool-titlebar .dots{display:flex; gap:6px;}
  .tool-titlebar .dot{width:9px; height:9px; border-radius:50%;}
  .tool-titlebar .name{margin-left:6px; font-size:0.86rem; font-weight:600; color:var(--ink);}
  .tool-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:0;}
  @media (max-width:820px){.tool-grid{grid-template-columns:1fr;}}
  .tool-form{padding:26px; border-right:1px solid var(--border);}
  @media (max-width:820px){.tool-form{border-right:none; border-bottom:1px solid var(--border);}}
  .tool-out{padding:26px;}

  .field{margin-bottom:20px;}
  .field:last-child{margin-bottom:0;}
  .field-label{display:flex; justify-content:space-between; align-items:baseline; font-size:0.86rem; font-weight:500; color:var(--ink); margin-bottom:8px;}
  .field-label .val{font-family:var(--mono); color:var(--amber); font-size:0.88rem; font-weight:600;}
  .field-hint{font-size:0.78rem; color:var(--text-dimmer); margin-top:6px;}

  input[type="number"]{
    width:100%; padding:10px 12px; border-radius:7px;
    border:1px solid var(--border-2); background:var(--bg-soft); color:var(--ink);
    font-family:var(--mono); font-size:0.94rem;
  }
  input[type="number"]:focus, input[type="range"]:focus-visible{outline:2px solid var(--teal); outline-offset:1px;}
  input[type="range"]{width:100%; margin-top:10px; accent-color:var(--teal);}

  .seg{display:flex; border:1px solid var(--border-2); border-radius:7px; overflow:hidden;}
  .seg button{flex:1; border:none; background:var(--bg-soft); color:var(--text-dim); padding:10px 10px; font-size:0.86rem; font-weight:500; cursor:pointer; border-right:1px solid var(--border-2);}
  .seg button:last-child{border-right:none;}
  .seg button[aria-pressed="true"]{background:var(--teal); color:#fff; font-weight:600;}

  .toggle-row{display:flex; align-items:center; justify-content:space-between; gap:10px;}
  .switch{position:relative; width:42px; height:24px; flex:0 0 auto;}
  .switch input{position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer;}
  .switch .track{position:absolute; inset:0; background:var(--border-2); border-radius:999px; transition:background .15s;}
  .switch .thumb{position:absolute; top:3px; left:3px; width:18px; height:18px; background:#fff; border-radius:50%; box-shadow:0 1px 3px rgba(0,0,0,0.2); transition:transform .15s;}
  .switch input:checked + .track{background:var(--teal);}
  .switch input:checked + .track + .thumb{transform:translateX(18px);}

  .console{background:var(--bg-soft); border:1px solid var(--border); border-radius:9px; padding:16px;}
  .console .l{margin-bottom:9px; display:flex; justify-content:space-between; gap:10px; font-size:0.87rem;}
  .console .l .k{color:var(--text-dim);}
  .console .l .v{font-family:var(--mono); color:var(--ink); font-weight:600; text-align:right;}
  .console .l.hl .v{color:var(--amber); font-weight:700;}
  .console .l.good .v{color:var(--teal); font-weight:700;}

  .result-hero{margin-bottom:18px;}
  .result-hero .rl{font-size:0.82rem; color:var(--text-dim); font-weight:500;}
  .result-hero .rv{font-family:var(--mono); font-size:2.1rem; font-weight:700; color:var(--amber); margin-top:4px;}
  .result-hero.calm .rv{color:var(--teal);}
  .result-hero .rn{font-size:0.88rem; color:var(--text-dim); margin-top:6px;}

  .bar-wrap{margin:18px 0;}
  .bar-item{margin-bottom:12px;}
  .bar-top{display:flex; justify-content:space-between; font-size:0.84rem; margin-bottom:6px;}
  .bar-top .nm{color:var(--text-dim);}
  .bar-top .amt{font-family:var(--mono); color:var(--ink);}
  .bar-track{height:8px; background:var(--surface-2); border-radius:999px; overflow:hidden;}
  .bar-fill{height:100%; background:var(--text-dimmer); border-radius:999px; transition:width .5s cubic-bezier(.2,.7,.3,1);}
  .bar-fill.win{background:var(--teal);}
  .bar-fill.warn{background:var(--amber);}

  .note-flag{margin-top:16px; background:var(--teal-soft); border-left:3px solid var(--teal); padding:10px 12px; border-radius:0 7px 7px 0; font-size:0.82rem; color:var(--ink);}

/* ---- page-specific wrapper styles for standalone calculator pages ---- */
body{font-family:var(--sans);}
.calc-page-wrap{max-width:900px; margin:0 auto; padding:0 22px;}
header.calc-header{border-bottom:1px solid var(--border); padding:16px 0; margin-bottom:8px;}
.calc-nav{display:flex; align-items:center; justify-content:space-between; max-width:900px; margin:0 auto; padding:0 22px;}
.calc-brand{font-family:var(--display); font-weight:700; font-size:1.05rem; display:flex; align-items:center; gap:8px; text-decoration:none; color:var(--ink);}
.calc-brand .mark{width:26px;height:26px;border-radius:7px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:0.82rem;font-weight:700;}
.calc-back{font-size:0.86rem; color:var(--text-dim); text-decoration:none;}
.calc-breadcrumb{font-family:var(--mono); font-size:0.76rem; color:var(--text-dimmer); margin:24px 0 6px;}
.calc-breadcrumb a{color:var(--text-dimmer);}
h1.calc-title{font-family:var(--display); font-size:clamp(1.5rem,4vw,2rem); margin:0 0 10px; color:var(--ink);}
.calc-lede{color:var(--text-dim); font-size:1rem; margin-bottom:28px; max-width:70ch;}
.calc-body-copy{max-width:70ch; margin:32px 0; font-size:0.98rem; color:var(--ink); line-height:1.75;}
.calc-body-copy h2{font-size:1.2rem; margin:28px 0 10px;}
.calc-body-copy p{margin:0 0 14px;}
.calc-cta{margin:40px 0 20px; background:var(--ink); color:#fff; border-radius:14px; padding:24px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;}
.calc-cta a{background:var(--gold, var(--amber)); color:#1A1204; padding:11px 20px; border-radius:8px; font-weight:600; font-size:0.9rem; text-decoration:none; white-space:nowrap;}
.calc-related{display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 40px;}
.calc-related a{border:1px solid var(--border-2); border-radius:999px; padding:8px 16px; font-size:0.86rem; color:var(--ink); text-decoration:none;}
.calc-related a:hover{background:var(--surface);}
footer.calc-footer{border-top:1px solid var(--border); padding:26px 0 50px; font-size:0.8rem; color:var(--text-dimmer); margin-top:20px;}
