/* Layout: værktøjslinje øverst · indstillinger og vægmål i venstre kolonne · alle vægge i fælles målestok til højre */
:root{
  --bg:#F2F3F0; --surface:#FFFFFF; --line:#DCDED8; --ink:#1B1E21; --muted:#646A64;
  --wall:#DADCD6; --wall-edge:#B9BCB4; --print-v:#3B4045; --print-h:#22303D; --print-q:#3A3446; --print-alt:#6B7C8E; --pic-label:#F2F3F0;
  --warn:#B0412A; --warn-bg:#FBECE7;
  --mf:#04192C; --mf-soft:#E4EAF0; --wc:#2B4D89; --wc-soft:#E2E8F3; --on-accent:#FFFFFF;
  --f-ui:"Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-num:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --r:8px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#131517; --surface:#1B1E21; --line:#2D3135; --ink:#E6E7E3; --muted:#9A9F98;
  --wall:#5A5E61; --wall-edge:#73777A; --print-v:#1A1C1E; --print-h:#0F1822; --print-q:#1C1822; --print-alt:#4A5866; --pic-label:#B9BEC2;
  --warn:#E98A70; --warn-bg:#3A221C;
  --mf:#9DB6D3; --mf-soft:#18222C; --wc:#8DABE3; --wc-soft:#1E2635; --on-accent:#121416; color-scheme:dark }}
:root[data-theme="dark"]{
  --bg:#131517; --surface:#1B1E21; --line:#2D3135; --ink:#E6E7E3; --muted:#9A9F98;
  --wall:#5A5E61; --wall-edge:#73777A; --print-v:#1A1C1E; --print-h:#0F1822; --print-q:#1C1822; --print-alt:#4A5866; --pic-label:#B9BEC2;
  --warn:#E98A70; --warn-bg:#3A221C;
  --mf:#9DB6D3; --mf-soft:#18222C; --wc:#8DABE3; --wc-soft:#1E2635; --on-accent:#121416; color-scheme:dark }

body{background:var(--bg);color:var(--ink);font-family:var(--f-ui);font-size:14px;line-height:1.45;
  --accent:var(--mf);--accent-soft:var(--mf-soft)}
body[data-company="wecreate"]{--accent:var(--wc);--accent-soft:var(--wc-soft)}
*{box-sizing:border-box}
button,input,select{font:inherit;color:inherit}
.num{font-family:var(--f-num);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}

/* Topbar */
.top{border-bottom:1px solid var(--line);background:var(--surface)}
.top-in{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding-block:12px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px;letter-spacing:-.01em}
.brand-mark{width:22px;height:16px;display:grid;grid-template-columns:2fr 3fr;gap:2px}
.brand-mark i{background:var(--accent);border-radius:1px}
.brand-mark i:first-child{height:16px}.brand-mark i:last-child{height:10px;align-self:end}
.top-proj{display:flex;align-items:center;gap:8px;margin-left:auto;flex-wrap:wrap}
.company-tag{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:4px 8px;border-radius:99px;background:var(--accent-soft);color:var(--accent)}

/* Shell */
.shell{display:grid;grid-template-columns:340px minmax(0,1fr);gap:20px;align-items:start;padding-block:20px 40px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));max-width:1600px;margin:0 auto}
@media (max-width:900px){.shell{grid-template-columns:minmax(0,1fr)}}
.side{display:flex;flex-direction:column;gap:14px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:14px}
.panel h2{margin:0;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label,.lbl{font-size:12.5px;font-weight:600}
.hint{font-size:12px;color:var(--muted)}
.note{font-size:12px;color:var(--accent);background:var(--accent-soft);border-radius:6px;padding:8px 10px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}

input[type=text],input[type=number],input[type=search],select{width:100%;height:36px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:var(--bg)}
input:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
input.bad{border-color:var(--warn);background:var(--warn-bg)}
.unit{position:relative}
.unit input{padding-right:34px}
.unit span{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:12px;color:var(--muted);pointer-events:none}

.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--bg);border:1px solid var(--line);border-radius:7px;padding:3px;gap:3px}
.seg button{border:0;background:transparent;height:30px;border-radius:5px;cursor:pointer;font-weight:500;font-size:13px;color:var(--muted);padding:0 6px;white-space:nowrap}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:0 0 0 1px var(--line)}

