:root{
  --navy:#0f2740;
  --navy-2:#1b3a5a;
  --blue:#2f80c9;
  --blue-deep:#255f9c;
  --sky-pale:#eaf4fb;
  --sky-1:#cce4f2;
  --sky-2:#9ccef0;
  --sky-3:#84c0f0;
  --stripe:rgba(132,192,240,.22);
  --stripe-2:rgba(132,192,240,.11);
  --mist:#f4f9fd;
  --paper:#ffffff;
  --ink:#22323f;
  --soft:#5f7385;
  --line:#e2e9f0;
  --coral:#df6b4f;
  --coral-deep:#bf4e34;
  --shadow:0 18px 50px -24px rgba(15,39,64,.4);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--mist);color:var(--ink);
  font-family:Inter,system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,.fr{font-family:Fraunces,Georgia,serif;line-height:1.08;margin:0}
.accent{font-family:Fraunces,serif;font-style:italic;color:var(--blue)}
.eyebrow{font-family:Inter;font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.72rem;color:var(--blue-deep)}

.wedge{position:relative;overflow:hidden}
.wedge::before{content:"";position:absolute;inset:0;z-index:0;
  background-image:repeating-linear-gradient(114deg,var(--stripe) 0 20px,transparent 20px 46px,var(--stripe-2) 46px 60px,transparent 60px 92px);
  clip-path:polygon(0 0,100% 0,100% 58%,0 82%)}
.wedge>*{position:relative;z-index:1}

/* switcher */
.switch{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);display:flex;gap:2px;flex-wrap:wrap;align-items:center;padding:10px 16px}
.switch .brand{font-family:Fraunces;font-weight:600;font-size:15px;color:var(--navy);margin-right:18px;white-space:nowrap}
.switch .brand i{font-style:italic;color:var(--blue)}
.switch button{font-family:Inter;font-weight:600;font-size:12.5px;color:var(--soft);
  background:transparent;border:1px solid transparent;border-radius:999px;padding:7px 14px;cursor:pointer;transition:.16s;white-space:nowrap}
