.aokb-app{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;}
.aokb-app{
    --bg:#f7f6f3; --panel:#ffffff; --line:#e4e1db; --line2:#d2cec6;
    --text:#26241f; --muted:#7c776d; --accent:#e8663c; --accentD:#cf5026;
    --soft:#fdf1ec; --good:#2e8f5e; --warn:#a8631a; --warnbg:#fdf3e4;
    --dark:#181713;
  }
.aokb-app *{box-sizing:border-box;margin:0;padding:0;}
.aokb-app body{background:var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
.aokb-app .layout{display:grid;grid-template-columns:1.3fr 1fr;min-height:calc(100vh - 100px);}
@media(max-width:920px){.aokb-app .layout{grid-template-columns:1fr;}}
.aokb-app .stage{padding:16px 20px;display:flex;flex-direction:column;gap:12px;}
.aokb-app #vis{position:relative;flex:1;min-height:380px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:linear-gradient(#dceefb,#eef5ef);}
.aokb-app #three{width:100%;height:100%;display:block;cursor:grab;}
.aokb-app #three:active{cursor:grabbing;}
.aokb-app .vhint{position:absolute;left:12px;bottom:10px;background:rgba(255,255,255,.85);border:1px solid var(--line);border-radius:16px;padding:4px 12px;font-size:11px;color:var(--muted);}
.aokb-app .vlabel{position:absolute;right:12px;top:10px;background:rgba(255,255,255,.9);border:1px solid var(--line);border-radius:10px;padding:6px 12px;font-size:12px;color:var(--text);font-weight:600;}
.aokb-app .pricebar{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:13px 18px;box-shadow:0 2px 10px rgba(60,50,30,.05);}
.aokb-app .pricebar .row{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px;}
.aokb-app .pricebar .est{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;}
.aokb-app .pricebar .amount{font-size:25px;font-weight:800;}
.aokb-app .pricebar .amount span{color:var(--accent);}
.aokb-app .pricebar .note{font-size:11.5px;color:var(--muted);margin-top:4px;}
.aokb-app details.breakdown summary{cursor:pointer;color:var(--accentD);font-size:12.5px;margin-top:8px;}
.aokb-app details.breakdown table{width:100%;margin-top:8px;border-collapse:collapse;font-size:13px;}
.aokb-app details.breakdown td{padding:4px 0;color:var(--muted);border-bottom:1px dashed var(--line);}
.aokb-app details.breakdown td:last-child{text-align:right;color:var(--text);}
.aokb-app .config{padding:16px 20px 40px;overflow-y:auto;background:#fbfaf8;border-left:1px solid var(--line);}
.aokb-app .progress{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.aokb-app .progress .bar{flex:1;height:6px;background:var(--line);border-radius:3px;overflow:hidden;}
.aokb-app .progress .bar i{display:block;height:100%;background:var(--accent);border-radius:3px;transition:.3s;}
.aokb-app .progress span{font-size:11.5px;color:var(--muted);white-space:nowrap;}
.aokb-app .steps-nav{display:flex;gap:5px;margin-bottom:16px;flex-wrap:wrap;}
.aokb-app .steps-nav button{flex:1;min-width:64px;background:#fff;border:1px solid var(--line);color:var(--muted);padding:7px 4px;border-radius:10px;cursor:pointer;font-size:10.5px;line-height:1.25;}
.aokb-app .steps-nav button b{display:block;font-size:13px;color:var(--text);}
.aokb-app .steps-nav button.active{border-color:var(--accent);background:var(--soft);}
.aokb-app .steps-nav button.done b{color:var(--good);}
.aokb-app .step{display:none;animation:fade .25s;}
.aokb-app .step.active{display:block;}
@keyframes fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;}}
.aokb-app .step h3{font-size:20px;margin-bottom:4px;}
.aokb-app .step p.hint{color:var(--muted);font-size:13px;margin-bottom:14px;line-height:1.45;}
.aokb-app .grp{margin-bottom:18px;}
.aokb-app .grp label.t{display:block;font-size:11.5px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:8px;}
.aokb-app .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px;}
.aokb-app .card{position:relative;background:#fff;border:1.5px solid var(--line2);border-radius:12px;padding:10px 8px;cursor:pointer;text-align:center;font-size:12.5px;transition:.15s;}
.aokb-app .card:hover{border-color:#b9b2a5;box-shadow:0 2px 8px rgba(60,50,30,.08);}
.aokb-app .card.sel{border-color:var(--accent);background:var(--soft);box-shadow:0 0 0 1px var(--accent);}
.aokb-app .card img{width:100%;height:56px;object-fit:cover;border-radius:8px;margin-bottom:6px;background:#eee;}
.aokb-app .card .price{display:block;color:var(--accentD);font-size:11px;margin-top:3px;font-weight:700;}
.aokb-app .card .sub{display:block;color:var(--muted);font-size:10.5px;margin-top:2px;}
.aokb-app .badge{position:absolute;top:-8px;left:50%;transform:translateX(-50%);background:var(--accent);color:#fff;font-size:9px;font-weight:700;padding:2px 8px;border-radius:8px;white-space:nowrap;}
.aokb-app .swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:7px;}
.aokb-app .sw{border:2px solid var(--line2);border-radius:10px;cursor:pointer;overflow:hidden;text-align:center;background:#fff;}
.aokb-app .sw img{width:100%;height:40px;object-fit:cover;display:block;background:#eee;}
.aokb-app .sw .nm{font-size:9.5px;color:var(--muted);padding:4px 3px;line-height:1.2;}
.aokb-app .sw.sel{border-color:var(--accent);}
.aokb-app .sw.sel .nm{color:var(--text);font-weight:600;}
.aokb-app .sliderrow{display:flex;align-items:center;gap:12px;margin-bottom:6px;}
.aokb-app .sliderrow input[type=range]{flex:1;accent-color:var(--accent);}
.aokb-app .sliderrow .val{min-width:62px;text-align:center;background:#fff;border:1px solid var(--line2);border-radius:8px;padding:6px 4px;font-weight:700;font-size:13.5px;}
.aokb-app .navbtns{display:flex;justify-content:space-between;margin-top:20px;gap:10px;}
.aokb-app .btn{padding:12px 22px;border-radius:11px;border:1px solid var(--line2);background:#fff;color:var(--text);cursor:pointer;font-size:14px;}
.aokb-app .btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700;box-shadow:0 3px 10px rgba(232,102,60,.3);}
.aokb-app .btn.primary:hover{background:var(--accentD);}
.aokb-app .toggle{display:flex;gap:8px;flex-wrap:wrap;}
.aokb-app .toggle .card{flex:1;min-width:100px;}
.aokb-app .planwrap{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:14px;}
.aokb-app .planwrap svg{width:100%;height:auto;display:block;}
.aokb-app .reco{background:var(--soft);border:1px solid #f3c9b6;border-radius:12px;padding:11px 14px;font-size:13px;line-height:1.5;margin-bottom:14px;}
.aokb-app .reco b{color:var(--accentD);}
.aokb-app .fitwarn{background:var(--warnbg);border:1px solid #ecd3a8;color:var(--warn);border-radius:11px;padding:10px 13px;font-size:12.5px;line-height:1.5;margin-bottom:12px;}
.aokb-app .spec{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:14px;}
.aokb-app .spec dt{color:var(--muted);font-size:10.5px;text-transform:uppercase;letter-spacing:1px;margin-top:9px;}
.aokb-app .spec dd{font-size:14px;margin-top:2px;}
.aokb-app .leadform input{width:100%;background:#fff;border:1px solid var(--line2);color:var(--text);border-radius:10px;padding:12px;font-size:14px;margin-bottom:9px;}
.aokb-app .fineprint{font-size:11px;color:var(--muted);margin-top:10px;line-height:1.5;}
.aokb-app #sentmsg{display:none;background:#eaf6ef;border:1px solid #bfe0cd;color:#256b47;border-radius:10px;padding:14px;font-size:13.5px;margin-top:10px;line-height:1.5;}
/* ===== v2.2 mobile & CRO ===== */
.aokb-mbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:99999;background:#181713;color:#fff;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;box-shadow:0 -4px 14px rgba(0,0,0,.3);}
.aokb-mbar .mp{font-size:16px;font-weight:800;line-height:1.1;}
.aokb-mbar .mp small{display:block;font-size:9.5px;color:#b7b1a4;font-weight:600;letter-spacing:1.5px;}
.aokb-mbar button{background:#e8663c;border:none;color:#fff;font-weight:700;padding:13px 22px;border-radius:10px;font-size:15px;cursor:pointer;white-space:nowrap;}
@media(max-width:920px){
  .aokb-app .stage{padding:10px 12px;}
  .aokb-app #vis{min-height:230px;padding:8px !important;}
  .aokb-app #paper{max-height:330px !important;}
  .aokb-app .config{padding:12px 14px 30px;border-left:none;}
  .aokb-app .steps-nav button{padding:11px 4px;font-size:11.5px;min-width:58px;}
  .aokb-app .btn{padding:15px 22px;font-size:15.5px;}
  .aokb-app .card{padding:12px 8px;}
  .aokb-app{padding-bottom:78px;}
  .aokb-mbar{display:flex;}
}

/* ===== v2.7 final-page estimate card & trust ===== */
.aokb-app .estcard{background:#fff;border:2px solid var(--accent);border-radius:16px;padding:18px 20px;margin-bottom:14px;box-shadow:0 4px 16px rgba(232,102,60,.12);}
.aokb-app .estcard .eyebrow{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);font-weight:700;}
.aokb-app .estcard .bigrange{font-size:30px;font-weight:800;color:var(--accentD);line-height:1.15;margin:4px 0 2px;}
.aokb-app .estcard .bigrange small{font-size:15px;color:var(--muted);font-weight:700;}
.aokb-app .estcard table.gst{width:100%;border-collapse:collapse;margin:10px 0 2px;font-size:14px;}
.aokb-app .estcard table.gst td{padding:6px 0;border-top:1px dashed var(--line);}
.aokb-app .estcard table.gst td:last-child{text-align:right;font-weight:700;}
.aokb-app .estcard tr.tot td{border-top:2px solid var(--line2);font-size:15.5px;}
.aokb-app .estcard details{margin-top:10px;}
.aokb-app .estcard details summary{cursor:pointer;color:var(--accentD);font-weight:700;font-size:13.5px;padding:6px 0;}
.aokb-app .estcard details table{width:100%;border-collapse:collapse;font-size:13px;margin-top:6px;}
.aokb-app .estcard details td{padding:5px 0;color:var(--muted);border-bottom:1px dashed var(--line);}
.aokb-app .estcard details td:last-child{text-align:right;color:var(--text);}
.aokb-app .trust4{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:14px 0;}
.aokb-app .trust4 .titem{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 13px;font-size:12.5px;line-height:1.45;}
.aokb-app .trust4 .titem b{display:block;font-size:13px;color:var(--text);margin-bottom:2px;}
.aokb-app .trust4 .titem span{color:var(--muted);}
.aokb-app .trust4 .tick{color:var(--good);font-weight:800;margin-right:5px;}
@media(max-width:560px){.aokb-app .trust4{grid-template-columns:1fr;}}

/* ===== v2.7.1 keep drawing at top & pinned while summary scrolls ===== */
.aokb-app .stage{align-self:flex-start;position:sticky;top:96px;}
.aokb-app #vis{flex:0 0 auto;}
@media(max-width:920px){.aokb-app .stage{position:static;align-self:auto;}}

