/* HIG web adaptation: project-chosen dimensions, native web semantics. */
:root{color-scheme:light dark;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--bg:#f5f6f5;--surface:#fff;--subtle:#edf1ed;--ink:#192c23;--muted:#59685f;--line:#d6ddd8;--green:#075332;--on-green:#fff;--selected:#e1efdf;--selected-ink:#164c2c;--warning:#77521a;--warning-bg:#fff5df;--danger:#a12e2b;--danger-bg:#fff0ed;--focus:#146dc2;background:var(--bg);color:var(--ink)}
body{font-size:1rem;line-height:1.5}button,input,select,textarea{font-family:inherit}h1,h2,h3,.stat .value,.loom-output,.loom-no,.loom-pick strong,.loom-number-tag,.calculated-value strong,.meter-field input,.brand-signature,.mobile-brand{font-family:inherit}h1{font-size:clamp(1.6rem,2.5vw,2rem);line-height:1.2;letter-spacing:-.04em}h2{font-size:1.15rem;line-height:1.35}h3{font-size:1rem}p.sub{font-size:.95rem;max-width:65ch}.quiet,.entry-note{font-size:.875rem}button,a,input,select,textarea,summary{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--focus);outline-offset:3px}button:active:not(:disabled){transform:translateY(1px);filter:brightness(.94)}.skip-link{position:fixed;left:16px;top:-100px;padding:12px 18px;z-index:100;background:var(--surface);border-radius:10px}.skip-link:focus{top:12px}
.sidebar{background:var(--surface);color:var(--ink);border-right:1px solid var(--line);padding-top:24px}.brand-official{background:#eaf2ef;border:0;padding:12px;border-radius:14px}.official-logo{width:156px;aspect-ratio:386/116}.official-logo img{top:-248.276%}.nav-label{font-size:.7rem;color:var(--muted);letter-spacing:.08em;margin-top:24px}.nav-item{font-size:.875rem;color:var(--muted);border-radius:10px;min-height:46px}.nav-item.active{background:var(--selected);color:var(--selected-ink)}.nav-item:hover:not(.active){background:var(--subtle)}.nav-item svg{width:21px;height:21px;flex-shrink:0}.sidebar-foot,.sidebar-foot small{color:var(--muted)}.topbar{min-height:64px;height:auto;padding-block:12px;background:var(--surface)}.demo-pill{color:var(--muted);border-color:var(--line);border-radius:7px;font-size:.68rem}.demo-banner{background:var(--subtle);color:var(--muted);border-color:var(--line);font-size:.8rem}.demo-banner{flex-wrap:wrap}.demo-banner .actions{flex-wrap:wrap;min-width:0}.demo-banner #storage-message{overflow-wrap:anywhere}.demo-banner strong{color:var(--ink)}.breadcrumb b{color:var(--ink)}main{padding-top:32px}.page-head{margin-bottom:28px}.mascot-portrait{width:48px;height:55px;border-radius:12px;box-shadow:none}.heading-identity{gap:14px}.page-head .actions{flex-shrink:1}
.btn{border-radius:10px;border-color:var(--line);background:var(--surface);color:var(--ink);min-height:44px;font-size:.875rem;padding:10px 16px}.btn.small{min-height:44px;font-size:.8rem;padding:8px 12px}.btn:hover{background:var(--subtle)}.btn.primary,.btn.primary:hover{background:var(--green);border-color:var(--green);color:var(--on-green)}.btn.primary:hover{filter:brightness(.92)}.btn.text{color:var(--green)}.btn.destructive{color:var(--danger);background:transparent;border-color:transparent}.field{font-size:.9rem;min-width:0;gap:7px;font-weight:550}.field small{font-weight:400;font-size:.8rem}.field input,.field select,.field textarea{font-weight:400}input,select,textarea{background:var(--surface);color:var(--ink);border-color:var(--line);border-radius:9px;font-size:1rem;min-height:46px;padding:11px 12px}input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}input:disabled,.loom-entry-form input:disabled{background:var(--subtle);color:var(--muted)}.entry-fields{gap:20px}.panel,.stat,.loom-card,.table-wrap{background:var(--surface);border-color:var(--line);border-radius:14px}.panel{padding:24px}.stat.featured{background:var(--selected);border-color:var(--line);color:var(--ink)}.stat.featured .label,.stat.featured .meta{color:var(--muted)}.stat .corner{display:none}.stat .label{font-size:.85rem}.stat .meta{font-size:.78rem}.stat .value{font-size:2rem}.loom-card{border-top-width:1px}.loom-card.stopped,.loom-card.breakdown{border-top-color:var(--line)}.loom-top{flex-wrap:wrap}.badge{background:var(--selected);color:var(--selected-ink);font-size:.75rem;border-radius:6px;white-space:normal}.badge.amber{background:var(--warning-bg);color:var(--warning)}.badge.red{background:var(--danger-bg);color:var(--danger)}.badge.neutral{background:var(--subtle);color:var(--muted)}.avatar,.issue-icon{background:var(--subtle);color:var(--muted)}.product-line,.loom-output small,.loom-measures,.card-bottom{font-size:.8rem}.card-bottom,.issue-row{border-color:var(--line)}.loom-measures,.card-bottom{flex-wrap:wrap}.notice{background:var(--warning-bg);border-color:var(--line);color:var(--warning);border-radius:12px}.bar-fill,.chart .bar-col:nth-child(even) .bar-fill,.progress i,.timeline i.run{background:var(--green)}.timeline i.stop,.dot.amber{background:var(--warning)}.timeline i.break,.dot.red{background:var(--danger)}.dot{background:var(--green)}.progress,.timeline i{background:var(--subtle)}th{background:var(--subtle);color:var(--muted)}td{border-color:var(--line)}.formula,.entry-summary{background:var(--subtle);border-radius:12px}.formula strong{color:var(--green)}.chip-tabs{background:var(--subtle);border-radius:11px}.chip-tabs button{min-height:44px;font-size:.85rem;border-radius:8px}.chip-tabs button.active{background:var(--surface);color:var(--ink);box-shadow:0 1px 4px #0002}.error{background:var(--danger-bg);color:var(--danger);border-radius:9px;padding:12px 14px;font-size:.9rem}
.loom-pick{background:var(--surface);border-color:var(--line);color:var(--ink);border-radius:12px;min-height:106px;position:relative}.loom-pick:hover{background:var(--subtle);border-color:var(--line)}.loom-pick-state,.loom-pick-label{color:var(--muted)}.loom-pick.recorded{background:var(--surface);border-color:var(--green)}.loom-pick.recorded .loom-pick-state{color:var(--green)}.loom-pick.selected{background:var(--green);border-color:var(--green);color:var(--on-green);box-shadow:none}.loom-pick.selected:after{content:'✓';position:absolute;top:5px;right:8px;font-size:.75rem}.loom-pick.selected .loom-pick-state,.loom-pick.selected .loom-pick-label{color:var(--on-green)}.loom-pick-state{font-size:.75rem}.loom-pick strong{font-size:1.75rem;font-weight:650}.step-number{background:var(--subtle);color:var(--muted)}.entry-count strong{color:var(--ink)}.select-loom-empty{background:var(--surface);border-color:var(--line);border-radius:14px}.loom-number-tag{background:var(--selected);color:var(--selected-ink);border-radius:11px}.loom-number-button{color:var(--green);min-height:44px}.loom-number-button:hover{color:var(--green)}.meter-field input{background:var(--surface);border-color:var(--green);font-size:1.8rem;min-height:66px}.meter-field input::placeholder{font-family:inherit;font-size:1rem}.mobile-estimate{background:var(--subtle);color:var(--ink);border-radius:9px}.conversion-panel{background:var(--subtle);border-color:var(--line)}.calculated-value{border-color:var(--line)}.calculated-value strong{color:var(--ink);font-size:2rem}.calculated-value span,.eyebrow{color:var(--muted)}.conversion-note{background:var(--surface);border-radius:10px}.panel-plan{border:0;border-top:1px solid var(--line);border-radius:0;padding:22px 0 0}.panel-plan .section-head{padding:0;border:0;margin-bottom:16px}.panel-row{background:var(--subtle);border-radius:12px;padding:16px;margin:14px 0}.panel-dimensions{margin:14px 0}.plan-help{margin-top:16px;font-size:.85rem;color:var(--muted)}.plan-help summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--green);font-weight:600}.plan-help summary:before{content:'＋';margin-right:8px}.plan-help[open] summary:before{content:'−'}.plan-help p{margin:4px 0 12px}.width-summary{background:var(--subtle);padding:12px 14px;border-radius:9px;font-weight:600;font-size:.85rem}.undo-row{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--subtle);border-radius:10px;padding:10px 14px;margin-bottom:16px;font-size:.875rem}.saved-entry-details dd{line-height:1.5}
.dialog-head{gap:16px}dialog{background:var(--surface);color:var(--ink);border-radius:18px;border-color:var(--line);padding:28px;max-height:calc(100dvh - 48px)}dialog::backdrop{background:#10231b70;backdrop-filter:none}.close{width:44px;height:44px;flex-shrink:0;background:var(--subtle);color:var(--muted);font-size:1.5rem}.dialog-actions{background:var(--surface)}.report{background:var(--subtle);overflow-wrap:anywhere}.mobile-menu .btn{min-height:52px}.mobile-menu small{font-size:.8rem}#toast{background:var(--ink);color:var(--surface);border-radius:12px;font-size:.9rem}.brand-signature{color:var(--green)}footer{color:var(--muted)}
@media(max-width:1200px){.page-head{flex-wrap:wrap}.loom-entry-layout{grid-template-columns:1fr}.lower-grid{grid-template-columns:1fr}.conversion-panel{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}.conversion-panel>h2,.conversion-panel>.entry-note,.conversion-panel>.eyebrow,.conversion-panel>.conversion-note,.conversion-panel>.quiet{grid-column:1/-1}}
@media(min-width:761px) and (max-width:900px){.sidebar{background:var(--surface)}.brand-official{width:180px}.sidebar nav{padding-bottom:6px}.nav-item{min-height:46px}}
@media(max-width:760px){
 :root{--mobile-nav-height:76px}.topbar{min-height:54px;padding:10px 18px}.mobile-brand{font-size:.9rem;color:var(--green)}.demo-banner{padding:10px 18px;font-size:.8rem}.demo-pill{font-size:.65rem}main{padding:24px 18px calc(110px + env(safe-area-inset-bottom))}body[data-view="entry"] main{padding-bottom:calc(205px + env(safe-area-inset-bottom))}.heading-identity{gap:12px}.heading-identity h1{font-size:1.6rem}.heading-identity .sub{font-size:.875rem}.mascot-portrait{width:40px;height:46px}.page-head{margin-bottom:22px}.btn,.btn.small{min-height:48px}.panel{padding:18px}.field,.loom-entry-form .field{font-size:.95rem;gap:7px}.field small,.loom-entry-form .field small{font-size:.8rem}input,select,textarea{font-size:1rem;min-height:48px}.entry-time .filter-group{gap:12px}.entry-time .field{display:flex;font-size:.85rem;line-height:1.5;gap:7px}.entry-time input,.entry-time select{min-height:50px;height:50px}.entry-count{font-size:.85rem;margin-top:10px}.entry-count strong{font-size:1rem}.loom-select-section{margin:22px 0}.loom-select-section h2{font-size:1rem}.loom-buttons{gap:9px}.loom-pick{min-height:80px;padding:12px 5px}.loom-pick strong{font-size:1.6rem}.loom-pick-state{font-size:.75rem}.selected-loom-panel{margin-top:20px}.select-loom-empty{padding:25px 16px}.select-loom-empty h2{font-size:1rem}.select-loom-empty p{font-size:.9rem}.loom-entry-form .section-head{padding-bottom:16px;margin-bottom:20px}.selected-loom-heading h2{font-size:1.1rem}.selected-loom-heading p{font-size:.8rem}.loom-entry-form .entry-fields{gap:20px}.meter-field input{font-size:1.8rem;min-height:64px}.mobile-estimate{font-size:.85rem;padding:11px 12px}.panel-plan{padding:20px 0 0}.panel-row{padding:14px}.panel-plan .actions{display:grid;grid-template-columns:1fr}.panel-dimensions .field{font-size:.8rem}.conversion-panel h2{font-size:1rem}.conversion-panel>.entry-note{font-size:.85rem}.calculated-value span{font-size:.8rem}.calculated-value strong{font-size:1.75rem}.saved-entry-details dt{font-size:.8rem}.saved-entry-details dd{font-size:.95rem}.mobile-nav{background:var(--surface);padding:8px 10px calc(8px + env(safe-area-inset-bottom));box-shadow:none}.mobile-nav button{background:transparent;color:var(--muted);font-size:.72rem;border-radius:12px;gap:5px}.mobile-nav button.active{background:var(--selected);color:var(--selected-ink)}.mobile-entry-save{background:var(--surface);border-color:var(--line);padding:12px 18px;box-shadow:none}.mobile-entry-save>span{font-size:.9rem}.mobile-entry-save small{font-size:.75rem}.mobile-entry-save .btn{min-width:165px;font-size:1rem}html{scroll-padding-bottom:calc(200px + env(safe-area-inset-bottom))}.loom-entry-form .field{scroll-margin-block:20px 200px}#toast{bottom:calc(175px + env(safe-area-inset-bottom));font-size:.85rem}dialog{padding:20px;width:calc(100% - 24px);max-height:calc(100dvh - 32px)}.dialog-actions{background:var(--surface);bottom:-20px;padding:14px 0;flex-wrap:wrap}.entry-time select{background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 22px,calc(100% - 13px) 22px;background-size:5px 5px}
}
@media(max-width:420px){.heading-identity h1{font-size:1.5rem}.mobile-entry-save .btn{min-width:150px}}
@media(max-width:360px){main{padding-inline:12px}.mobile-entry-save{padding-inline:12px}.mobile-entry-save .btn{min-width:140px}.stats,.panel-dimensions,.saved-entry-details{grid-template-columns:1fr}.loom-buttons{gap:6px}.loom-pick-state{font-size:.7rem}.mobile-nav button{font-size:.65rem}}
@media(max-height:540px) and (max-width:760px){.mobile-entry-save{position:static;margin-top:18px;border-radius:12px}.mobile-nav{position:static;height:auto;padding-bottom:10px}body[data-view] main{padding-bottom:24px}}
@media(prefers-color-scheme:dark){:root{--bg:#141a17;--surface:#202823;--subtle:#2b352e;--ink:#f1f5ef;--muted:#bdc9bf;--line:#4c5c50;--green:#a8d99e;--on-green:#12321d;--selected:#304a32;--selected-ink:#d7f0cd;--warning:#f0d096;--warning-bg:#392e1b;--danger:#ffb6ad;--danger-bg:#422925;--focus:#8ec6ff}}
@media(prefers-contrast:more){:root{--muted:var(--ink);--line:var(--ink)}.btn,.loom-pick,input,select,textarea{border-width:2px}.nav-item.active{outline:2px solid var(--green);outline-offset:-2px}}
@media(forced-colors:active){.loom-pick.selected,.nav-item.active,.mobile-nav .active{outline:3px solid Highlight;outline-offset:-3px}.btn.primary{border:2px solid ButtonText}.bar-fill,.timeline i{background:Highlight}.badge{border:1px solid CanvasText}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Button display rules must not override the signed-out hidden state. */
#sign-out[hidden] { display: none; }