.switch button:hover{color:var(--navy);background:var(--sky-pale)}
.switch button[aria-current="true"]{color:#fff;background:var(--blue)}
.switch .tag{margin-left:auto;color:#9fb0c1;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}

.stage{max-width:1080px;margin:0 auto;padding:34px 20px 90px}
.view{display:none;animation:rise .4s ease both}
.view.on{display:block}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.viewnote{max-width:1080px;margin:0 auto;padding:14px 20px 0;color:#8298ab;font-size:12.5px}
.viewnote b{color:var(--blue)}

.card{background:var(--paper);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;border:1px solid var(--line)}
.btn{display:inline-block;background:var(--blue);color:#fff;font-weight:700;font-family:Inter;
  border:none;border-radius:10px;padding:13px 26px;font-size:15px;cursor:pointer;transition:.16s}
.btn:hover{background:var(--blue-deep)}

/* EMAIL */
.mailwrap{max-width:600px;margin:0 auto}
.mail{background:var(--paper);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line)}
.mail .top{padding:34px 34px 30px;background:var(--sky-pale)}
.mail .top .eyebrow{color:var(--blue-deep)}
.mail .top h2{margin:.45em 0 0;font-size:28px;color:var(--navy)}
.mail .top h2 i{font-style:italic;color:var(--blue)}
.mail .body{padding:28px 34px 34px;font-size:15.5px;color:var(--ink)}
.mail .body p{margin:0 0 15px}
.mail .cta-row{margin:22px 0 12px}
.mail .fine{font-size:12.5px;color:var(--soft);border-top:1px solid var(--line);margin-top:22px;padding-top:16px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 2px}
.chip{background:var(--sky-pale);color:var(--navy);border-radius:999px;padding:5px 12px;font-size:12px;font-weight:600}

/* FORM */
.formhero{padding:44px 40px 40px;background:var(--paper)}
.formhero h1{color:var(--navy);font-size:38px;margin:.3em 0 .35em;max-width:18ch;font-weight:500}
.formhero h1 i{font-style:italic;color:var(--blue)}
.formhero p{color:#3c4c5a;font-size:16px;max-width:56ch;margin:0;font-family:Inter}
.formbody{padding:6px 40px 40px}
.qgroup{border-top:1px solid var(--line);padding:26px 0}
.qgroup:first-of-type{border-top:none;padding-top:6px}
.qlabel{font-family:Fraunces;font-weight:600;font-size:19px;color:var(--navy);margin:0 0 4px}
.qhint{font-size:13px;color:var(--soft);margin:0 0 14px}
.scale{display:grid;grid-template-columns:1.4fr repeat(5,1fr);gap:6px;align-items:center}
.scale .head{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);text-align:center;padding-bottom:2px;font-family:Inter}
.stmt-row{display:grid;grid-template-columns:1.4fr repeat(5,1fr);gap:6px;align-items:center;padding:9px 0;border-bottom:1px dashed var(--line)}
.stmt-row:last-child{border-bottom:none}
.stmt-row .stmt{font-size:15px;color:var(--ink)}
.opt{position:relative}
.opt input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.opt label{display:block;text-align:center;font-size:11.5px;font-weight:600;color:var(--soft);
  border:1.5px solid var(--line);border-radius:10px;padding:12px 4px;cursor:pointer;transition:.14s;background:#fff}
.opt input:checked+label{background:var(--blue);color:#fff;border-color:var(--blue)}
.opt input:focus-visible+label{outline:2px solid var(--navy);outline-offset:2px}
.num{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;max-width:520px}
.num input{width:96px;font-family:Inter;font-size:17px;font-weight:600;color:var(--navy);
  border:1.5px solid var(--line);border-radius:10px;padding:11px 12px;background:#fff}
.num input:focus{outline:2px solid var(--blue);border-color:var(--blue)}
.field{margin:0 0 16px}
.field label{display:block;font-weight:600;font-size:14px;margin-bottom:6px}
.field input{width:100%;font-family:Inter;font-size:15px;border:1.5px solid var(--line);border-radius:10px;padding:12px 13px;background:#fff}
.field input:focus{outline:2px solid var(--blue);border-color:var(--blue)}
.reportrow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.reportrow .field{margin:0}
.repline{display:grid;grid-template-columns:1fr 1.4fr;gap:10px;margin-bottom:8px}
.addrep{background:none;border:none;color:var(--blue);font-weight:600;font-size:13px;cursor:pointer;padding:4px 0}
.submitbar{margin-top:28px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.submitbar .req{font-size:12.5px;color:var(--soft);max-width:44ch}

/* RESULT */
.result .top{padding:46px 40px;text-align:center;background:var(--paper)}
.result .top h1{color:var(--navy);font-size:33px;margin:.2em auto .3em;max-width:20ch;font-weight:500}
.result .top h1 i{font-style:italic;color:var(--blue)}
.result .top p{color:#3c4c5a;max-width:52ch;margin:0 auto;font-size:15.5px;font-family:Inter}
.selfgrid{padding:8px 40px 34px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.selfcard{border:1px solid var(--line);border-radius:14px;padding:18px 20px;background:#fff}
.selfcard .h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:3px;gap:8px}
.selfcard .name{font-family:Fraunces;font-weight:600;font-size:17px;color:var(--navy)}
.selfcard .val{font-family:Fraunces;font-weight:600;font-size:22px;color:var(--blue)}
.selfcard .sub{font-size:12px;color:var(--soft);margin:0 0 12px;font-family:Inter}
.selfcard .track2{height:8px;border-radius:99px;background:var(--sky-pale);overflow:hidden}
.selfcard .fill{height:100%;background:var(--blue);border-radius:99px;width:0;transition:width 1s cubic-bezier(.2,.7,.2,1)}
.pending{margin:0 40px 40px;background:var(--sky-pale);border:1px solid var(--sky-1);border-radius:14px;padding:20px 22px;display:flex;gap:16px;align-items:flex-start}
.pending .dot{width:10px;height:10px;border-radius:99px;background:var(--blue);margin-top:6px;flex:none;box-shadow:0 0 0 4px rgba(47,128,201,.18)}
.pending b{color:var(--navy)}

/* REPORT */
.report{background:var(--paper);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line)}
.rhero{padding:50px 46px 44px;background:var(--paper)}
.rhero h1{color:var(--navy);font-size:42px;line-height:1.06;margin:.35em 0 .3em;max-width:20ch;font-weight:500}
.rhero h1 i{font-style:italic;color:var(--coral)}
.rhero .sub{color:#3c4c5a;max-width:58ch;font-size:16.5px;margin:0;font-family:Inter}
.rhero .sub b{color:var(--navy)}
.rhero .who{margin-top:22px;font-size:13px;color:var(--soft);font-family:Inter}
.rhero .who b{color:var(--navy)}

.gapbig{position:relative;margin:8px 46px 0;background:#fff;border-radius:16px;padding:26px 28px;border:1px solid var(--line);box-shadow:0 12px 30px -22px rgba(15,39,64,.4)}
.gapbig .lab{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;gap:12px}
.gapbig .lab .t{font-family:Fraunces;font-weight:600;font-size:20px;color:var(--navy)}
.gapbig .lab .g{font-family:Fraunces;font-weight:600;font-size:16px;color:var(--coral-deep);white-space:nowrap}
.gapbig .read{margin:14px 0 0;font-size:17px;line-height:1.6;color:var(--ink);font-family:Fraunces}
.gapbig .read b{color:var(--navy)}

.track{position:relative;height:58px;margin:12px 0 6px}
.track .rail{position:absolute;top:50%;left:0;right:0;height:6px;transform:translateY(-50%);background:var(--sky-pale);border-radius:99px}
.track .span{position:absolute;top:50%;height:6px;transform:translateY(-50%);background:var(--coral);border-radius:99px;
  transition:width 1.1s cubic-bezier(.2,.7,.2,1),left 1.1s cubic-bezier(.2,.7,.2,1)}
.track .span.pos{background:var(--blue)}
.track .mk{position:absolute;top:50%;transform:translate(-50%,-50%);width:0;height:0;transition:left 1.1s cubic-bezier(.2,.7,.2,1)}
.track .mk .dot{width:20px;height:20px;border-radius:99px;transform:translate(-50%,-50%);position:absolute;box-shadow:0 3px 8px rgba(15,39,64,.3)}
.track .mk.self .dot{background:var(--navy);border:3px solid #fff}
.track .mk.team .dot{background:#fff;border:3px solid var(--navy)}
.track .mk .cap{position:absolute;left:0;transform:translateX(-50%);white-space:nowrap;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--soft);font-family:Inter}
.track .mk.self .cap{top:-22px;color:var(--navy)}
.track .mk.team .cap{top:14px}
.track .scaleticks{position:absolute;left:0;right:0;bottom:-4px;display:flex;justify-content:space-between}
.track .scaleticks span{font-size:10px;color:#a9bccb}

.sections{padding:28px 46px 10px;display:grid;gap:14px}
.srow{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px}
.srow .head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;gap:10px}
.srow .head .t{font-family:Fraunces;font-weight:600;font-size:20px;color:var(--navy)}
.srow .head .t small{display:block;font-family:Inter;font-weight:500;font-size:12.5px;color:var(--soft);margin-top:3px;letter-spacing:0;text-transform:none}
.badge{font-size:11.5px;font-weight:700;padding:5px 11px;border-radius:999px;white-space:nowrap;font-family:Inter}
.badge.blind{background:#f8e2da;color:var(--coral-deep)}
.badge.hidden{background:#dcebf8;color:var(--blue-deep)}
.badge.aligned{background:var(--sky-pale);color:var(--soft)}
.srow .interp{font-size:14.5px;color:var(--ink);margin:12px 0 0;font-family:Inter}
.legend{display:flex;gap:22px;flex-wrap:wrap;padding:6px 46px 0;font-size:12.5px;color:var(--soft);font-family:Inter}
.legend .k{display:inline-flex;align-items:center;gap:7px}
.legend .k i{width:14px;height:14px;border-radius:99px;display:inline-block}
.legend .k.self i{background:var(--navy)}
.legend .k.team i{background:#fff;border:2px solid var(--navy)}
.legend .k.blind i{background:var(--coral)}
.legend .k.strength i{background:var(--blue)}

.hours{margin:24px 46px 0;background:var(--navy);border-radius:14px;color:#dbe7f1;padding:28px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.hours .big{font-family:Fraunces;font-weight:600;font-size:46px;color:#fff;line-height:1}
.hours .txt{font-size:14.5px;max-width:56ch;font-family:Inter}
.hours .txt b{color:#fff}

.cta{margin:28px 46px 46px;text-align:center;background:var(--sky-pale);border:1px solid var(--sky-1);border-radius:16px;padding:38px 30px}
.cta .eyebrow{color:var(--blue-deep)}
.cta h3{font-family:Fraunces;font-weight:500;font-size:27px;color:var(--navy);margin:.3em 0 8px}
.cta h3 i{font-style:italic;color:var(--blue)}
.cta p{color:var(--soft);max-width:52ch;margin:0 auto 20px;font-size:15px;font-family:Inter}

@media(max-width:720px){
  .scale,.stmt-row{grid-template-columns:1fr;gap:4px}
  .scale .head{display:none}
  .opt label{text-align:left;padding:11px 14px}
  .stmt-row .stmt{font-weight:600;margin-bottom:4px}
  .selfgrid,.reportrow{grid-template-columns:1fr}
  .formhero,.formbody,.rhero,.sections,.mail .body,.mail .top,.result .top,.selfgrid{padding-left:24px;padding-right:24px}
  .gapbig,.hours,.cta,.legend,.pending{margin-left:20px;margin-right:20px}
  .rhero h1{font-size:31px}.formhero h1{font-size:28px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* weekly-hours RAG band */
.hours .hcol{text-align:center;flex:none}
.hours .big.green{color:#5fd0a8}
.hours .big.yellow{color:#e9b44a}
.hours .big.red{color:#f0805f}
.hours .zone{font-family:Inter;font-weight:700;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;margin-top:4px}
.hours .zone.green{color:#5fd0a8}
.hours .zone.yellow{color:#e9b44a}
.hours .zone.red{color:#f0805f}
.rhero h1.pos i{color:var(--blue)}

.hnote{margin:10px 46px 0;color:var(--soft);font-size:11.5px;font-family:Inter}
@media(max-width:720px){.hnote{margin-left:20px;margin-right:20px}}

/* print / save-as-pdf */
.printbtn{position:fixed;top:16px;right:16px;z-index:100;background:var(--navy);color:#fff;border:none;
  border-radius:8px;padding:9px 16px;font-family:Inter;font-weight:600;font-size:13px;cursor:pointer;box-shadow:0 6px 18px -8px rgba(15,39,64,.5)}
.printbtn:hover{background:var(--navy-2)}
@media print{
  body{background:#fff}
  .stage{padding:0;max-width:none}
  .report{box-shadow:none;border:none;border-radius:0}
  .printbtn{display:none}
  .wedge::before{display:none}
  .gapbig,.srow,.hours,.cta,.legend{break-inside:avoid;page-break-inside:avoid}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

.badge.shared{background:#f6ead6;color:#a9762a}
.legend .k.shared i{background:#c98a3c}

.badge.enjoy{background:#d5efe9;color:#0f766e}
.legend .k.enjoy i{background:#17998c}

.badge.urgent{background:#f4d3ca;color:#9a2d18;box-shadow:inset 0 0 0 1px #dd8b78}