/* Landscape Zero v10 — one column, one question, detail on demand. */
:root{--hero-h:400px;font-variant-numeric:tabular-nums}
body{color:#0E3B43}
#app.calm-edition{overflow-x:clip;overflow-y:visible;min-height:100svh;padding:0 16px 40px}
.app-column{width:100%;max-width:560px;margin:0 auto}
.top{position:sticky;inset:auto;top:0;display:block;padding:0;z-index:12}
.topbar-row{height:48px;position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px}
.wordmark{font-size:13px;letter-spacing:.11em;line-height:1.2;white-space:nowrap}
.stage-switch{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;padding:2px;border:0;background:rgba(255,252,247,.9);box-shadow:0 2px 10px rgba(14,59,67,.08);z-index:1}
.stage-switch button{min-height:28px;font-size:12px;line-height:16px;padding:5px 9px}
.more{width:36px;height:36px;flex:none;display:grid;place-items:center;border:1px solid rgba(31,138,128,.25);border-radius:50%;background:rgba(255,252,247,.94);font-size:25px;line-height:1;font-weight:600;padding:0;box-shadow:none;color:#0E3B43}
.telemetry-wrap{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding-top:3px}
.telemetry{max-width:100%;display:flex;align-items:center;justify-content:center;gap:0;min-height:34px;padding:7px 13px;border:1px solid rgba(31,138,128,.3);border-radius:999px;background:rgba(255,252,247,.96);box-shadow:0 3px 15px rgba(14,59,67,.09);font-size:13px;font-weight:500;line-height:18px;white-space:pre;font-variant-numeric:tabular-nums}
.telemetry svg{width:14px;height:14px;margin-left:6px;fill:none;stroke:#1F8A80;stroke-width:1.5}
.telemetry.estimated:before{content:"";width:5px;height:5px;border-radius:50%;background:#E0A030;margin-right:7px}
.telemetry-tax{position:absolute;left:50%;top:100%;transform:translateX(-50%);font-size:10px;line-height:12px;color:#284F54}
.options-menu{position:absolute;right:0;top:46px;width:200px;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:6px;border:1px solid #C2D7CD;border-radius:16px;background:#FFFCF7;box-shadow:0 12px 35px rgba(14,59,67,.2);max-width:none;z-index:30}
.options-menu button{display:block;width:100%;min-height:44px;text-align:left;border:0;border-radius:10px;padding:10px 12px;background:transparent;box-shadow:none;font-size:14px}
.options-menu button:hover{background:#E7F1EB}
.options-menu #depth{display:block}
main{width:100%}
.scene{position:relative;height:var(--hero-h);min-height:0;padding:0;margin:24px 0 0;display:flex;justify-content:center;overflow:visible}
.hero-wrap{width:calc(var(--hero-h)*1244/1265);height:var(--hero-h);min-width:calc(var(--hero-h)*1244/1265);max-width:none;margin:0;flex:none}
.engine{width:100%;height:var(--hero-h);aspect-ratio:auto}
.breathing{animation:breathe 6s ease-in-out infinite}
#ring{width:min(420px,calc(100vw - 34px));height:min(420px,calc(100vw - 34px));left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;pointer-events:auto}
.facet-fill,.facet-fill.scored{transition:stroke-dasharray 350ms ease-out,opacity 350ms ease-out}
.facet-hit{stroke:transparent;stroke-width:28px;pointer-events:stroke;cursor:pointer}
.pillar-arc{outline:none;cursor:pointer}
.pillar-arc:focus-visible .facet-outline{stroke:#FFFCF7;stroke-width:18px;filter:drop-shadow(0 0 8px #1F8A80)}
.facet-sweep.flash{animation-duration:350ms}
.pillar-buttons,.daily,.figures,.garden-details,.ring-caption,footer,.legacy-bridge,.ecology-area{display:none!important}
.settle{display:none!important}
.section,.section.active{font-size:14px;line-height:1.15;min-height:40px;padding:6px 10px}
.task-cell,.task-cell .cell-name{font-size:14px}
.task-cell{min-height:38px;padding:2px 4px}
.task-cell:after{min-height:44px}
.question-area{width:100%;min-width:0;max-width:560px;margin:20px 0 0;padding:24px;text-align:left;background:rgba(244,235,221,.95);border:1px solid rgba(255,252,247,.6);border-radius:20px;box-shadow:0 10px 35px rgba(14,59,67,.13);position:relative;z-index:4}
#app[data-step="opening"] .question-area h1,.question-area h1{font-family:Fraunces,Georgia,serif;font-size:26px;line-height:1.18;font-weight:400;letter-spacing:-.025em;white-space:normal;margin:0 0 18px;color:#0E3B43}
.question-area .eyebrow,#question-hint[hidden],#coach-strip,#change-receipt,#score-why,.input-foot{display:none!important}
#question-hint{font-size:13px;line-height:1.5;color:#395B60;margin:0 0 15px}
.answered-summary{display:flex;align-items:center;gap:8px;margin:0 0 15px;font-size:13px;line-height:1.5;color:#526C6D}
#answered-copy{min-width:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#answered-copy .assumed-summary{color:#795214}
.answered-summary button{border:0;background:transparent;padding:2px 0;min-height:24px;color:#395B60;text-decoration:underline;text-underline-offset:3px;font-size:13px;flex:none}
.question-area .echoes{margin:0 0 15px;gap:6px;justify-content:flex-start}
.question-area .echo{font-size:13px;min-height:34px;padding:7px 10px}
.question-area .answers{display:grid;grid-template-columns:1fr;gap:8px;margin:0;min-height:0;align-items:stretch}
.question-area .chip,.question-area .chip.option{width:100%;max-width:none;min-width:0;min-height:46px;padding:12px 14px;font-size:15px;line-height:1.35;border-radius:14px;background:#FFFCF7;border-color:#A8BBB0;box-shadow:none;text-align:left}
.question-area .chip b{font-size:15px;font-weight:600}
.question-area .chip small,.question-area .chip .points{font-size:13px;line-height:1.45;margin-top:4px}
.question-area .chip .tradeoff{display:block;color:#395B60;font-size:13px;font-weight:400;line-height:1.5;margin-top:4px}
.question-area .chip.primary{background:#E8743B;border-color:#E8743B;color:#0E3B43;text-align:center;font-weight:600}
.question-area .chip.primary:disabled{background:#DFCEBF;border-color:#C6B29F;color:#526C6D}
.question-area .answers.starters{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.question-area .answers.starters .chip{min-height:44px;padding:9px 5px;font-size:13px;text-align:center}
.question-area .brief-form{margin:0 0 14px;min-height:50px;padding:3px 5px 3px 12px;border-color:#A8BBB0;border-radius:12px;background:rgba(255,252,247,.98);box-shadow:none}
.question-area .brief-form input{font-size:15px}
.question-area .brief-form input::placeholder{font-size:13px;color:#607575}
.question-area .brief-form button{width:38px;height:42px;border-radius:9px}
.quiet-links{display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px;margin-top:12px}
.quiet,.quiet-links button,.sample-tick-link{border:0;background:transparent;color:#395B60;text-decoration:underline;text-underline-offset:3px;min-height:30px;font-size:13px;line-height:1.45;padding:4px 0;text-align:left;font-weight:400}
.portfolio-alert{margin:14px 0 0;color:#526C6D;font-size:12px;min-height:24px}
.quiet-links:empty{display:none}
.review-summary{margin:-4px 0 18px}
.review-price{font-family:Fraunces,Georgia,serif;font-size:38px;line-height:1.15;letter-spacing:-.035em;font-weight:500;color:#0E3B43;margin:0 0 8px;font-variant-numeric:tabular-nums}
.review-price small{font-family:Inter,system-ui,sans-serif;font-size:12px;letter-spacing:0;font-weight:400}
.review-cost-line{font-size:12px;line-height:1.65;color:#395B60;margin:0 0 7px;font-variant-numeric:tabular-nums}
.review-zero{font-size:14px;line-height:1.5;color:#1F8A80;font-weight:600;margin:0}
.review-zero small{font-size:12px;font-weight:400}
.client-preview{margin-top:16px;border-top:1px solid #CABFAF;padding-top:14px}
.client-preview .time-lapse{max-width:none;width:100%;padding:0;margin:0;background:transparent;border-radius:0;box-shadow:none}
.client-preview .time-title{font-size:11px;letter-spacing:.1em;text-align:left}
.client-preview .time-stops button{font-size:13px;min-height:40px}
.client-preview #growth-caption{font-size:12px;text-align:left;color:#526C6D}
.drawer-backdrop{position:fixed;inset:0;touch-action:none;background:rgba(14,59,67,.3);z-index:45;animation:backdrop-in 250ms ease-out}
.detail{position:fixed;left:50%;right:auto;top:auto!important;bottom:16px;transform:translateX(-50%);width:calc(100% - 24px);max-width:560px;min-width:0;max-height:min(78svh,760px);overflow:auto;overscroll-behavior:contain;padding:24px;border:1px solid #D1DACE;border-radius:22px;background:#FFFCF7;box-shadow:0 18px 70px rgba(14,59,67,.3);z-index:46;animation:drawer-in 250ms ease-out}
.detail.closing{animation:drawer-out 250ms ease-out both;pointer-events:none}
.detail-head{align-items:flex-start;gap:12px;margin-bottom:16px}
.detail-head small{font-size:10px;line-height:1.5;letter-spacing:.1em}
.detail-head h2{font-family:Fraunces,Georgia,serif;font-size:26px;line-height:1.15;letter-spacing:-.02em}
.detail-head>button{width:34px;height:34px;min-height:34px;border-radius:50%;font-size:24px;line-height:1;flex:none}
.detail p{font-size:14px;line-height:1.65}
.detail h3{font-size:17px;line-height:1.4;margin:20px 0 10px}
.detail table{font-size:14px;line-height:1.5;width:100%}
.detail table td small{font-size:11px;line-height:1.5}
.detail .answers{gap:8px;margin:16px 0 0}
.detail .chip{font-size:14px;min-height:44px;padding:10px 13px;box-shadow:none}
.detail .chip.option{min-width:0;max-width:none;flex-basis:100%}
.detail .chip b{font-size:14px}
.detail .tradeoff{display:block;font-size:12px;line-height:1.5;margin-top:4px;color:#395B60}
.detail .total-strip{gap:10px}
.detail .total-strip b{font-size:23px}
.detail[data-kind="quote"] .score-large{font-family:Fraunces,Georgia,serif}
.drawer-price{font-family:Fraunces,Georgia,serif;font-size:34px;line-height:1.15;margin:0 0 16px;color:#0E3B43}
.drawer-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 20px;padding:14px 0;border-block:1px solid #CFD9CD}
.drawer-stats>span{font-size:11px;line-height:1.6;color:#526C6D}
.drawer-stats b{display:block;font-size:16px;font-weight:600;line-height:1.5;color:#0E3B43;font-variant-numeric:tabular-nums}
.score-trail{list-style:none;margin:0;padding:0}
.score-trail li{border-bottom:1px solid #DFE5DB;padding:8px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;line-height:1.5}
.score-trail .inline-why{white-space:nowrap;flex:none}
.ecology-drawer .ecology-choices{display:flex;flex-direction:column;gap:0}
.ecology-drawer .ecology-chip{min-height:74px;max-width:100%;box-shadow:none;padding:10px 2px;border:0;border-bottom:1px solid #D6DFD0;border-radius:0;background:transparent}
.ecology-drawer .eco-icon{width:38px;flex-basis:38px}
.ecology-drawer .ecology-chip .eco-chip-copy>b{font-size:14px}
.ecology-drawer .ecology-chip .eco-chip-copy>small{font-size:11px}
.ecology-drawer .eco-chip-values{font-size:12px}
.ecology-drawer .eco-chip-values strong{font-size:14px}
.ecology-drawer .ecology-coach{font-size:18px}
.arc-tooltip{position:fixed;z-index:35;max-width:230px;padding:10px 13px;border-radius:12px;background:#0E3B43;color:#FFFCF7;box-shadow:0 7px 24px rgba(14,59,67,.22);font-size:13px;line-height:1.45;white-space:nowrap}
.arc-tooltip button{border:0;background:none;color:#B5EBDE;font-size:12px;text-decoration:underline;text-underline-offset:3px;display:block;padding:4px 0 0;min-height:26px}
.has-detail .question-area .primary,.options-open .question-area .primary{background:#D3DFD4;border-color:#A7BBAF;color:#395B60}
.question-change{animation:question-in 220ms cubic-bezier(.22,1,.36,1)}
@keyframes question-in{from{opacity:.2;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@keyframes drawer-in{from{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes drawer-out{from{opacity:1;transform:translate(-50%,0)}to{opacity:0;transform:translate(-50%,20px)}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}
@media(max-width:480px){#app.calm-edition{padding-inline:12px}.wordmark{font-size:10.5px;letter-spacing:.08em}.stage-switch button{font-size:11px;padding:5px 7px}.question-area{padding:24px}.drawer-stats{gap:5px}.drawer-stats b{font-size:14px}.detail{padding:22px}.telemetry{font-size:12px;padding:7px 11px}.telemetry svg{width:12px;margin-left:4px}}
@media(max-width:420px){.wordmark{white-space:normal;max-width:80px;font-size:11px}.wordmark b{display:block}}
@media(max-width:360px){.wordmark{max-width:76px;font-size:10.5px}.drawer-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.telemetry{font-size:11px;padding-inline:8px}.stage-switch button{font-size:10.5px;padding-inline:4px}.section,.section.active{padding:6px 8px}}
@media(prefers-reduced-motion:reduce){.question-change,.detail,.detail.closing,.drawer-backdrop{animation:none!important;transition:none!important}}
/* v11 — museum call-outs, job scope and proportional point tracks. */
.score-context{padding:8px 0 0;text-align:center;font-size:11px;line-height:1.45;color:#395B60}
#score-intro{margin:0 0 2px;font-size:11px;line-height:1.5}
.weakest-pillar{border:0;background:none;padding:3px 6px;min-height:26px;color:#0E3B43;font-size:11px;line-height:1.5;text-decoration:underline;text-underline-offset:3px}
.telemetry-tax{display:none}
.scene{margin-top:14px}
#section-buttons.job-callouts{position:absolute;left:50%;top:0;transform:translateX(-50%);width:calc(var(--hero-h)*1764/1265);height:var(--hero-h);max-width:none;overflow:visible;z-index:6;pointer-events:none}
.job-callout{cursor:pointer;outline:none;pointer-events:none}
.zone-hit{fill:transparent;stroke:none;pointer-events:fill}
.zone-target{fill:transparent;stroke:none;pointer-events:all}
.callout-leader{fill:none;stroke:rgba(14,59,67,.7);stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:stroke}
.callout-dot{fill:#1F8A80;stroke:#FFFCF7;stroke-width:1.5;vector-effect:non-scaling-stroke;pointer-events:none}
.callout-copy{pointer-events:all}
.callout-label-hit{fill:transparent;stroke:none}
.callout-copy text{font:500 41px Inter,system-ui,sans-serif;fill:#0E3B43;paint-order:stroke;stroke:rgba(255,252,247,.9);stroke-width:7;stroke-linejoin:round;pointer-events:none}
.callout-copy .callout-status{font-size:34px;fill:#395B60}
.callout-tick{fill:#126F62;font-weight:700}
.job-callout:hover .callout-dot,.job-callout:focus-visible .callout-dot{fill:#E8743B;stroke-width:2.5}
.job-callout:hover .callout-leader,.job-callout:focus-visible .callout-leader{stroke:#1F8A80;stroke-width:1.5}
.job-callout:focus-visible .zone-target{stroke:#1F8A80;stroke-width:2;vector-effect:non-scaling-stroke}
.job-callout.pulse .callout-dot{animation:callout-pulse 420ms ease-out}
#ring .facet-outline{stroke:#9FD8CF;stroke-width:14px;opacity:.7}
#ring .facet-bed{stroke:rgba(255,252,247,.5);stroke-width:12px;opacity:1}
#ring .facet-fill,#app[data-clarity="cloudy"] #ring .facet-fill{stroke:url(#ring-gradient);stroke-width:10px;opacity:1;filter:drop-shadow(0 0 6px rgba(31,138,128,.7));stroke-linecap:butt;transition:stroke-dasharray 350ms ease-out}
#ring .facet-hit{stroke-width:44px}
.pillar-meter{height:8px;border-radius:99px;background:#D8E4DB;overflow:hidden;margin:16px 0}
.pillar-meter span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1F8A80,#7FD6C8)}
.pillar-note{margin:22px 0 0;font-size:11px!important;color:#526C6D}
.detail .chip.option .tradeoff{display:block;margin-top:5px;font-size:13px;color:#395B60}
.section-options{display:flex;flex-direction:column;margin:4px 0 14px}
.section-option{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:64px;border:0;border-bottom:1px solid #D6DFD0;background:none;border-radius:0;padding:12px 2px;text-align:left;color:#0E3B43;font-size:14px}
.section-option>span:last-child{text-align:right;flex:none}
.section-option b{display:block;font-size:14px;font-weight:600;line-height:1.4}
.section-option small{display:block;max-width:245px;font-size:11px;line-height:1.5;color:#526C6D;margin-top:3px}
.section-option[aria-pressed="true"]{color:#126F62;background:rgba(127,214,200,.1)}
.section-option:disabled{cursor:default;opacity:.8}
@keyframes callout-pulse{50%{fill:#E8743B;stroke-width:4}}
@media(max-width:559px) and (min-width:480px){.callout-copy text{font-size:34px}.callout-copy .callout-status{font-size:31px}}
@media(max-width:479px){.callout-copy,.callout-leader{display:none}.callout-dot{r:11px;stroke-width:2}.scene{margin-top:10px}.score-context{font-size:10px}#score-intro{font-size:10px}.question-area{margin-top:20px}.section-option small{max-width:190px}}
@media(prefers-reduced-motion:reduce){.job-callout.pulse .callout-dot{animation:none!important}}
/* v11.1 — a shared hero scale, fixed scope and labels beyond the ring. */
:root{--ring-d:min(440px,calc(100vw - 40px));--hero-h:calc(var(--ring-d)*.64)}
.top{position:relative;top:auto}
.topbar-row{height:80px;display:flex;flex-direction:column;justify-content:center;gap:7px;padding:6px 42px}
.top .wordmark{display:block;max-width:none;white-space:nowrap;flex:none;text-align:center;font-size:15px;letter-spacing:.13em;line-height:20px}
.top .wordmark b{display:inline}
.top .stage-switch{position:static;left:auto;top:auto;transform:none;flex:none;margin:0}
.top .stage-switch button{font-size:12px;padding:5px 9px}
.top .more{position:absolute;right:0;top:7px}
.options-menu{top:46px}
.scene{height:var(--ring-d);margin:18px 0 0;padding:0;min-height:0}
.hero-wrap{margin:calc((var(--ring-d) - var(--hero-h))/2) 0 0;width:calc(var(--hero-h)*1244/1265);height:var(--hero-h);min-width:0}
#ring{width:var(--ring-d);height:var(--ring-d);left:50%;top:50%;transform:translate(-50%,-50%)}
#section-buttons.job-callouts{width:calc(var(--hero-h)*3324/1265);height:var(--hero-h)}
.callout-copy text{font-size:64px;stroke-width:8px}
.callout-copy .callout-status{font-size:50px}
.callout-leader{stroke:rgba(14,59,67,.68);stroke-width:1px}
.callout-dot{r:14px}
.zone-target{r:100px}
#ring .facet-outline{stroke:none;opacity:0}
#ring .facet-bed{stroke:#FFFCF7;stroke-width:10px;opacity:.15}
#ring .facet-fill,#app[data-clarity="cloudy"] #ring .facet-fill{stroke:url(#ring-gradient);opacity:1;filter:drop-shadow(0 0 8px rgba(31,138,128,.9));stroke-width:10px}
#ring .pillar-arc:focus-visible .facet-outline{stroke:#1F8A80;opacity:.75;stroke-width:14px}
.question-area{margin-top:20px}
@media(min-width:480px) and (max-width:759px){.callout-copy,.callout-leader{display:none}}
@media(max-width:479px){:root{--ring-d:calc(100vw - 40px)}.top .wordmark{font-size:15px;white-space:nowrap;max-width:none}.top .wordmark b{display:inline}.topbar-row{height:80px}.scene{margin-top:18px}.callout-copy,.callout-leader{display:none}.callout-dot{r:22px}.zone-target{r:130px}.question-area{margin-top:20px}}

/* v11.2: explicit HTML call-outs; sharp, floating glass; calm only. */
#callout-labels{position:absolute;inset:0;z-index:12;pointer-events:none;overflow:visible}
#callout-labels .external-callout{position:absolute;display:flex;align-items:center;gap:6px;width:116px;min-height:44px;height:auto;padding:4px 0;border:0;border-radius:0;background:none;color:#0E3B43;font:600 14px/1.35 Inter,sans-serif;text-shadow:0 1px 3px #FFFCF7;transform:translateY(-50%);pointer-events:auto;white-space:normal;box-shadow:none}
#callout-labels .external-callout.left{right:calc(50% + var(--ring-d)/2 + 12px);left:auto;justify-content:flex-end;text-align:right}
#callout-labels .external-callout.right{left:calc(50% + var(--ring-d)/2 + 12px);right:auto;text-align:left}
#callout-labels small{font-size:11px;flex-shrink:0;font-weight:500}
#callout-labels .done small{color:#0E6E66;font-size:16px}
#callout-leaders,#section-buttons.job-callouts{position:absolute;width:100%;height:100%;left:0;top:0;transform:none;overflow:visible;pointer-events:none}
#callout-leaders{z-index:10;fill:none;stroke:rgba(14,59,67,.65);stroke-width:1;vector-effect:non-scaling-stroke}
#callout-leaders path{vector-effect:non-scaling-stroke}
#section-buttons .job-callout{pointer-events:all}
#droplet-fallback{clip-path:url(#droplet-only-cutout)!important}
#rock-caustics,.rock-sparkles,#priced-pebbles,#ecology-creatures{display:none!important}
.rock-shadow{position:absolute;left:25%;top:91%;bottom:auto;width:50%;height:3%;background:rgba(31,138,128,.14);filter:blur(12px);box-shadow:none;transform:none}
#app.touch-depth .rock-shadow{background:rgba(31,138,128,.23)}
#app.calm .facet-fill{transition:stroke-dasharray 350ms ease-out!important}
#app.calm .question-change{animation:question-crossfade 220ms cubic-bezier(.22,1,.36,1)!important}
#app.calm .detail{animation:drawer-enter 250ms ease-out!important}
@keyframes question-crossfade{from{opacity:.25}to{opacity:1}}
@keyframes drawer-enter{from{opacity:0}to{opacity:1}}
@media(min-width:480px){:root{--ring-d:min(440px,calc(100vw - 260px));--hero-h:calc(var(--ring-d)*.88)}}
@media(max-width:479px){#callout-labels,#callout-leaders{display:none!important}}
@media(prefers-reduced-motion:reduce){#app.calm .question-change,#app.calm .detail{animation:none!important}#app.calm .facet-fill{transition:none!important}}

/* Landing: a quiet guide to all seven garden zones. */
#app.landing-callouts #callout-labels,#app.landing-callouts #callout-leaders{opacity:.6}

/* v11.4: zone markers stay teal, including hover/focus. */
#section-buttons .callout-dot,#section-buttons .job-callout:hover .callout-dot,#section-buttons .job-callout:focus-visible .callout-dot{fill:#1F8A80}
#app.landing-callouts .stage-switch{display:none!important}

/* Phone: names remain visible beside the glass, in the ring's outer space. */
@media(max-width:479px){
 #callout-labels,#callout-leaders{display:block!important}
 #callout-labels .external-callout{width:88px;min-height:44px;gap:3px;padding:4px 3px;border-radius:8px;font-size:12px;line-height:1.25;background:rgba(255,252,247,.88);text-shadow:none}
 #callout-labels .external-callout.left{right:calc(50% + var(--hero-h)*.4);left:auto}
 #callout-labels .external-callout.right{left:calc(50% + var(--hero-h)*.4);right:auto}
 #callout-labels .external-callout small{display:none}
 #callout-labels .external-callout.done small{display:inline;font-size:13px}
 #app.landing-callouts #callout-labels{opacity:.8}
 #section-buttons .callout-dot{r:14px}
}
@media(max-width:359px){#callout-labels .external-callout{width:78px;font-size:11px}}

/* v12.1: calmer droplet colour, standards box */
body #living,body .droplet-fallback{filter:saturate(.82) contrast(1.04)}
.standards-box{margin:14px 0 6px;padding:12px 14px;border:1px solid rgba(64,140,150,.35);border-radius:12px;background:rgba(64,140,150,.07);font-size:.86em}
.standards-box ul{margin:6px 0 0;padding-left:18px}
.technical-grid .est{color:#b7791f;font-weight:600}

/* v12.1: orange outer ring (Peter, 20 Oct) */
#ring .facet-fill,#app[data-clarity="cloudy"] #ring .facet-fill{filter:drop-shadow(0 0 8px rgba(224,102,31,.75))}
#ring .pillar-arc:focus-visible .facet-outline{stroke:#E0661F}
.pillar-arc:focus-visible .facet-outline{filter:drop-shadow(0 0 8px #E0661F)}

/* v12.2 job view */
.job-table{width:100%;border-collapse:collapse;font-size:.92em}
.job-table td,.job-table th{vertical-align:top;padding:10px 6px;border-bottom:1px solid #D6DFD0;text-align:left}
.job-table td:nth-child(2),.job-table td:nth-child(3),.job-table th:nth-child(2),.job-table th:nth-child(3){text-align:right;white-space:nowrap}
.job-table small{display:block;font-size:.85em;opacity:.8;margin-top:3px;white-space:normal}
.job-table .text-button{display:block;margin-left:auto;margin-top:4px}
.job-table .est,.review-cost-line .est{color:#b7791f}

/* v12.3 jobs from scratch */
.stack-form{display:grid;gap:12px;margin:14px 0}
.stack-form label{display:grid;gap:5px;font-size:.88em;font-weight:600}
.stack-form input{font:inherit;font-weight:400;padding:11px 12px;border:1px solid #C9D4C4;border-radius:10px;background:#FFFCF7;min-width:0}
.stack-form.inline{grid-template-columns:1fr auto;align-items:end}
@media (max-width:520px){.stack-form.inline{grid-template-columns:1fr}}
.target-bar{height:8px;border-radius:6px;background:rgba(31,138,128,.15);overflow:hidden;margin:8px 0 14px}
.target-bar span{display:block;height:100%;background:linear-gradient(90deg,#E0661F,#F7A55A)}
.job-actions{display:flex;flex-wrap:wrap;gap:6px 16px;margin:8px 0}
.quiet.danger{color:#B4441B}

/* v12.4.1: typed text was inheriting white – force dark ink in every box */
#detail input,#detail textarea,#detail select,.stack-form input,#edit-number,#brief{color:#0E3B43 !important;-webkit-text-fill-color:#0E3B43;caret-color:#E0661F;background-color:#FFFCF7}
#detail input::placeholder,#brief::placeholder{color:#6B7F7C;-webkit-text-fill-color:#6B7F7C;opacity:1}

/* v12.5 supplier catalogue */
.cat-filters{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 4px}
.cat-filters label{display:grid;gap:4px;font-size:.82em;font-weight:600;flex:1 1 160px}
.cat-filters select{font:inherit;font-weight:400;padding:9px 10px;border:1px solid #C9D4C4;border-radius:10px;background:#FFFCF7;color:#0E3B43}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-top:10px}
.cat-card{display:flex;flex-direction:column;align-items:stretch;text-align:left;gap:4px;padding:8px;border:1px solid #D6DFD0;border-radius:12px;background:#FFFCF7;color:#0E3B43;cursor:pointer;font:inherit}
.cat-card:hover,.cat-card:focus-visible{border-color:#E0661F;box-shadow:0 0 0 2px rgba(224,102,31,.25)}
.cat-img{display:block;aspect-ratio:1;border-radius:8px;overflow:hidden;background:linear-gradient(135deg,#E9E2D6,#D6DFD0)}
.cat-img img{width:100%;height:100%;object-fit:cover;display:block}
.cat-card b{font-size:.82em;font-weight:600;line-height:1.3}
.cat-card small{font-size:.78em;color:#4A6461}

/* v12.6: outer ring in elemental green #70AD47 (was orange) */
#ring .facet-fill,#app[data-clarity="cloudy"] #ring .facet-fill{filter:drop-shadow(0 0 8px rgba(112,173,71,.75))}
#ring .pillar-arc:focus-visible .facet-outline{stroke:#70AD47}
.pillar-arc:focus-visible .facet-outline{filter:drop-shadow(0 0 8px #70AD47)}

/* v12.7 labour & plant */
.lp-form h3{font-size:1em;margin:14px 0 6px}
.lp-rate{display:grid;gap:4px;font-size:.88em;font-weight:600;max-width:260px}
.lp-table{width:100%;border-collapse:collapse;font-size:.88em}
.lp-table td{padding:8px 4px;border-bottom:1px solid #D6DFD0;vertical-align:top}
.lp-table td small{display:block;opacity:.75}
.lp-table input,.lp-table select,.lp-rate input{font:inherit;width:100%;max-width:120px;padding:7px 8px;border:1px solid #C9D4C4;border-radius:8px;background:#FFFCF7;color:#0E3B43 !important;-webkit-text-fill-color:#0E3B43}
.lp-table.plant td:last-child{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:6px}
.lp-table.plant label{display:grid;gap:2px;font-size:.8em}
.lp-table select{max-width:none;margin-top:4px}

/* v12.7 site weather */
.weather-pill{border:1px solid rgba(14,59,67,.15);background:rgba(255,252,247,.85);color:#0E3B43;border-radius:999px;padding:4px 10px;font:inherit;font-size:12px;font-weight:600;cursor:pointer;margin-left:10px;white-space:nowrap}
.weather-pill .wx-warn{display:inline-block;width:16px;height:16px;line-height:16px;border-radius:50%;background:#E0661F;color:#fff;text-align:center;font-size:11px;margin-left:2px}
.wx-table{width:100%;border-collapse:collapse;font-size:.86em}
.wx-table th,.wx-table td{text-align:left;padding:7px 5px;border-bottom:1px solid #D6DFD0;vertical-align:top}
.wx-table tr.wx-flag td:last-child{color:#B4441B;font-weight:600}
@media (max-width:520px){.wx-table th:nth-child(2),.wx-table td:nth-child(2){display:none}}

/* v12.7.1: no boxes behind the section labels on the droplet (phone) */
#app .job-callout.external-callout,#app .job-callout.external-callout:hover,#app .job-callout.external-callout:focus-visible{background:transparent !important;box-shadow:none !important;border-color:transparent !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important}
#app .job-callout.external-callout span{text-shadow:0 0 6px rgba(255,252,247,.95),0 0 2px rgba(255,252,247,.9)}

/* v12.9 build-up drawing + haul panel */
.lz-section{margin:12px 0 16px;color:var(--ink,#1f2d2a)}
.lz-section svg{display:block;max-width:440px;height:auto}
.lz-section figcaption{font-size:12px;opacity:.75;margin-top:4px}
.haul-form{display:grid;grid-template-columns:1fr;gap:8px}
.haul-form label{display:flex;gap:8px;align-items:center;justify-content:space-between}
.haul-form input{width:80px}
.chip.selected{background:#0E5E5A;color:#fff;border-color:#0E5E5A}
.row-lines{margin-top:6px;font-size:13px}.row-lines summary{cursor:pointer;color:#0E5E5A;font-weight:600}.row-lines li{margin:4px 0}.row-lines li small{display:block;opacity:.7}.flag-note{background:#fff4e0;border-left:3px solid #d08a1a;padding:8px 10px;border-radius:6px;color:#5a3b00}
.recipe-form{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;margin-bottom:12px}.recipe-form label{display:flex;flex-direction:column;font-size:13px;gap:4px}.recipe-form label.chk{flex-direction:row;align-items:center;gap:8px}.recipe-form details{grid-column:1/-1}.recipe-form input,.recipe-form select{font-size:15px;padding:8px;border-radius:8px;border:1px solid #c9d6d2;color:#12312d;background:#fff}.recipe-table{width:100%}.recipe-table td{padding:8px 0;vertical-align:top;border-bottom:1px solid rgba(0,0,0,.08)}.recipe-table td:last-child{text-align:right;white-space:nowrap}@media(max-width:520px){.recipe-form{grid-template-columns:1fr}}
.recipe-form input,.recipe-form select{width:100%;min-width:0;box-sizing:border-box;max-width:100%}.recipe-form>label{min-width:0}
.wall-picker{grid-column:1/-1;background:#f1f7f5;border-radius:12px;padding:10px 12px}.wall-picker summary{font-weight:700;cursor:pointer;color:#0E5E5A}.wall-pick{border-top:1px solid rgba(0,0,0,.08);padding:8px 0;display:grid;gap:3px}.wall-pick small{opacity:.8}.wall-pick.on{background:#e3f1ec}.wall-pick .chip{justify-self:start}
.edit-extra{display:flex;flex-direction:column;gap:4px;font-size:13px;margin-top:8px;width:100%}
.variance-title{margin:1.4rem 0 .3rem;font-size:1rem}
.variance-table td.over{color:#b4532a}
.variance-table td.under{color:#2f7a55}
.variance-table tr.total td{border-top:2px solid currentColor}
.job-table tr.section-row td{padding-top:1.1rem;border-bottom:2px solid currentColor}
.job-table tr.section-row small{display:inline;margin-left:.5rem;opacity:.7}
.task-days{margin:1rem 0;padding:.8rem 1rem;border:1px solid currentColor;border-radius:12px}
.task-days .task-day{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin:.35rem 0}
.task-days .task-day span{flex:1;font-size:.92em}
.task-days .task-day input{width:5.5rem;text-align:right}
.edge-picker{grid-column:1/-1;background:#f1f7f5;border-radius:12px;padding:10px 12px}
.edge-picker summary{font-weight:600;cursor:pointer;color:#0E5E5A}
.edge-picker summary .edge-sum{font-weight:800}
.edge-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-top:10px}
.edge-card{display:grid;gap:4px;text-align:left;background:#fff;border:2px solid rgba(0,0,0,.08);border-radius:12px;padding:0 0 10px;cursor:pointer;font:inherit;color:inherit;overflow:hidden}
.edge-card img{width:100%;height:96px;object-fit:cover;display:block}
.edge-card .edge-swatch{width:100%;height:96px;display:block;opacity:.85}
.edge-card .edge-name{font-weight:700;padding:4px 10px 0;display:flex;align-items:center;gap:6px}
.edge-card .edge-dot{width:12px;height:12px;border-radius:50%;flex:none;border:1px solid rgba(0,0,0,.2)}
.edge-card .edge-sub{font-size:.82em;opacity:.8;padding:0 10px;line-height:1.35}
.edge-card.sel{border-color:#0E5E5A;background:#e3f1ec}
@media (max-width:480px){.edge-cards{grid-template-columns:1fr 1fr}.edge-card img,.edge-card .edge-swatch{height:72px}}
.save-receipt{background:#e3f1ec;color:#0E5E5A;font-weight:700;border-radius:10px;padding:.6rem .9rem;margin:0 0 .8rem}

/* v13.28 – visual element-of-work picker */
.kind-picker{grid-column:1/-1;display:block}
.kind-lede{font-weight:700;color:#0E5E5A;margin:.4rem 0 .1rem}
.kind-group-name{margin:.7rem 0 .35rem;font-size:.82em;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--kc,#0E5E5A)}
.kind-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.kind-card{display:flex;align-items:center;gap:9px;text-align:left;background:#fff;border:2px solid rgba(0,0,0,.08);border-left:4px solid var(--kc,#0E5E5A);border-radius:12px;padding:9px 10px;cursor:pointer;font:inherit;color:inherit;transition:transform .12s ease,box-shadow .12s ease}
.kind-card:hover,.kind-card:focus-visible{transform:translateY(-1px);box-shadow:0 4px 14px rgba(14,59,67,.14);border-color:var(--kc,#0E5E5A)}
.kind-ico{flex:none;width:30px;height:30px;color:var(--kc,#0E5E5A);background:color-mix(in srgb,var(--kc,#0E5E5A) 10%,#fff);border-radius:9px;display:grid;place-items:center}
.kind-ico svg{width:21px;height:21px;display:block}
.kind-txt{display:grid;gap:1px;min-width:0}
.kind-name{font-weight:700;font-size:.92em;line-height:1.15}
.kind-sub{font-size:.74em;opacity:.75;line-height:1.25}
@media (max-width:480px){.kind-cards{grid-template-columns:1fr 1fr}.kind-sub{display:none}.kind-card{padding:8px}}

/* v13.28 – the job as a sea-glass droplet */
.job-droplet{display:grid;justify-items:center;margin:.4rem 0 .6rem}
.job-droplet svg{width:min(190px,56vw);height:auto;display:block}
.job-droplet [data-pebble]{cursor:pointer}
.job-droplet [data-pebble]:hover ellipse:first-of-type,.job-droplet [data-pebble]:focus-visible ellipse:first-of-type{opacity:1}
.droplet-legend{display:flex;flex-wrap:wrap;gap:.4rem .9rem;justify-content:center;font-size:.76em;color:#0E3B43;margin:.35rem 0 0}
.droplet-legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:-1px}

/* v13.28 – "show the working" as a proper QS table */
details.workings{grid-column:1/-1;margin:.5rem 0 0;background:#f1f7f5;border-radius:12px;padding:8px 12px}
details.workings summary{font-weight:700;color:#0E5E5A;cursor:pointer}
.qs-wrap{overflow-x:auto;margin-top:6px}
.qs-table{width:100%;border-collapse:collapse;background:#fff;border-radius:10px;overflow:hidden;font-size:.86em}
.qs-table th,.qs-table td{padding:6px 8px;text-align:left;vertical-align:top;border-bottom:1px solid rgba(14,59,67,.08)}
.qs-table th.n,.qs-table td.n{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.qs-table thead th{background:#0E5E5A;color:#fff;font-size:.9em;letter-spacing:.03em}
.qs-table td small{display:block;opacity:.68;font-size:.84em;line-height:1.3}
.qs-table tr.qs-grp td{background:#E8F3F0;font-weight:800;color:#0E5E5A;border-top:2px solid rgba(14,94,90,.25)}
.qs-table tr.qs-est td:first-child{box-shadow:inset 3px 0 0 #D9A21B}
.qs-table tr.qs-note td{background:#FBF6E9;color:#6b5a1f;font-size:.86em;font-style:italic}
.qs-table tr.qs-total td{background:#0E3B43;color:#fff;font-weight:800}
@media (max-width:480px){.qs-table{font-size:.78em}.qs-table th,.qs-table td{padding:5px 6px}}
/* v13.28b – QS table fits a phone: fixed columns, numbers always visible */
.qs-table{table-layout:fixed}
.qs-table th:nth-child(1),.qs-table td:nth-child(1){width:38%}
.qs-table th:nth-child(2),.qs-table td:nth-child(2){width:11%}
.qs-table th:nth-child(3),.qs-table td:nth-child(3){width:12%}
.qs-table th:nth-child(4),.qs-table td:nth-child(4){width:19%}
.qs-table th:nth-child(5),.qs-table td:nth-child(5){width:20%}
.qs-table td:first-child{overflow-wrap:break-word}
@media (max-width:480px){details.workings{padding:8px 8px}.qs-wrap{margin:6px -4px 0}.qs-table{font-size:.74em}.qs-table th,.qs-table td{padding:4px 4px}}
/* v13.30 – surface by origin, back/start again, waste wording */
.origin-strip{display:flex;align-items:center;gap:6px;margin:.2rem 0 .6rem;font-size:.72em;letter-spacing:.06em;text-transform:uppercase;color:#395B60;width:100%}
.origin-strip span{white-space:nowrap}
.origin-strip i{flex:1;height:2px;background:linear-gradient(90deg,#5B8C3E,#E0A030);border-radius:2px;opacity:.7}
.origin-groups{display:grid;grid-template-columns:1fr;gap:8px;width:100%}
.chip.origin-chip{display:flex;flex-direction:column;align-items:flex-start;text-align:left;width:100%;padding:.7rem .9rem;border-left:4px solid #1F8A80}
.origin-groups .origin-chip:nth-child(2){border-left-color:#2F7A55}
.origin-groups .origin-chip:nth-child(3){border-left-color:#6E8B3D}
.origin-groups .origin-chip:nth-child(4){border-left-color:#B89A3A}
.origin-groups .origin-chip:nth-child(5){border-left-color:#C9822F}
.origin-groups .origin-chip:nth-child(6){border-left-color:#B5603A}
.origin-groups .origin-chip:nth-child(7){border-left-color:#8E8A84}
.chip.origin-chip small{font-weight:400;font-size:.8em;color:#395B60;margin-top:2px}
.origin-or{width:100%;margin:.8rem 0 .2rem;font-size:.78em;letter-spacing:.06em;text-transform:uppercase;color:#395B60}
.chip.quiet-chip{background:transparent;border-style:dashed}
.sb-head{margin:1rem 0 .4rem;font-size:1rem}
.sb-head small{font-weight:400;color:#395B60}
.nudge{background:#FFF4E5;border-left:4px solid #E0A030;padding:.5rem .75rem;border-radius:8px;font-size:.9em}
.chip.option .tradeoff.why{display:block;font-weight:400;font-size:.78em;opacity:.8;margin-top:2px}
#quiet-links{display:flex;flex-wrap:wrap;gap:.3rem 1rem}
.el-extra summary{cursor:pointer;color:#395B60;font-size:.9em;margin:.2rem 0 .4rem}
/* v13.31 – elemental questions */
.pillar-row.as-button{width:100%;text-align:left;background:none;border:0;border-bottom:1px solid rgba(14,59,67,.12);padding:.6rem 0;display:flex;justify-content:space-between;gap:.8rem;align-items:center;font:inherit;color:inherit;cursor:pointer}
.q-stage{margin:1.1rem 0 .3rem;font-size:.8em;letter-spacing:.06em;text-transform:uppercase;color:#395B60}
.q-row{padding:.55rem 0;border-bottom:1px solid rgba(14,59,67,.1)}
.q-text{margin:0 0 .35rem}.q-text small{display:block;color:#395B60;font-size:.8em;margin-top:2px}
.q-tag{display:inline-block;font-size:.68em;font-weight:600;letter-spacing:.03em;padding:1px 7px;border-radius:999px;background:#E7EFEE;color:#0E5E5A;vertical-align:1px}
.q-tag.price{background:#E3F1EA;color:#2F6D4E}.q-tag.practice{background:#ECE7F5;color:#5A4A86}.q-tag.you{background:#E5EEF6;color:#2F5D80}.q-tag.none{background:#F6ECE4;color:#8A5A3A}
.q-opts{display:flex;flex-wrap:wrap;gap:6px}
.q-opt{font:inherit;font-size:.82em;border:1px solid rgba(14,59,67,.25);background:#fff;border-radius:999px;padding:.32rem .7rem;cursor:pointer;color:#0E3B43;display:inline-flex;gap:6px;align-items:baseline}
.q-opt small{opacity:.65;font-size:.85em}
.q-opt.on{background:#0E5E5A;border-color:#0E5E5A;color:#fff}.q-opt.on small{opacity:.85}
.q-opt.clear{border-style:dashed;background:transparent}
.carbon-table td.n{white-space:nowrap}

/* v13.31 – Build and Handover are a prototype with sample figures; hidden until they run on real jobs */
.stage-switch{display:none!important}
/* v13.31 – workings table must never clip money on a phone */
.qs-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:480px){details.workings .qs-table{font-size:11px}details.workings .qs-table th,details.workings .qs-table td{padding:4px 3px}details.workings .qs-table th:nth-child(1){width:31%}details.workings .qs-table th:nth-child(2){width:13%}details.workings .qs-table th:nth-child(3){width:10%}details.workings .qs-table th:nth-child(4){width:22%}details.workings .qs-table th:nth-child(5){width:24%}details.workings .qs-table td small{font-size:10px}}
.task-days input.bad{border-color:#C0462B;background:#FFF1EE}
.check-list ul{margin:.2rem 0 0 1.1rem;padding:0}
#coach-strip{display:block;margin-top:.5rem}
#coach-strip .coach-chip small{display:block}

/* v13.33 – version label, top left, so Peter can see which release he is on */
#app-version{position:fixed;top:calc(8px + env(safe-area-inset-top));left:10px;z-index:40;font:600 10px/1.2 system-ui,sans-serif;letter-spacing:.04em;color:rgba(14,59,67,.75);background:rgba(255,255,255,.55);padding:3px 7px;border-radius:999px;pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
@media print{#app-version{display:none}}
