﻿*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#f4f2ec;--panel:#fff;--ink:#182321;--muted:#5a706c;
  --line:#dde4dd;--pr:#12312f;--ps:#dcebe7;
  --ac:#b85c38;--as:#f4dfd5;
  --gold:#b8820a;--gs:#fdf3e0;
  --green:#2d7a4f;--grs:#e4f4ec;
  --blue:#1a5498;--bs:#deeaf8;
  font-family:'Noto Sans HK',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --radius-sm:6px;--radius-md:10px;--radius-lg:13px;
  --shadow-sm:0 1px 3px rgba(18,49,47,.07);
  --shadow-md:0 4px 14px rgba(18,49,47,.10);
  --trans:all .18s cubic-bezier(.4,0,.2,1);
}
html,body{height:100%;background:var(--bg);color:var(--ink);overflow:hidden}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{display:flex;flex-direction:column;font-size:19px;overscroll-behavior:none;-webkit-font-smoothing:antialiased}
button,input,select,textarea{touch-action:manipulation}
input,select,textarea{font-size:inherit}

/* TOPBAR — with iPad safe area top inset */
.topbar{display:flex;align-items:center;gap:10px;padding:0 16px;padding-top:env(safe-area-inset-top);height:calc(50px + env(safe-area-inset-top));min-height:calc(50px + env(safe-area-inset-top));background:var(--pr);color:#fff;flex-shrink:0}
.tb-logo{width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.15);display:grid;place-items:center;font-weight:900;font-size:.76rem;flex-shrink:0}
.tb-title{font-size:.82rem;font-weight:800;white-space:nowrap;flex-shrink:0}
.tb-parts{display:flex;gap:4px;flex-shrink:0}
.pt{border:0;border-radius:7px;padding:4px 10px;font:inherit;font-size:.66rem;font-weight:800;cursor:pointer;background:rgba(255,255,255,.12);color:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.18);transition:all .18s;white-space:nowrap}
.pt.on{background:#fff;color:var(--pr);border-color:#fff}
.tb-steps{flex:1;display:flex;justify-content:center;gap:4px;min-width:0}
.sd{width:26px;height:26px;border-radius:50%;border:2px solid rgba(255,255,255,.22);display:grid;place-items:center;font-size:.6rem;font-weight:800;color:rgba(255,255,255,.38);cursor:pointer;transition:all .18s;flex-shrink:0}
.sd.done{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.5);color:#fff}
.sd.active{background:#fff;border-color:#fff;color:var(--pr)}
.tb-btns{display:flex;gap:5px;flex-shrink:0}
.tbtn{border:0;border-radius:8px;padding:5px 12px;font:inherit;font-size:.7rem;font-weight:800;cursor:pointer;white-space:nowrap}
.tbtn-g{background:rgba(255,255,255,.13);color:#fff;border:1px solid rgba(255,255,255,.22)}
.tbtn-w{background:#fff;color:var(--pr)}
.tbtn-new{background:#dcebe7;color:var(--pr);border:1px solid rgba(255,255,255,.36)}
.tbtn-font{background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.35);min-width:46px;padding-left:10px;padding-right:10px}


.prog{height:3px;background:rgba(18,49,47,.12);flex-shrink:0}
.prog-f{height:100%;background:var(--green);transition:width .3s}

/* MAIN WRAPPER — always flex row */
.main{flex:1;display:flex;overflow:hidden;min-height:0}

/* LEFT content area */
.lcol{flex:1;overflow-y:auto;padding:14px 10px 40px 16px;display:flex;flex-direction:column;gap:10px;min-width:0;position:relative;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scroll-padding-bottom:36px}
.lcol::-webkit-scrollbar{width:3px}
.lcol::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}

/* RIGHT pencil column — always present */
.rcol{width:140px;flex-shrink:0;border-left:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;overflow:hidden}
.fw-col{flex:1;display:flex;flex-direction:column;padding:10px;overflow:hidden}
.fw-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;flex-shrink:0}
.fw-lbl{font-size:.6rem;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.fw-clear{border:1px solid var(--line);border-radius:6px;padding:3px 9px;background:transparent;color:var(--muted);font:inherit;font-size:.64rem;cursor:pointer;min-height:28px}
.fw-tool-btn{padding:3px 6px;font-size:.62rem}
.fw-tool-on{background:var(--ps);border-color:var(--pr);color:var(--pr);font-weight:800}
.fw-svg{flex:1;width:100%;border-radius:10px;background-color:#fafcf8;background-image:repeating-linear-gradient(0deg,transparent 0 23px,rgba(18,49,47,.05) 24px);cursor:crosshair;touch-action:none;display:block;border:1px solid var(--line);user-select:none;-webkit-user-select:none}
/* Pyramid overlay canvas */
#pyr-canvas-wrap{position:fixed;top:44px;left:0;right:220px;bottom:0;z-index:100;pointer-events:none;display:none}
#pyr-canvas-wrap.active{pointer-events:none;display:block}
#pyr-canvas-wrap.drawing{pointer-events:all}
#pyr-overlay{position:absolute;inset:0;cursor:crosshair;touch-action:none;width:100%;height:100%}
#pyr-toolbar{position:absolute;right:14px;bottom:14px;display:flex;gap:5px;z-index:200;background:rgba(255,255,255,.96);border-radius:10px;padding:5px 8px;box-shadow:0 2px 12px rgba(0,0,0,.18);pointer-events:all;backdrop-filter:blur(8px);cursor:grab;touch-action:none}
#pyr-toolbar.dragging{cursor:grabbing;box-shadow:0 8px 24px rgba(0,0,0,.24)}
#pyr-toolbar::before{content:'↕';display:grid;place-items:center;width:20px;color:#8a948f;font-size:.72rem;font-weight:900}
#pyr-toolbar button,#pyr-toolbar select{cursor:pointer}

/* SLIDES */
.slide{display:none;flex-direction:column;gap:10px;flex:1}
.slide.on{display:flex}

/* SHARED CARDS */
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:13px}
.kicker{font-size:.58rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:3px}
.headline{font-size:1.05rem;font-weight:900;line-height:1.2;margin-bottom:4px}
.sub{font-size:.78rem;color:var(--muted);line-height:1.5}
.sub b{color:var(--ink);font-weight:800}

/* CALC */
.calc-card{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px}
.inp-row{display:flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:7px;padding:6px 9px}
.inp-row label{font-size:.68rem;font-weight:800;color:var(--muted);white-space:nowrap}
.inp-row input{border:none;outline:none;font:inherit;font-size:.88rem;font-weight:800;color:var(--ink);flex:1;background:transparent;min-width:0}
.res-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:6px}
.rc{border-radius:7px;padding:8px;text-align:center}
.rc-l{font-size:.58rem;font-weight:800;margin-bottom:2px}
.rc-v{font-size:.92rem;font-weight:900}
.rc-green{background:var(--grs)}.rc-green .rc-l,.rc-green .rc-v{color:var(--green)}
.rc-pr{background:var(--ps)}.rc-pr .rc-l,.rc-pr .rc-v{color:var(--pr)}
.rc-ac{background:var(--as)}.rc-ac .rc-l,.rc-ac .rc-v{color:var(--ac)}
.rc-blue{background:var(--bs)}.rc-blue .rc-l,.rc-blue .rc-v{color:var(--blue)}

/* PYRAMID */
.pyr-wrap{display:flex;gap:10px;flex:1;min-height:300px;align-items:stretch}
.pyr-axis{display:flex;flex-direction:column;align-items:center;width:36px;flex-shrink:0;padding:2px 0}
.ax-top{font-size:.55rem;font-weight:800;color:var(--ac);text-align:center;line-height:1.3;margin-bottom:3px}
.ax-bot{font-size:.55rem;font-weight:800;color:var(--green);text-align:center;line-height:1.3;margin-top:3px}
.ax-arr{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:7px solid var(--ac)}
.ax-line{flex:1;width:3px;background:linear-gradient(to bottom,var(--ac),var(--gold),var(--green));border-radius:999px;margin:2px 0}
.pyr-layers{flex:1;display:flex;flex-direction:column;gap:6px;justify-content:flex-end;min-height:0}
.layer{border-radius:9px;overflow:visible;cursor:pointer;transition:all .16s;border:2px solid transparent;box-shadow:0 2px 6px rgba(18,49,47,.05);min-height:42px;flex:0 0 auto}
.layer:hover{transform:translateY(-1px)}
.layer.on{border-color:var(--pr);box-shadow:0 4px 14px rgba(18,49,47,.1)}
.lr{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:7px;align-items:center;padding:8px 10px;min-height:42px}
.lnum{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:.8rem;flex-shrink:0}
.lname{font-size:.78rem;font-weight:800;line-height:1.28;white-space:normal;overflow:visible;word-break:keep-all;display:block;min-width:0}
.ltag{border-radius:999px;padding:3px 7px;font-size:.58rem;font-weight:800;white-space:nowrap;flex-shrink:0;line-height:1.15;max-width:96px;overflow:hidden;text-overflow:ellipsis}
.l1{background:#e8f7ef}.l1 .lnum{background:#2d7a4f;color:#fff}.l1 .lname{color:#1c5435}.l1 .ltag{background:#2d7a4f;color:#fff}
.l2{background:#ecf8f2}.l2 .lnum{background:#3a9960;color:#fff}.l2 .lname{color:#256040}.l2 .ltag{background:#3a9960;color:#fff}
.l3{background:#f0faf5}.l3 .lnum{background:#52b07a;color:#fff}.l3 .lname{color:#2d6b44}.l3 .ltag{background:#52b07a;color:#fff}
.l4{background:#e8f1fc}.l4 .lnum{background:#1a5498;color:#fff}.l4 .lname{color:#133d70}.l4 .ltag{background:#1a5498;color:#fff}
.l5{background:#ecf2fd}.l5 .lnum{background:#2562b0;color:#fff}.l5 .lname{color:#1a4480}.l5 .ltag{background:#2562b0;color:#fff}
.l6{background:#eef4fe}.l6 .lnum{background:#3070b8;color:#fff}.l6 .lname{color:#1e4a90}.l6 .ltag{background:#3070b8;color:#fff}
.l7{background:#fef9ec}.l7 .lnum{background:#b8820a;color:#fff}.l7 .lname{color:#7a5608}.l7 .ltag{background:#b8820a;color:#fff}
.l8{background:#fef1ec}.l8 .lnum{background:#b85c38;color:#fff}.l8 .lname{color:#8a3e20}.l8 .ltag{background:#b85c38;color:#fff}
/* iPad guard: selected pyramid layers must never clip or collapse text */
.layer.on,
.layer.on .lr,
.layer.on .lname,
.layer.on .ltag{overflow:visible}
.layer.on .lr{min-height:56px}
.layer.on .lname{display:block;white-space:normal;line-height:1.32}
@media(min-width:700px){
  .pyr-wrap{min-height:420px;flex:0 0 auto}
  .pyr-layers{gap:7px}
  .layer{flex:0 0 auto}
  .layer.on .lr{min-height:60px}
}

/* CROSS */
.cross-wrap{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px;flex:1;min-height:280px}
.quad{border-radius:11px;padding:12px;cursor:pointer;transition:all .18s;border:2px solid transparent;display:flex;flex-direction:column;gap:4px}
.quad:hover{transform:scale(1.01)}
.quad.on{border-color:var(--pr);box-shadow:0 3px 14px rgba(18,49,47,.11)}
.qi{font-size:1.4rem}.qn{font-size:.86rem;font-weight:800}.qq{font-size:.7rem;line-height:1.4}
.q-life{background:#fff0f3;border-color:#e8bcc8}.q-life .qn{color:#8a1f3e}.q-life .qq{color:#a0556e}
.q-acc{background:#fff8ec;border-color:#f5dca8}.q-acc .qn{color:#7a5608}.q-acc .qq{color:#946a1a}
.q-med{background:#eef6fe;border-color:#b5d4f4}.q-med .qn{color:#133d70}.q-med .qq{color:#1e5488}
.q-ci{background:#edfaf3;border-color:#9fddc0}.q-ci .qn{color:#1c5435}.q-ci .qq{color:#2d6b44}
.cross-ctr{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--pr);color:#fff;border-radius:9px;padding:6px 10px;text-align:center;z-index:5;pointer-events:none;min-width:76px}
.cc-l{font-size:.56rem;font-weight:800;opacity:.72;margin-bottom:1px}
.cc-t{font-size:.7rem;font-weight:800;line-height:1.2}

/* LIFE TABLE */
.life-hdr{display:grid;grid-template-columns:1fr 76px 56px 86px;gap:4px;padding:0 7px;margin-bottom:3px}
.life-hdr span{font-size:.6rem;font-weight:800;color:var(--muted);text-align:right}
.life-hdr span:first-child{text-align:left}
.lrow{display:grid;grid-template-columns:1fr 76px 56px 86px;gap:4px;align-items:center;background:var(--bg);border-radius:7px;padding:5px 7px;margin-bottom:3px}
.lrow label{font-size:.67rem;font-weight:800;color:var(--muted)}
.lrow input{border:1px solid var(--line);border-radius:5px;padding:4px 5px;font:inherit;font-size:.76rem;font-weight:800;color:var(--ink);outline:none;width:100%;text-align:right;background:#fff}
.lrow input:focus{border-color:var(--pr)}
.lsub-v{font-size:.74rem;font-weight:800;color:var(--pr);text-align:right}
.life-total{background:var(--pr);color:#fff;border-radius:7px;padding:7px 10px;display:flex;justify-content:space-between;align-items:center;margin-top:5px}

/* MED CHART */
.med-bars{display:flex;gap:8px;align-items:flex-end;height:90px;margin-bottom:6px}
.med-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;height:100%}
.med-bar{width:100%;border-radius:4px 4px 0 0;display:flex;align-items:flex-start;justify-content:center;padding-top:3px;font-size:.55rem;font-weight:800;color:#fff}
.med-lbl{font-size:.58rem;font-weight:800;text-align:center;color:var(--muted);line-height:1.3}

/* CI TIMELINE */
.ci-bar{background:var(--bg);border-radius:8px;padding:8px 10px;margin-bottom:5px}
.ci-ar{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.ci-age{font-size:.64rem;font-weight:800;color:var(--muted);width:28px;flex-shrink:0}
.ci-track{flex:1;height:5px;background:#e0e8e4;border-radius:999px}
.ci-fill{height:100%;border-radius:999px}
.ci-evt{font-size:.68rem;color:var(--muted);line-height:1.4}
.ci-qa{background:var(--ps);border-radius:6px;padding:6px 9px;margin-top:4px}
.ci-q{font-size:.68rem;font-weight:800;color:var(--pr);margin-bottom:2px}
.ci-a{font-size:.7rem;color:var(--pr);line-height:1.45}

/* SUMMARY */
.sum-wrap{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.sum-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sum-sec{background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:13px}
.sum-sec h3{font-size:.78rem;font-weight:800;color:var(--pr);margin-bottom:8px}
.sf{display:flex;flex-direction:column;gap:3px;margin-bottom:7px}
.sf:last-child{margin-bottom:0}
.sf label{font-size:.62rem;font-weight:800;color:var(--muted)}
.sf input,.sf select,.sf textarea{border:1px solid var(--line);border-radius:6px;padding:6px 8px;background:var(--bg);font:inherit;font-size:.78rem;color:var(--ink);outline:none;width:100%}
.sf input:focus,.sf select:focus,.sf textarea:focus{border-color:var(--pr)}
.sf textarea{resize:none;line-height:1.5}
.data-chip{background:var(--bg);border-radius:7px;padding:7px 9px}
.dc-l{font-size:.58rem;font-weight:800;color:var(--muted);margin-bottom:2px}
.dc-v{font-size:.84rem;font-weight:800;color:var(--pr)}
.out-box{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px;background:#040d0b;color:#e4eeec;font:inherit;font-size:.73rem;line-height:1.7;resize:vertical;outline:none;min-height:150px}
.abtn{border:0;border-radius:8px;padding:7px 14px;font:inherit;font-size:.74rem;font-weight:800;cursor:pointer}
.abtn-pr{background:var(--pr);color:#fff}
.abtn-gr{background:var(--green);color:#fff}
.abtn-ghost{background:var(--bg);border:1px solid var(--line);color:var(--muted)}
.cst{font-size:.68rem;font-weight:800;color:var(--green)}

/* WELCOME */
.w-hero{background:linear-gradient(135deg,var(--pr) 0%,#1c4a46 100%);border-radius:13px;padding:20px 24px;color:#fff;flex:1;display:flex;flex-direction:column;justify-content:center;gap:10px}
.w-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:2px}
.ws{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:8px 4px;text-align:center}
.ws.wa{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.5)}
.ws-i{font-size:1rem;margin-bottom:2px}
.ws-l{font-size:.58rem;opacity:.8;line-height:1.3;font-weight:700}

/* MED SCENE BUTTONS */
.msb{border:1.5px solid var(--line);border-radius:7px;padding:4px 8px;font:inherit;font-size:.62rem;font-weight:800;cursor:pointer;background:#fff;color:var(--ink);white-space:nowrap;transition:var(--trans)}
.msb:hover{border-color:var(--blue);color:var(--blue);background:var(--bs)}
.msb-on{background:var(--blue);color:#fff;border-color:var(--blue)}

.mpf-contrib-split{display:flex;gap:6px;flex-wrap:wrap;margin-top:5px}
.mpf-contrib-split span{background:#fff;border:1px solid rgba(45,122,79,.18);border-radius:999px;padding:3px 8px;font-size:.58rem;font-weight:800;color:var(--muted)}
.mpf-contrib-split b{color:var(--green);font-weight:900}
.mpf-manual-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:6px}
.mpf-quick-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:2px 0 7px}
.mpf-quick-row button{border:1.5px solid var(--green);background:#fff;color:var(--green);border-radius:999px;padding:5px 10px;font:inherit;font-size:.6rem;font-weight:900;cursor:pointer}
.mpf-quick-row button:hover{background:var(--grs)}
.mpf-quick-row span{font-size:.58rem;color:var(--muted);line-height:1.45;font-weight:700}
.mpf-history-box{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#fff;border:1px solid rgba(18,49,47,.12);border-left:4px solid var(--pr);border-radius:0 9px 9px 0;padding:8px 10px;margin:0 0 6px}
.mpf-history-box span{display:block;font-size:.58rem;font-weight:900;color:var(--muted);margin-bottom:2px}
.mpf-history-box b{font-size:.92rem;font-weight:900;color:var(--pr)}
.mpf-history-box button{border:1.5px solid var(--pr);background:var(--ps);color:var(--pr);border-radius:999px;padding:5px 10px;font:inherit;font-size:.58rem;font-weight:900;cursor:pointer;white-space:nowrap}
@media(max-width:767px){.mpf-history-box{align-items:flex-start;flex-direction:column}.mpf-history-box button{width:100%}}
.mpf-shot-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px}
.mpf-shot-actions button{border:0;background:var(--pr);color:#fff;border-radius:999px;padding:8px 14px;font:inherit;font-size:.66rem;font-weight:900;cursor:pointer;box-shadow:0 2px 8px rgba(18,49,47,.16)}
.mpf-shot-actions span{font-size:.6rem;color:var(--muted);font-weight:800;line-height:1.45}
.mpf-client-shot{margin-top:10px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:0 8px 28px rgba(18,49,47,.12)}
.mpf-shot-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.mpf-shot-kicker{font-size:.56rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:900;margin-bottom:3px}
.mpf-shot-title{font-size:1.15rem;font-weight:900;color:var(--pr);line-height:1.18}
.mpf-shot-date{font-size:.64rem;color:var(--muted);font-weight:800;margin-top:4px}
.mpf-shot-head-actions{display:flex;gap:6px;flex-shrink:0}
.mpf-shot-head-actions button{border:1.5px solid var(--line);background:#fff;color:var(--pr);border-radius:999px;padding:6px 10px;font:inherit;font-size:.6rem;font-weight:900;cursor:pointer}
.mpf-shot-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:10px}
.mpf-shot-facts div{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 10px}
.mpf-shot-facts span,.mpf-shot-card span{display:block;font-size:.58rem;color:var(--muted);font-weight:900;margin-bottom:4px}
.mpf-shot-facts b{font-size:.86rem;color:var(--ink);font-weight:900}
.mpf-shot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.mpf-shot-card{border-radius:12px;padding:12px 10px;min-height:104px;border:1px solid transparent;display:flex;flex-direction:column;justify-content:space-between}
.mpf-shot-card b{font-size:1.05rem;font-weight:900;line-height:1.15}
.mpf-shot-card small{font-size:.55rem;line-height:1.35;font-weight:800;opacity:.75;margin-top:8px}
.mpf-shot-card.green{background:var(--grs);border-color:rgba(45,122,79,.18);color:var(--green)}
.mpf-shot-card.blue{background:var(--bs);border-color:rgba(26,84,152,.18);color:var(--blue)}
.mpf-shot-card.amber{background:var(--as);border-color:rgba(184,92,56,.18);color:var(--ac)}
.mpf-shot-card.dark{background:var(--ps);border-color:rgba(18,49,47,.18);color:var(--pr)}
.mpf-shot-note{margin-top:10px;border-left:4px solid var(--gold);background:#fffdf6;border-radius:0 9px 9px 0;padding:8px 10px;font-size:.58rem;line-height:1.55;color:#6b4b1f;font-weight:800}
body.client-shot-mode .rcol{display:none!important}
body.client-shot-mode .lcol{padding-right:22px}
@media(max-width:900px){.mpf-shot-grid,.mpf-shot-facts{grid-template-columns:1fr 1fr}.mpf-shot-head{flex-direction:column}.mpf-shot-head-actions{width:100%}.mpf-shot-head-actions button{flex:1}.mpf-shot-card{min-height:92px}}
@media print{
  body.mpf-printing .topbar,body.mpf-printing .prog,body.mpf-printing .rcol,body.mpf-printing .mpf-shot-actions,body.mpf-printing .mpf-shot-head-actions{display:none!important}
  body.mpf-printing html,body.mpf-printing body{overflow:visible!important}
  body.mpf-printing .main,body.mpf-printing .lcol{display:block!important;overflow:visible!important;padding:0!important}
  body.mpf-printing .lcol>*:not(.calc-card){display:none!important}
  body.mpf-printing .calc-card>*:not(.mpf-client-shot){display:none!important}
  body.mpf-printing .mpf-client-shot{display:block!important;box-shadow:none;border:0;margin:0;padding:18px}
}

.assump-box{background:#fffdf6;border:1px solid #ead7a6;border-left:4px solid var(--gold);border-radius:0 10px 10px 0;padding:9px 12px;font-size:.64rem;color:#6b4b1f;line-height:1.55}
.assump-box b{color:#7a5608}
.assump-title{font-size:.62rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px;color:#7a5608}
.assump-list{display:flex;gap:6px;flex-wrap:wrap}
.assump-list span{background:#fff;border:1px solid rgba(184,130,10,.22);border-radius:999px;padding:3px 8px;font-weight:800}

/* TOOLKIT */
.kit-hero{background:linear-gradient(135deg,#12312f,#1a5c4a);border-radius:13px;padding:18px 20px;color:#fff}
.kit-hero-fund{background:linear-gradient(135deg,#1a3d52,#6b4b1f)}
.kit-hero-retire{background:linear-gradient(135deg,#17335f,#2d7a4f)}
.kit-hero-compare{background:linear-gradient(135deg,#12312f,#8a3e20)}
.kit-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kit-card{border:1px solid var(--line);border-radius:12px;padding:15px;text-align:left;background:#fff;font:inherit;cursor:pointer;display:flex;flex-direction:column;gap:8px;min-height:190px;transition:var(--trans);box-shadow:var(--shadow-sm)}
.kit-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.kit-fund{border-top:5px solid var(--blue)}
.kit-retire{border-top:5px solid var(--green)}
.kit-compare{border-top:5px solid var(--ac)}
.kit-tag{font-size:.58rem;font-weight:900;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.kit-title{font-size:.92rem;font-weight:900;color:var(--ink);line-height:1.22}
.kit-copy{font-size:.68rem;color:var(--muted);line-height:1.55;flex:1}
.kit-cta{font-size:.66rem;font-weight:900;color:var(--pr)}
.kit-note{background:var(--ps);border-left:4px solid var(--pr);border-radius:0 10px 10px 0;padding:10px 12px;font-size:.68rem;color:var(--pr);line-height:1.55}
.kit-section{background:#fff;border:1px solid var(--line);border-radius:11px;padding:13px 15px}
.kit-section h3{font-size:.78rem;font-weight:900;color:var(--pr);margin-bottom:8px}
.kit-list{display:flex;flex-direction:column;gap:6px}
.kit-list div{font-size:.68rem;color:var(--ink);line-height:1.5;padding-left:14px;position:relative}
.kit-list div::before{content:'';position:absolute;left:0;top:.58em;width:6px;height:6px;border-radius:50%;background:var(--green)}
.kit-script{background:var(--bg);border-left:4px solid var(--green);border-radius:0 8px 8px 0;padding:10px 12px;font-size:.76rem;font-weight:700;color:var(--ink);line-height:1.65}
.kit-pill-row{display:flex;gap:6px;flex-wrap:wrap}
.kit-pill-row span{background:var(--bs);color:var(--blue);border-radius:999px;padding:5px 10px;font-size:.62rem;font-weight:900}
.kit-warn{background:#fff8f8;border-color:#f3c7c7}
.kit-warn h3{color:#9f1239}
.kit-warn .kit-list div::before{background:#dc2626}
.kit-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.kit-flow div{background:var(--bg);border-radius:9px;padding:10px;display:flex;gap:8px;align-items:flex-start}
.kit-flow b{width:24px;height:24px;border-radius:50%;background:var(--pr);color:#fff;display:grid;place-items:center;font-size:.66rem;flex-shrink:0}
.kit-flow span{font-size:.66rem;color:var(--ink);line-height:1.45;font-weight:700}
.kit-compare-table{display:grid;grid-template-columns:.78fr 1.16fr 1.06fr;border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:.62rem}
.kit-compare-table div{padding:8px 10px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);line-height:1.45;background:#fff}
.kit-compare-table div:nth-child(3n){border-right:0}
.kit-compare-table div:nth-last-child(-n+3){border-bottom:0}
.kit-compare-table .kit-th{background:var(--pr);color:#fff;font-weight:900;text-align:center}

/* SLIDE FADE-IN */
@keyframes fadeSlide{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.lcol>*{animation:fadeSlide .22s ease both}
.lcol>*:nth-child(2){animation-delay:.04s}
.lcol>*:nth-child(3){animation-delay:.08s}
.lcol>*:nth-child(4){animation-delay:.12s}
.lcol>*:nth-child(5){animation-delay:.16s}

/* BUTTON POLISH */
.pt{transition:var(--trans)}
.pt:hover:not(.on){background:rgba(255,255,255,.2);color:rgba(255,255,255,.85)}
.tbtn{transition:var(--trans)}
.tbtn-w:hover{background:rgba(255,255,255,.9);transform:scale(1.02)}
.tbtn-g:hover{background:rgba(255,255,255,.22)}
.tbtn-new:hover{background:#fff;transform:translateY(-1px)}
.abtn{transition:var(--trans)}
.abtn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.abtn:active{transform:translateY(0)}
.abtn-audit{background:#fff7ed;color:#9a3412;border:1.5px solid #fed7aa}
.abtn-audit:hover{background:#ffedd5}

/* CARD HOVER */
.card{transition:var(--trans);box-shadow:var(--shadow-sm)}
.layer:hover{box-shadow:var(--shadow-md)}
.quad:hover{box-shadow:var(--shadow-md)}

/* INPUT FOCUS */
.inp-row input:focus{outline:none;border-color:var(--pr) !important}
.inp-row:focus-within{border-color:var(--pr);box-shadow:0 0 0 2px var(--ps)}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield}

/* SCROLLBAR GLOBAL */
*::-webkit-scrollbar{width:4px;height:4px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
*::-webkit-scrollbar-thumb:hover{background:var(--muted)}

/* TOUCH TARGETS */
@media(pointer:coarse){
  .tbtn{padding:7px 14px}
  .pt{padding:6px 12px}
  .sd{width:30px;height:30px}
  .msb{padding:6px 10px}
}

/* ── iPAD / LARGE TABLET — bigger text for client-facing use ── */
@media(min-width:768px){
  /* Base font: 19px → 32px on iPad — all rem values scale up automatically */
  body{font-size:34px}

  /* Topbar — iPad PWA friendly: no clipped words, larger touch targets */
  .topbar{padding-left:18px;padding-right:18px;gap:8px 10px;min-height:0;height:auto;padding-top:calc(8px + env(safe-area-inset-top));padding-bottom:8px;flex-wrap:wrap;align-items:center;overflow:visible}
  .tb-logo{width:38px;height:38px;font-size:.95rem;order:1}
  .tb-title{font-size:.92rem;font-weight:900;order:2;max-width:24vw;overflow:hidden;text-overflow:ellipsis}
  .tb-btns{order:3;margin-left:auto;gap:5px;flex-wrap:nowrap}
  .tb-parts{order:4;flex:1 1 100%;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px;scroll-snap-type:x proximity}
  .tb-parts::-webkit-scrollbar{display:none}
  .pt{padding:10px 15px;font-size:.76rem;border-radius:10px;min-height:48px;scroll-snap-align:start}
  .tb-steps{order:5;flex:1 1 100%;justify-content:center;gap:6px;min-height:34px}
  .sd{width:34px;height:34px;font-size:.68rem}

  /* Main layout — wider right column for Apple Pencil panel */
  .rcol{width:180px}

  /* Left column padding */
  .lcol{padding:22px 18px 22px 26px;gap:16px}

  /* Cards */
  .card{padding:18px 22px;border-radius:16px}
  .headline{font-size:1.2rem !important}
  .kicker{font-size:.7rem !important}

  /* Input rows */
  .inp-row{padding:11px 15px;border-radius:10px}
  .inp-row input{font-size:.95rem}
  .inp-row label{font-size:.78rem}

  /* Calc cards */
  .calc-card{padding:16px 18px;border-radius:14px}

  /* Result grid boxes */
  .rc{padding:14px 10px;border-radius:10px}
  .rc-l{font-size:.68rem !important}
  .rc-v{font-size:1.05rem !important}

  /* Layer / quad buttons */
  .pyr-layers .layer{padding:0;border-radius:12px;min-height:54px;overflow:visible}
    .pyr-layers .lr{grid-template-columns:36px minmax(0,1fr) auto;gap:10px;padding:9px 12px;min-height:54px}
    .pyr-layers .lnum{width:34px;height:34px;font-size:.88rem}
    .pyr-layers .lname{font-size:.76rem;line-height:1.28}
    .pyr-layers .ltag{font-size:.54rem;padding:3px 7px;line-height:1.15}
  .quad{padding:14px}
  .abtn{min-height:54px;font-size:.8rem;border-radius:10px}
  .tbtn{min-height:48px;padding:10px 14px;font-size:.76rem;border-radius:10px}

  /* Data chips */
  .data-chip{padding:10px 14px;border-radius:10px}
  .dc-l{font-size:.64rem}
  .dc-v{font-size:.86rem}

  /* Summary output box */
  .out-box{font-size:.78rem;line-height:1.75}

  /* Welcome steps */
  .ws{padding:12px 6px}
  .ws-i{font-size:1.3rem}
  .ws-l{font-size:.66rem}

  /* Part tab buttons */
  .tb-parts{gap:5px}
}


/* PROGRESS BAR GLOW */
.prog-f{box-shadow:0 0 6px rgba(45,122,79,.4)}

/* TOPBAR LOGO */
.tb-logo{letter-spacing:.02em;font-size:.8rem}

/* STEP DOTS PULSE on active */
.sd.active{box-shadow:0 0 0 3px rgba(255,255,255,.25)}

/* TEXTAREA */
textarea:focus{outline:none;border-color:var(--pr) !important;box-shadow:0 0 0 2px var(--ps)}

/* OUT BOX */
.out-box:focus{outline:none;border-color:var(--green)}

/* DATA CHIPS */
.data-chip{transition:var(--trans)}
.data-chip:hover{background:var(--ps)}
/* PREF BUTTONS — horizontal scroll row */
.pref-scroll{display:flex;gap:9px;overflow-x:auto;padding:2px 0 8px;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}
.pref-scroll::-webkit-scrollbar{height:3px}
.pref-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.pref-btn{border:2px solid var(--line);border-radius:13px;padding:14px 13px 12px;background:var(--panel);font:inherit;cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:5px;position:relative;transition:all .15s;-webkit-tap-highlight-color:transparent;flex-shrink:0;width:140px;scroll-snap-align:start;box-shadow:0 1px 4px rgba(18,49,47,.06)}
.pref-btn.on{border-color:var(--pr);background:var(--ps);box-shadow:0 2px 8px rgba(45,122,79,.15)}
.pref-btn .pi{font-size:1.6rem;line-height:1;margin-bottom:3px}
.pref-btn .pref-title{font-size:.8rem;font-weight:900;color:var(--ink);line-height:1.2}
.pref-btn.on .pref-title{color:var(--pr)}
.pref-btn .pd{font-size:.62rem;color:var(--muted);line-height:1.35}
.pref-btn.on .pd{color:#1c5435}
.pref-ck{position:absolute;top:8px;right:9px;width:20px;height:20px;border-radius:50%;background:var(--pr);display:none;align-items:center;justify-content:center;font-size:.65rem;color:#fff;font-weight:900}
.pref-btn.on .pref-ck{display:flex}
/* Hero band slide 0 */
.w-hero-band{background:linear-gradient(145deg,#0a201c 0%,#12312f 45%,#1a5c4a 100%);border-radius:14px;padding:22px 20px 18px;color:#fff;position:relative}
.w-hero-band .eyebrow{display:inline-flex;align-items:center;gap:5px;background:rgba(110,231,196,.18);border:1px solid rgba(110,231,196,.35);border-radius:999px;padding:4px 13px;font-size:.68rem;font-weight:800;letter-spacing:.05em;margin-bottom:12px;color:#6ee7c4}
.w-hero-band h2{font-size:1.6rem;font-weight:900;line-height:1.18;margin-bottom:9px;color:#fff}
.w-hero-band h2 em{color:#6ee7c4;font-style:normal}
.w-hero-band .sub{font-size:.82rem;color:rgba(255,255,255,.85);line-height:1.65;font-weight:500}
/* Step dots row */
.band-steps{display:flex;gap:4px;margin-top:14px}
.bs{display:flex;align-items:center;gap:5px;flex:1;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:8px;padding:6px 6px}
.bs.a{background:rgba(110,231,196,.2);border-color:rgba(110,231,196,.45)}
.bs-i{font-size:.9rem;line-height:1;flex-shrink:0}
.bs-l{font-size:.52rem;font-weight:800;color:rgba(255,255,255,.6);line-height:1.2}
.bs.a .bs-l{color:#6ee7c4;font-weight:900}
/* Client info block — no card header, just clean inputs */
.client-block{background:var(--panel);border:1.5px solid var(--line);border-radius:13px;padding:16px 18px;display:flex;flex-direction:column;gap:14px}
.ci-field{display:flex;flex-direction:column;gap:5px}
.ci-label{font-size:.62rem;font-weight:900;color:var(--muted);text-transform:uppercase;letter-spacing:.07em}
.pref-name-input{width:100%;border:0;border-bottom:2.5px solid var(--pr);border-radius:0;padding:7px 0;font:inherit;font-size:.92rem;font-weight:700;background:transparent;color:var(--ink);outline:none;transition:border-color .15s}
.pref-name-input:focus{border-color:var(--green)}
.pref-name-input::placeholder{color:var(--muted);font-weight:400;font-size:.82rem}
/* Pref section */
.pref-section{display:flex;flex-direction:column;gap:6px}
.pref-section-label{font-size:.78rem;font-weight:900;color:var(--ink)}
.pref-hint{font-size:.62rem;color:var(--muted);display:flex;align-items:center;gap:4px}

/* ══ Part 5 方案比較 · 視覺升級 ══ */
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes barGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes heroFloat{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(20px,-12px) scale(1.12)}}
@keyframes starPop{0%{transform:scale(1)}45%{transform:scale(1.18)}100%{transform:scale(1)}}
.fade-up{animation:fadeUp .55s cubic-bezier(.2,.8,.2,1) both}

/* Hero 開場 */
.cmp-hero{position:relative;overflow:hidden;border-radius:18px;padding:20px 22px;background:linear-gradient(130deg,#0d2826 0%,#12312f 45%,#1d4a40 100%);color:#fff;box-shadow:var(--shadow-md)}
.cmp-hero-glow{position:absolute;top:-60px;right:-40px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(184,130,10,.45) 0%,rgba(184,130,10,0) 70%);animation:heroFloat 7s ease-in-out infinite;pointer-events:none}
.cmp-hero-title{font-size:1.45rem;font-weight:900;line-height:1.25;letter-spacing:-.01em}
.cmp-hero-money{background:linear-gradient(90deg,#ffd98a,#f6b73c);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:1.7rem}

/* 市場數據條 */
.cmp-stat-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.cmp-stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:11px 9px;text-align:center;box-shadow:var(--shadow-sm)}
.cmp-stat-n{font-size:1.3rem;font-weight:900;letter-spacing:-.02em}
.cmp-stat-l{font-size:.74rem;font-weight:700;color:var(--muted);line-height:1.45;margin-top:2px}

/* 方案卡 */
.cmp-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px 14px 12px;overflow:hidden;box-shadow:var(--shadow-sm);transition:var(--trans)}
.cmp-card:active{transform:scale(.985)}
.cmp-card-top{position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--pc),transparent 160%)}
.cmp-badge{position:absolute;top:11px;right:11px;background:var(--pcs);color:var(--pc);font-size:.76rem;font-weight:900;border-radius:999px;padding:4px 10px;border:1.5px solid var(--pc)}
.cmp-big{font-size:1.7rem;font-weight:900;letter-spacing:-.03em;line-height:1}
.cmp-big-unit{font-size:.88rem;font-weight:800;margin-left:2px;opacity:.75}
.cmp-fit{font-size:.78rem;font-weight:700;background:var(--bg);border-radius:8px;padding:6px 9px;line-height:1.5;margin-bottom:8px}
.cmp-star{width:100%;border:1.5px solid var(--line);background:#fff;color:var(--muted);border-radius:9px;padding:7px;font:inherit;font-size:.78rem;font-weight:900;cursor:pointer;transition:var(--trans)}
.cmp-star.on{border-color:var(--pc);background:var(--pcs);color:var(--pc);animation:starPop .35s ease}

/* 圖表控制 */
.cmp-chip{border:1.5px solid var(--pc);border-radius:999px;padding:5px 12px;font:inherit;font-size:.78rem;font-weight:900;cursor:pointer;transition:var(--trans);background:#fff;color:var(--pc);opacity:.5}
.cmp-chip[data-on="true"]{background:var(--pc);color:#fff;opacity:1;box-shadow:var(--shadow-sm)}
.cmp-seg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.cmp-seg button{border:none;background:#fff;color:var(--muted);padding:4px 12px;font:inherit;font-size:.78rem;font-weight:900;cursor:pointer;display:flex;flex-direction:column;align-items:center;line-height:1.3}
.cmp-seg button span{font-size:.68rem;font-weight:700;opacity:.75}
.cmp-seg button[data-on="true"]{background:var(--pr);color:#fff}

/* Slider */
.cmp-slider-row{display:flex;align-items:center;gap:12px;margin-top:8px;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:9px 14px}
.cmp-slider-lbl{font-size:.78rem;font-weight:900;color:var(--ac);white-space:nowrap}
.cmp-slider-row input[type=range]{flex:1;accent-color:var(--ac);height:26px}
.cmp-slider-age{font-size:1.35rem;font-weight:900;color:var(--pr);min-width:64px;text-align:right;letter-spacing:-.02em}
.cmp-slider-age small{font-size:.78rem;font-weight:800;margin-left:1px}

/* 數值 chip */
.cmp-val-chip{background:var(--pcs);border-radius:12px;padding:9px 11px;border-left:4px solid var(--pc)}
.cvc-name{font-size:.74rem;font-weight:900;color:var(--pc)}
.cvc-num{font-size:.96rem;font-weight:900;letter-spacing:-.01em;margin:1px 0}
.cvc-sub{font-size:.72rem;font-weight:700;color:var(--muted)}

/* 對比擂台 */
.cmp-age-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.cmp-age{border:1.5px solid var(--line);background:#fff;color:var(--muted);border-radius:12px;padding:6px 12px;font:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:center;line-height:1.15;transition:var(--trans)}
.cmp-age b{font-size:.96rem;font-weight:900}
.cmp-age span{font-size:.70rem;font-weight:800}
.cmp-age small{font-size:.66rem;opacity:.7}
.cmp-age.on{border-color:var(--ac);background:var(--ac);color:#fff;transform:scale(1.08);box-shadow:var(--shadow-md)}
.cmp-row{background:var(--pcs);border-radius:14px;padding:11px 13px;border-left:5px solid var(--pc)}
.bar-track{height:20px;background:rgba(255,255,255,.85);border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex}
.bar-fill{height:100%;animation:barGrow .9s cubic-bezier(.2,.8,.2,1) both;transform-origin:left;border-radius:0}
.cmp-q{margin-top:12px;background:var(--ps);border-left:5px solid var(--pr);border-radius:12px;padding:11px 14px;font-size:.86rem;line-height:1.6}

@media(max-width:767px){
  input,select,textarea{font-size:16px!important}
  html,body{width:100%;max-width:100%;overflow:hidden}
  .topbar{gap:5px;padding-left:8px;padding-right:8px;overflow:hidden}
  .tb-title{display:none}
  .tb-logo{width:28px;height:28px}
  .tb-parts{overflow-x:auto;max-width:42vw;-webkit-overflow-scrolling:touch}
  .tb-parts .pt{padding:6px 10px;font-size:.64rem}
  .tb-steps{display:none}
  .tb-btns{gap:4px}
  .tbtn{padding:6px 9px;font-size:.64rem;min-height:34px}
  .tbtn-new{max-width:38px;overflow:hidden;text-indent:-999px;position:relative}
  .tbtn-new::after{content:'＋';position:absolute;inset:0;display:grid;place-items:center;text-indent:0;font-size:.9rem}
  .main{width:100%;max-width:100%;overflow:hidden}
  .rcol{display:none!important}
  #pyr-canvas-wrap{right:0}
  .lcol{padding:14px 8px 34px;max-width:100%;overflow-x:hidden}
  .fw-col{padding:7px}
  .fw-top{align-items:flex-start;gap:4px;flex-direction:column}
  .fw-lbl{font-size:.56rem}
  .fw-clear{padding:4px 7px}
  .sum-grid{grid-template-columns:1fr}
  .kit-grid{grid-template-columns:1fr}
  .kit-flow{grid-template-columns:1fr}
  .mpf-manual-grid{grid-template-columns:1fr}
  .kit-compare-table{grid-template-columns:1fr}
  .kit-compare-table div,.kit-compare-table div:nth-child(3n),.kit-compare-table div:nth-last-child(-n+3){border-right:0;border-bottom:1px solid var(--line)}
  .kit-compare-table div:last-child{border-bottom:0}
  .pref-btn{width:132px}
  .w-hero-band h2{font-size:1.32rem}
  .band-steps{overflow-x:auto;padding-bottom:2px}
  .bs{min-width:72px}
}


/* iPad portrait / compact PWA width: avoid falling into tiny phone UI */
@media(min-width:700px) and (max-width:767px){
  body{font-size:28px}
  .topbar{gap:8px 10px;padding-left:14px;padding-right:14px;overflow:visible;flex-wrap:wrap;height:auto;min-height:0;padding-top:calc(8px + env(safe-area-inset-top));padding-bottom:8px}
  .tb-logo{width:36px;height:36px;font-size:.9rem;order:1}
  .tb-title{display:block;font-size:.88rem;font-weight:900;order:2;max-width:28vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tb-btns{order:3;margin-left:auto;gap:5px;flex-wrap:nowrap}
  .tb-parts{order:4;flex:1 1 100%;max-width:100%;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px}
  .tb-parts::-webkit-scrollbar{display:none}
  .tb-parts .pt{padding:9px 14px;font-size:.76rem;min-height:46px;border-radius:10px}
  .tb-steps{display:flex;order:5;flex:1 1 100%;justify-content:center;gap:6px;min-height:32px}
  .sd{width:32px;height:32px;font-size:.66rem}
  .tb-btns .tbtn{padding:9px 14px;font-size:.76rem;min-height:46px;border-radius:10px}
  .tbtn-new{max-width:none;text-indent:0;overflow:visible}
  .tbtn-new::after{content:none}
  .lcol{padding:18px 14px 38px;gap:14px}
    .pyr-layers .layer{overflow:visible;min-height:50px}
    .pyr-layers .lr{grid-template-columns:34px minmax(0,1fr) auto;gap:9px;padding:8px 11px;min-height:50px}
    .pyr-layers .lname{font-size:.76rem;line-height:1.28}
    .pyr-layers .ltag{font-size:.54rem;line-height:1.15}
  .headline{font-size:1.16rem!important}
  .sub{font-size:.82rem}
  .card,.calc-card,.sum-sec{border-radius:14px}
  .inp-row label{font-size:.76rem}
  .inp-row input{font-size:.95rem}
  .abtn{min-height:48px;font-size:.78rem;border-radius:10px}
}@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}








