/* Tube laser estimator (tube-est.js). A drawing-sheet card on a dark band; uses site.css tokens. */
.te-sec{background:var(--ink);border-top:1px solid var(--line);overflow:hidden}
.te-sec::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:32px 32px;pointer-events:none}
.te-wrap{position:relative;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,4vw,64px);align-items:start}
.te-intro-col h2{margin:14px 0 16px}
.te-intro-col .lead{margin-bottom:22px}
.te-facts{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:10px;font-family:var(--f-mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:#D8D6D2}
.te-facts li{display:flex;gap:10px;align-items:baseline}
.te-facts li::before{content:"";flex:none;width:8px;height:8px;background:var(--orange);transform:translateY(-1px)}
.te-soon{display:inline-block;margin-bottom:6px;padding:6px 10px;border:1px solid var(--orange-lt);color:var(--orange-lt);font-family:var(--f-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.te{background:var(--paper);color:var(--ink-text);border:2px solid var(--ink-text);box-shadow:10px 10px 0 rgba(232,81,18,.85);min-height:420px;font-size:1rem;position:relative}
.te::after{content:"SF-TUBE · ESTIMATE";position:absolute;right:14px;bottom:10px;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.18em;color:var(--paper-line);pointer-events:none}
.te-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 16px;background:var(--ink-text);color:#fff}
.te-steps{display:flex;gap:6px;list-style:none;margin:0;padding:0;font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:#9a9ca3}
.te-steps li{display:flex;align-items:center;gap:6px;padding-right:8px}
.te-steps b{display:grid;place-items:center;width:22px;height:22px;border:1px solid #55585f;border-radius:50%;font-weight:500}
.te-steps li.on{color:#fff}.te-steps li.on b{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.te-steps li.done b{border-color:var(--orange-lt);color:var(--orange-lt)}
.te-ver{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:var(--orange-lt);padding:4px 8px}
.te>*:not(.te-top){margin-inline:clamp(16px,3vw,28px)}
.te>.te-top+*{margin-top:22px}
.te-err{margin-top:18px;padding:12px 14px;border-left:4px solid #B03737;background:#fff;color:#7a1f1f;font-size:.95rem}
.te-drop{display:grid;justify-items:center;gap:8px;text-align:center;padding:42px 18px;border:2px dashed #b9b1a3;background:#fff;cursor:pointer;transition:border-color .15s,background .15s}
.te-drop:hover,.te-drop.over{border-color:var(--orange);background:#fff8f3}
.te-drop input{position:absolute;width:1px;height:1px;opacity:0}
.te-drop:focus-within{outline:2px solid var(--orange);outline-offset:2px}
.te-drop svg{width:44px;height:44px;color:var(--orange-ink)}
.te-drop b{font-family:var(--f-display);font-size:1.5rem;text-transform:uppercase;letter-spacing:.01em}
.te-drop span{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.te-or{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:16px}
.te .btn{color:var(--ink-text);border-color:var(--ink-text);min-height:46px}
.te .btn:hover{color:var(--orange-ink);border-color:var(--orange-ink)}
.te .btn-red{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.te .btn-red:hover{background:var(--amber);border-color:var(--amber);color:var(--ink)}
.te .btn[disabled]{opacity:.45;pointer-events:none}
.te-link{background:none;border:0;padding:6px 0;font:600 .9rem var(--f-body);letter-spacing:.04em;text-transform:uppercase;color:var(--orange-ink);cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.te-how{margin:22px 0 28px;padding:0;list-style:none;display:grid;gap:8px;font-size:.95rem;color:var(--ink-soft)}
.te-how li{padding-left:18px;position:relative}.te-how li::before{content:"→";position:absolute;left:0;color:var(--orange-ink)}
.te-how b{color:var(--ink-text)}
.te-busy{display:grid;justify-items:center;gap:16px;padding:90px 16px;text-align:center;font-family:var(--f-mono);font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.te-spin{width:46px;height:46px;border-radius:50%;border:3px solid var(--paper-line);border-top-color:var(--orange);animation:te-spin .9s linear infinite}
@keyframes te-spin{to{transform:rotate(360deg)}}
.te-intro{font-size:1.02rem;color:var(--ink-soft)}.te-intro b{color:var(--ink-text)}
.te-note{margin-top:8px;font-size:.88rem;color:var(--ink-soft)}
.te-warn{margin-top:10px;padding:10px 12px;background:#fff4dc;border-left:3px solid #d99a00;font-size:.9rem}
.te-ok{margin-top:14px;padding:12px 14px;background:#eef7ee;border-left:3px solid #3c8a3c;font-size:.95rem}
.te-ok a{color:var(--orange-ink)}
.te-opts{display:flex;align-items:end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:18px}
.te-opts .te-f{min-width:240px;flex:1;max-width:360px}
.te-units{display:flex;border:1px solid var(--ink-text)}
.te-units button{background:#fff;border:0;padding:10px 14px;font:500 .74rem var(--f-mono);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;color:var(--ink-text)}
.te-units button.on{background:var(--ink-text);color:#fff}
.te-f{display:grid;gap:5px;min-width:0}
.te-f>span{font-family:var(--f-mono);font-size:.66rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.te input,.te select,.te textarea{padding:9px 10px;font-size:.98rem}
.te-chk{display:flex;align-items:center;gap:10px;align-self:end;padding-bottom:10px}
.te-chk input{width:20px;height:20px;flex:none;accent-color:var(--orange)}
.te-chk span{font-family:var(--f-body);font-size:.92rem;letter-spacing:0;text-transform:none;color:var(--ink-text)}
.te-parts{display:grid;gap:12px;margin-top:16px}
.te-part{background:#fff;border:1px solid var(--paper-line);border-left:4px solid var(--orange);padding:12px 14px 14px}
.te-part.off{opacity:.55;border-left-color:var(--paper-line)}
.te-ph{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.te-inc input{width:20px;height:20px;accent-color:var(--orange)}
.te .te-name{flex:1;border:0;border-bottom:1px dashed var(--paper-line);padding:4px 2px;font:700 1.15rem var(--f-display);text-transform:uppercase;letter-spacing:.02em;background:transparent}
.te-flag{flex:none;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 7px;background:#fff4dc;color:#7a5600;border:1px solid #e6c46a}
.te-flag.ok{background:#eef7ee;color:#2e6b2e;border-color:#a9d3a9}
.te-x{flex:none;width:32px;height:32px;border:1px solid var(--paper-line);background:#fff;font-size:1.2rem;line-height:1;cursor:pointer;color:var(--ink-soft)}
.te-x:hover{border-color:#B03737;color:#B03737}
.te-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px}
.te-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0 12px}
.te-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:22px;padding-bottom:30px}
.te-actions>span{flex:1}
.te-actions .btn{white-space:nowrap}
.te-prof{grid-column:span 2}
.te-form>.te-f{margin-top:12px}
.te-ts{margin-top:14px;min-height:65px}
.te-ts:empty{min-height:0}
.te-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}
.te-fine{margin-top:14px;font-size:.82rem;color:var(--ink-soft)}
.te-res{padding-top:4px}
.te-big{display:grid;gap:4px;padding:20px;background:var(--ink-text);color:#fff;border-left:6px solid var(--orange)}
.te-big small{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-lt)}
.te-big strong{font-family:var(--f-display);font-size:clamp(2.4rem,6vw,4rem);font-weight:800;line-height:1;letter-spacing:-.01em}
.te-big span{font-size:.92rem;color:#c9cbd0}
.te-break{margin:16px 0 0;border:1px solid var(--paper-line);background:#fff}
.te-break>div{display:flex;justify-content:space-between;gap:12px;padding:11px 14px;border-top:1px solid var(--paper-line)}
.te-break>div:first-child{border-top:0}
.te-break dt{display:grid;gap:2px;font-weight:600}
.te-break dt small{font-weight:400;font-size:.8rem;color:var(--ink-soft)}
.te-break dd{margin:0;display:flex;gap:14px;align-items:baseline;white-space:nowrap;font-family:var(--f-mono);font-size:.9rem}
.te-break dd span{color:var(--ink-soft);font-size:.8rem}
.te-break .tot{background:var(--paper-2);border-top:2px solid var(--ink-text)}
.te-lines{margin-top:16px}
.te-lines summary{cursor:pointer;font-family:var(--f-mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--orange-ink)}
.te-scroll{overflow-x:auto;margin-top:10px}
.te-lines table{width:100%;border-collapse:collapse;font-size:.88rem;background:#fff}
.te-lines th,.te-lines td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--paper-line);vertical-align:top}
.te-lines th{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.te-lines td small{display:block;color:var(--ink-soft)}
@media (max-width:900px){.te-wrap{grid-template-columns:1fr}.te{box-shadow:6px 6px 0 rgba(232,81,18,.85)}}
@media (max-width:560px){.te-grid2{grid-template-columns:1fr}.te-grid{grid-template-columns:1fr 1fr}.te-steps li{font-size:0;gap:0;padding-right:2px}.te-steps b{font-size:.7rem}.te-actions .btn{flex:1;padding:0 14px;font-size:.85rem}.te-break dd{flex-direction:column;align-items:end;gap:0}}