.btn{height:34px;padding:0 12px;border:1px solid var(--line);background:var(--surface);border-radius:6px;cursor:pointer;font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.btn:hover{border-color:var(--muted)}
.btn:disabled{opacity:.4;cursor:default}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn.ghost{border-color:transparent;background:transparent}
.btn.small{height:30px;padding:0 10px;font-size:12.5px}
.btn.danger{color:var(--warn)}
.btn.danger:hover{border-color:var(--warn)}
.iconbtn{width:30px;height:30px;border:1px solid transparent;background:transparent;border-radius:6px;cursor:pointer;color:var(--muted);display:grid;place-items:center;flex:none}
.iconbtn:hover{border-color:var(--line);color:var(--ink)}

.stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:6px;background:var(--bg);height:30px}
.stepper button{width:28px;height:28px;border:0;background:transparent;cursor:pointer;font-size:16px;line-height:1;color:var(--ink)}
.stepper button:disabled{opacity:.3;cursor:default}
.stepper output{min-width:26px;text-align:center;font-family:var(--f-num);font-size:13px}
.stepper.big{height:36px}.stepper.big button{height:34px;width:34px}
.stepper.big input{width:52px;height:34px;border:0;background:transparent;text-align:center;padding:0;font-family:var(--f-num)}

/* Formats */
.formats{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:99px;padding:3px 4px 3px 8px;font-size:12px;background:var(--bg)}
.chip .r{color:var(--muted)}
.chip button{border:0;background:transparent;cursor:pointer;color:var(--muted);width:20px;height:20px;border-radius:99px}
.chip button:hover{background:var(--line);color:var(--ink)}
.chip.sugg{border-style:dashed;cursor:pointer;padding:3px 10px;color:var(--muted)}
.chip.sugg:hover{border-color:var(--accent);color:var(--accent)}
.shape{display:inline-block;background:var(--muted);border-radius:1px;flex:none}
.fmt-add{display:grid;grid-template-columns:1fr auto 1fr auto;gap:6px;align-items:center}
.msg{font-size:12px;color:var(--warn)}
.exp-box{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:16px;margin-top:4px}
.exp-box .exp-ok{color:var(--accent)}
.exp-box ul{margin:0;padding-left:18px;font-size:12px;color:var(--muted)}

/* Wall inputs */
.wall-list{display:flex;flex-direction:column;gap:6px}
.wall-head,.wall-row{display:grid;grid-template-columns:30px 1fr 1fr 30px;gap:8px;align-items:center}
.wall-head{font-size:11.5px;color:var(--muted);font-weight:600}
.badge{min-width:28px;height:28px;padding:0 6px;border-radius:6px;display:grid;place-items:center;font-weight:700;background:var(--accent-soft);color:var(--accent);font-size:13px;flex:none}
.badge.solid,.wall-row.hl .badge{background:var(--accent);color:var(--on-accent)}

/* Main */
.main{display:flex;flex-direction:column;gap:14px;min-width:0}
.summary{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);display:grid;grid-template-columns:1.2fr repeat(4,1fr) 1.3fr;overflow:hidden}
.summary a{color:inherit;text-decoration:none}
.summary a:hover .v{text-decoration:underline}
.summary>div{padding:14px 16px;border-left:1px solid var(--line);min-width:0}
.summary>div:first-child{border-left:0}
.summary .k{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.summary .v{font-family:var(--f-num);font-size:20px;font-weight:500;margin-top:2px;white-space:nowrap}
.summary .hero .v{font-size:30px;line-height:1.15;color:var(--accent)}
.summary .hero .s{font-size:12.5px;color:var(--muted)}
@media (max-width:700px){.summary{grid-template-columns:1fr 1fr}.summary>div{border-left:0;border-top:1px solid var(--line)}.summary .hero{grid-column:1/-1;border-top:0}}

.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;font-size:12.5px;color:var(--muted)}
.legend{display:flex;flex-wrap:wrap;gap:12px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.sw{width:14px;height:10px;border-radius:1px;display:inline-block}
.scalebar{display:inline-flex;align-items:center;gap:8px}
.scalebar i{display:block;height:6px;border:1.5px solid var(--ink);border-top:0}
.toggle{display:inline-flex;align-items:center;gap:6px;cursor:pointer;color:var(--ink)}
.toggle input{accent-color:var(--accent);width:15px;height:15px}
.tb-right{margin-left:auto;display:flex;gap:16px;align-items:center;flex-wrap:wrap}

.walls{display:flex;flex-direction:column;gap:12px}
.wc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px 12px;display:flex;flex-direction:column;gap:12px}
.wc.hl{border-color:var(--accent)}
.wc-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.wc-id{display:flex;align-items:center;gap:10px;min-width:0}
.wc-len{font-family:var(--f-num);font-size:15px;font-weight:500}
.wc-sub{font-size:12.5px;color:var(--muted)}
.wc-ctrl{margin-left:auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.ctl{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--muted)}
.ctl select{height:30px;width:auto;font-size:12.5px;padding:0 6px}
.ctl .unit input{height:30px;width:84px;font-size:12.5px}
.add-sel{height:30px;width:auto;font-size:12.5px;font-weight:600;padding:0 8px;border:1px solid var(--line);border-radius:6px;background:var(--surface);cursor:pointer}
.state{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:3px 7px;border-radius:4px;background:var(--bg);color:var(--muted);border:1px solid var(--line)}
.state.man{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.wc-draw{overflow-x:auto;padding-top:4px}
.wc-draw svg{display:block;overflow:visible}
.wc-draw text{font-family:var(--f-num);pointer-events:none;user-select:none}
.pic{cursor:grab;touch-action:none;outline:none}
.pic.shift{transition:transform .16s ease}
.pic.lift{cursor:grabbing}
.pic.lift rect.body{filter:drop-shadow(0 3px 5px rgba(0,0,0,.25))}
.pic:hover rect.body{opacity:.88}
.pic:focus-visible rect.focus{stroke:var(--accent)}
.bg-hit{cursor:default}
@media (prefers-reduced-motion:reduce){.pic.shift{transition:none}}

.insp{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:10px 12px;background:var(--accent-soft);border-radius:6px}
.insp-info{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.insp-info b{font-family:var(--f-num);font-weight:500}
.insp-info span{font-size:12px;color:var(--muted)}
.insp .acts{display:flex;flex-wrap:wrap;gap:6px;margin-left:auto;align-items:center}
.insp-hint{font-size:12.5px;color:var(--muted)}
.insp-row{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding-top:8px;border-top:1px solid var(--line)}
.insp-row .ctl select{max-width:min(340px,70vw)}
.insp-row b{font-weight:600;color:var(--ink)}
.insp-warn{flex-basis:100%;color:var(--warn);font-weight:600;font-size:12.5px}
.wc-foot{font-size:12.5px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 14px}
.wc-foot b{color:var(--ink);font-weight:600}
.warn{color:var(--warn);font-weight:600}
.empty{padding:22px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:6px;background:var(--bg)}

/* Prisoverblik */
.price{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:14px;scroll-margin-top:16px}
.price.bad{border-color:var(--warn)}
.price-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px}
.price-head h2{margin:0;font-size:16px;letter-spacing:-.01em}
.price-head .acts{margin-left:auto;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.banner{border-radius:6px;padding:10px 12px;font-size:13px}
.banner.invalid{border:1px solid var(--warn);background:var(--warn-bg);color:var(--warn)}
.banner.invalid b{display:block;font-size:14px}
.banner.info{background:var(--accent-soft);color:var(--accent)}
.banner.miss{background:var(--warn-bg);color:var(--warn)}
.tbl-wrap{overflow-x:auto}
table.pt{width:100%;border-collapse:collapse;font-size:13.5px;min-width:480px}
.pt th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:8px;border-bottom:1px solid var(--line);white-space:nowrap}
.pt td{padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
.pt .r{text-align:right}
.pt .fcell{display:flex;align-items:center;gap:8px}
.pt .unit input{width:130px;height:32px;text-align:right;padding-right:34px}
.pt td.missing input{border-color:var(--warn);background:var(--warn-bg)}
.totals{display:grid;grid-template-columns:1fr auto;gap:6px 24px;margin-left:auto;width:min(440px,100%);font-size:14px;font-variant-numeric:tabular-nums}
.totals .num{text-align:right}
.totals .disc{color:var(--accent)}
.totals .final{font-size:20px;font-weight:600;border-top:1.5px solid var(--ink);padding-top:8px}
.void{text-decoration:line-through;color:var(--muted)}
.stamp{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--warn);border:1.5px solid var(--warn);border-radius:4px;padding:2px 6px;margin-right:8px;vertical-align:middle}
.tiers{display:flex;flex-direction:column;gap:6px}
.tier{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;padding:4px 6px;border-radius:6px}
.tier.on{background:var(--accent-soft)}
.tier input{width:72px;height:32px}
.tier .unit input{width:92px}
.tier .range{color:var(--muted);min-width:110px}
.tier.on .range{color:var(--accent);font-weight:600}
details.tiers-box summary{cursor:pointer;font-weight:600;font-size:13px}
details.tiers-box[open] summary{margin-bottom:8px}
.confirm{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px}

/* Forslag: undertitel og type */
.scen-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:-4px;font-size:12.5px;color:var(--muted)}
.scen-meta label{display:inline-flex;align-items:center;gap:8px}
.scen-meta input[type=text]{height:30px;width:240px;max-width:60vw;font-size:12.5px}
.scen-meta .toggle{color:var(--ink)}
.scen-meta .scdesc-l{flex-basis:100%;margin-bottom:-4px}
.scen-meta input.scdesc{flex:1 1 420px;width:auto;max-width:none}
.scen-meta .seg{width:auto}
.scen-meta .seg button{height:24px;font-size:12px}
.price h3{margin:4px 0 0;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pt.sv td.svname{min-width:270px}
.pt.sv td.svname>div{display:flex;flex-direction:column;gap:4px}
.pt.sv td.svname input{height:30px}
.pt.sv .svdesc{font-size:12px;height:26px!important;color:var(--muted)}
.pt.sv .unit input{width:104px}
.pt.sv td.num{white-space:nowrap}
.pt.sv .svqty{width:64px;text-align:right}
.pt.sv select{height:32px;width:auto;padding:0 6px;font-size:12.5px}
.pt.sv td.disc{color:var(--accent)}
.pt.sv td.svact{white-space:nowrap}
.pt.sv td.svact .iconbtn{display:inline-grid;width:26px;height:26px}
.pt.sv td.svact .iconbtn:disabled{opacity:.3;cursor:default}
.pt.sv tfoot td{border-bottom:0;padding-top:10px}
.sv-tools{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}
.sv-tools #svAdd{width:auto;height:32px;font-weight:600;font-size:12.5px}
.sv-tools .ctl select{height:32px;width:auto}

/* Indstillinger: materialer, priser, logo */
.st-wrap{overflow-x:auto}
.st-table{width:100%;border-collapse:collapse;font-size:13px}
.st-table th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:6px;border-bottom:1px solid var(--line);white-space:nowrap}
.st-table td{padding:5px 6px;border-bottom:1px solid var(--line);vertical-align:middle}
.st-table input{height:32px}
.st-table .unit input{width:112px;text-align:right;padding-right:30px}
.st-table .fcell{display:flex;align-items:center;gap:8px;white-space:nowrap}
.logo-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.logo-row .lname{width:96px;font-weight:600}
.logo-prev{height:40px;min-width:130px;display:flex;align-items:center;border:1px dashed var(--line);border-radius:6px;padding:4px 10px;background:#FFFFFF;color:#646A64;font-size:12px}
.logo-prev img{max-height:30px;max-width:200px;display:block}
.add-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.add-row input{width:96px}
.scen-meta select{height:30px;width:auto;font-size:12.5px;padding:0 6px}

/* Projektoversigt */
.ov{max-width:1240px;margin:0 auto;padding-block:24px 48px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:flex;flex-direction:column;gap:16px}
.ov-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ov-head h1{margin:0;font-size:24px;letter-spacing:-.015em}
.ov-head .btn{margin-left:auto}
.ov-tools{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center}
.ov-tools input{width:min(320px,100%)}
.ov-tools .seg{width:auto}
.ov-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow-x:auto}
table.ovt{width:100%;border-collapse:collapse;min-width:860px;font-size:13.5px}
.ovt th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.ovt td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.ovt tbody tr:last-child td{border-bottom:0}
.ovt tbody tr{cursor:pointer}
.ovt tbody tr:hover td{background:var(--bg)}
.ovt tr.arch td{color:var(--muted)}
.ovt .r{text-align:right}
.pname{font-weight:600;color:var(--ink);background:none;border:0;padding:0;cursor:pointer;font-size:14px;text-align:left}
.pname:hover{text-decoration:underline}
.co{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:99px;white-space:nowrap}
.co.militaerfoto{background:var(--mf-soft);color:var(--mf)}
.co.wecreate{background:var(--wc-soft);color:var(--wc)}
.archtag{font-size:11px;font-weight:600;color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:1px 6px;margin-left:6px}
.ov-acts{display:flex;gap:4px;justify-content:flex-end}
.top-name{font-weight:600;max-width:30ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.top-ctx{display:flex;align-items:center;gap:10px;min-width:0}
.qlist{display:flex;flex-direction:column;gap:6px}
.qrow{display:flex;gap:10px;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:6px;padding:8px 10px;background:var(--bg)}
.qrow>div{min-width:0}
.qrow .hint{overflow-wrap:anywhere}
.qacts{display:flex;gap:4px;flex:none}
.pv-badge{font-size:12px;font-weight:600;color:var(--accent);background:var(--accent-soft);border-radius:4px;padding:4px 8px}

/* Forslag */
.scen{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.scen .lbl2{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-right:4px}
.scen .tab{height:34px;padding:0 12px;border:1px solid var(--line);border-radius:6px;background:var(--surface);cursor:pointer;font-weight:600;font-size:13px;color:var(--muted)}
.scen .tab:hover{color:var(--ink);border-color:var(--muted)}
.scen .tab-edit{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--accent);border-radius:6px;background:var(--surface);padding:0 2px 0 10px;height:34px;box-shadow:inset 0 -2px 0 var(--accent)}
.scen .tab-edit input{border:0;background:transparent;height:30px;width:auto;padding:0;font-weight:600;font-size:13px}
.scen .tab-edit input:focus-visible{outline:none}
.scen .confirm{margin-left:6px}
.checks{display:flex;flex-wrap:wrap;gap:6px}
.ck{height:32px;min-width:36px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:var(--bg);cursor:pointer;font-weight:600;font-size:13px;color:var(--muted)}
.ck[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.lbl-row{display:flex;align-items:baseline;gap:10px}
.lbl-row button{border:0;background:none;color:var(--accent);cursor:pointer;font-size:12px;font-weight:600;padding:0}

/* Præsentationsvisning */
.pv{position:fixed;inset:0;z-index:70;overflow:auto;background:#1D252D}
.pv-bar{position:sticky;top:0;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;background:var(--surface);border-bottom:1px solid var(--line);
  padding-bottom:10px;padding-top:calc(10px + env(safe-area-inset-top,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.pv-bar .seg{width:auto}
.pv-acts{margin-left:auto;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.pv-hint{font-size:12px;color:var(--muted);max-width:34ch;line-height:1.3}
.pv-msg{font-size:12px;color:var(--warn)}

/* Modal */
.scrim{position:fixed;inset:0;background:rgba(10,12,14,.45);display:grid;place-items:center;z-index:50;padding:16px}
.modal{background:var(--surface);border:1px solid var(--line);border-radius:10px;width:min(420px,100%);padding:20px;display:flex;flex-direction:column;gap:16px}
.modal h3{margin:0;font-size:18px;text-wrap:balance}
.modal.wide{width:min(620px,100%);max-height:calc(100% - 32px);overflow:auto}
.modal h4{margin:0;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.dp{display:grid;grid-template-columns:auto 1fr auto;gap:6px 10px;align-items:center}
.dp .unit input{text-align:right;padding-right:34px}
.dp-add{display:grid;grid-template-columns:1fr auto 1fr 1.4fr auto;gap:6px;align-items:center}
.modal .acts{display:flex;justify-content:flex-end;gap:8px}