*{box-sizing:border-box}body{margin:0;font:14px/1.65 var(--font);color:#252725;background:#f5f5f5}button,input,select,textarea{font:inherit}a{color:inherit}button{cursor:pointer;touch-action:manipulation}button,input,select,textarea{border-radius:3px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #276fa9;outline-offset:3px}.demo{text-align:center;font-size:10px;padding:6px;background:#e7e7e3;color:#575756}main{max-width:1350px;margin:0 auto;display:grid;grid-template-columns:.75fr 1.25fr;min-height:calc(100vh - 132px)}aside{padding:48px 12% 45px 10%;position:sticky;top:0;align-self:start}.exit{font-size:11px;display:inline-block;margin-bottom:45px;text-decoration:none}.eyebrow{font-size:10px;letter-spacing:.14em;display:block;font-weight:600;margin-bottom:16px}h1,h2{font-weight:500;letter-spacing:-.045em;line-height:1.1;margin:0}h1{font-size:43px}h2{font-size:36px;margin:22px 0 18px}h3{font-size:17px;font-weight:500}p{color:#575756}aside>p{font-size:13px;margin:22px 0}ol{list-style:none;padding:0;counter-reset:stage;margin:30px 0}ol li{counter-increment:stage;font-size:12px;padding:12px 0;color:#575756}ol li:before{content:'0' counter(stage);margin-right:16px}ol li.current{color:#000;font-weight:600}ol li.current:before{color:#a74400}.snapshot{border-top:1px solid #d6d6d2;padding-top:24px;margin-top:25px}#snapshot{font-size:12px;line-height:2}.small{font-size:11px!important}.workspace{background:white;padding:48px 7%;min-width:0}.topline{display:flex;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:.12em;align-items:center}.topline button{border:0;background:none;font-size:11px;text-decoration:underline;color:#575756}progress{height:3px;display:block;width:100%;margin:20px 0 32px;appearance:none;border:0;background:#eee}progress::-webkit-progress-bar{background:#eee}progress::-webkit-progress-value{background:#ec6a08}progress::-moz-progress-bar{background:#ec6a08}.intro{font-size:13px;max-width:590px;margin-bottom:25px}.choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}.choices.single{grid-template-columns:1fr}.option{padding:21px 18px;background:white;border:1px solid #c8c8c3;text-align:left;min-height:95px;color:#252725}.option strong{display:block;font-size:14px;font-weight:600}.option small{display:block;font-size:11px;color:#575756;margin-top:7px}.option[aria-pressed=true]{border:2px solid #ec6a08;padding:20px 17px;background:#fff7ef}.option:hover{background:#fff8f1}.option .symbol{font-size:23px;margin-bottom:10px;display:block}.navigation{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:30px;border-top:1px solid #ddd;padding-top:25px}.navigation button,.primary,.secondary{padding:14px 22px;min-height:48px;border:1px solid #ccc;background:white;color:black;text-decoration:none;display:inline-block}.navigation .primary,.primary{background:#ec6a08;border-color:#ec6a08;font-weight:600;font-size:12px}.navigation button:disabled{opacity:.4;cursor:default}.help{margin-top:28px;font-size:11px;color:#575756}.help a{color:#252725}.error{color:#a3200c;font-size:12px}label{display:block;font-size:12px;font-weight:500;margin:18px 0 6px}input,select,textarea{display:block;width:100%;padding:13px;border:1px solid #a5a5a0;background:white;color:#252725;font-size:16px}input[type=checkbox]{width:18px;height:18px;margin:0;flex-shrink:0}.check{display:flex;gap:12px;align-items:start;font-size:12px;font-weight:400}.fields{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.notice{padding:16px;background:#f5f5f5;font-size:12px;color:#575756;border-left:3px solid #ec6a08;margin:20px 0}.stepper{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ddd;padding:16px 0;gap:15px}.stepper label{margin:0}.controls{display:flex;align-items:center;gap:12px}.controls button{height:40px;width:40px;border:1px solid #bbb;background:white;font-size:20px}.controls output{width:24px;text-align:center}.piece{border:1px solid #d6d6d2;padding:18px;margin:20px 0}.piece-head{display:flex;justify-content:space-between;align-items:center}.piece-head button{font-size:11px;border:0;background:none;text-decoration:underline}.diagram{width:100%;height:190px;background:#f5f5f5;margin:16px 0}.diagram path{fill:#eee2d6;stroke:#575756;stroke-width:2}.diagram text{font:14px var(--font);fill:#252725}.diagram .dim{fill:none;stroke:#575756;stroke-width:1;stroke-dasharray:4}.shape-buttons{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap}.shape-buttons button{border:1px solid #ccc;background:white;padding:8px 12px;font-size:11px}.shape-buttons .selected{border-color:#ec6a08;background:#fff1e5}.edge-drawing{height:42px;width:100px;display:block;margin-bottom:10px}.edge-drawing path{fill:#eee2d6;stroke:#575756;stroke-width:2}.result-amount{font-size:clamp(30px,4vw,46px);letter-spacing:-.05em;line-height:1.2;margin:20px 0}.result-box{padding:25px;background:#f5f5f5;border-top:3px solid #ec6a08}.result-box p{font-size:12px}.result-columns{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:22px 0}.result-columns ul{padding-left:18px;font-size:12px;color:#575756}.result-columns li{margin-bottom:9px}.result-actions{display:grid;gap:10px}.result-actions button{text-align:left}.terms{font-size:11px;color:#575756}.review-selections{border:1px solid #ddd;margin:20px 0;padding:14px}.review-selections summary{cursor:pointer;font-size:12px}.review-selections button{border:0;background:none;text-decoration:underline;font-size:12px;margin:8px}.state-preview{border-top:1px dashed #bbb;padding-top:20px;margin-top:30px;font-size:11px}.state-preview button{padding:8px 12px;margin:5px;border:1px solid #aaa;background:#f5f5f5;font-size:11px}dialog{max-width:440px;width:calc(100% - 30px);border:1px solid #bbb;padding:28px}dialog::backdrop{background:#0009}.spinner{width:28px;height:28px;border:3px solid #ddd;border-top-color:#ec6a08;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}[hidden]{display:none!important}#screen{animation:appear .18s ease}@keyframes appear{from{opacity:.5}to{opacity:1}}@media(max-width:760px){main{display:block}aside{position:static;padding:22px 6%}aside .exit{margin:0 0 15px}aside h1{font-size:27px}aside h1 br{display:none}aside>.eyebrow,aside>p,aside ol,aside .snapshot{display:none}.workspace{padding:25px 6% 40px;min-height:70vh}h2{font-size:31px}.option{padding:17px 14px}.option[aria-pressed=true]{padding:16px 13px}.choices{gap:10px}.option strong{font-size:13px}.result-columns{grid-template-columns:1fr;gap:0}.fields{gap:0 12px}.navigation{position:sticky;bottom:0;background:white;padding:15px 0;margin-top:25px}.navigation .primary{flex:1;text-align:center}.piece{padding:14px}.result-amount{font-size:34px}}@media(prefers-reduced-motion:reduce){#screen,.spinner{animation:none}html{scroll-behavior:auto}}

/* Interaction layer: tactile feedback, controlled motion and pointer light. */
:root{--ease-out:cubic-bezier(.2,.7,.2,1)}
#screen{animation:none}
.option{position:relative;isolation:isolate;overflow:hidden;transition:transform .24s var(--ease-out),box-shadow .24s var(--ease-out),border-color .2s,background-color .2s}
.option::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;background:radial-gradient(240px circle at var(--pointer-x,50%) var(--pointer-y,50%),#ec6a081b,transparent 75%);transition:opacity .3s}
.option strong{padding-right:22px}
.option[aria-pressed=true]::after{content:"✓";position:absolute;right:13px;top:13px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#ec6a08;color:#fff;font:600 12px var(--font)}
.option .symbol,.edge-drawing{transition:transform .25s var(--ease-out),color .25s}
.option.just-chosen::after{animation:selection-pop .28s var(--ease-out)}
@keyframes selection-pop{from{transform:scale(.4);opacity:.3}to{transform:scale(1);opacity:1}}
.primary,.secondary,.navigation button,.controls button,.shape-buttons button{position:relative;overflow:hidden;transition:transform .2s var(--ease-out),box-shadow .2s var(--ease-out),background-color .2s,border-color .2s}
.primary::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 25%,#ffffff38 49%,transparent 73%);transform:translateX(-125%);transition:transform .55s var(--ease-out)}
button:not(:disabled):active,a.primary:active,a.secondary:active{transform:scale(.985)}
input,textarea,select{transition:border-color .2s,box-shadow .2s,background-color .2s}
input:focus,textarea:focus,select:focus{border-color:#b95308;box-shadow:0 0 0 4px #ec6a0812;background:#fffdf9}
input[type=checkbox]{accent-color:#b95308}
progress::-webkit-progress-value{transition:width .35s var(--ease-out)}
ol li{transition:color .25s,transform .25s}ol li.current{transform:translateX(5px)}
.exit,.help a,
.piece:focus-within{border-color:#bf7a46}.diagram path:not(.dim){transition:fill .25s,stroke .25s}.piece:focus-within .diagram path:not(.dim){fill:#f6dcc5;stroke:#b95308}
.result-box{animation:result-arrive .45s var(--ease-out)}@keyframes result-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(hover:hover) and (pointer:fine){
.option:hover{transform:translateY(-3px);box-shadow:0 10px 24px #2527250c;border-color:#bb7540;background:#fffaf5}.option:hover::before{opacity:1}.option:hover .symbol{transform:translateX(4px);color:#b95308}.option:hover .edge-drawing{transform:translateX(4px)}
.primary:hover,.navigation .primary:hover{background:#d45d04;border-color:#d45d04;box-shadow:0 7px 18px #ad490027;transform:translateY(-2px)}.primary:hover::after{transform:translateX(125%)}
.secondary:hover,.navigation button:not(.primary):not(:disabled):hover,.controls button:hover,.shape-buttons button:hover{background:#fff4e9;border-color:#c97532;transform:translateY(-2px)}
.brand:hover span{letter-spacing:.045em;text-shadow:0 0 16px #ffffff8a}.exit:hover,.help a:hover{color:#a74400}.phone:hover{color:#ffb371}
}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.option:hover,.option:hover .symbol,.option:hover .edge-drawing,.primary:hover,.secondary:hover,.navigation button:hover,.controls button:hover,.shape-buttons button:hover,button:not(:disabled):active,ol li.current{transform:none!important}.primary::after{display:none}
}
.turnstile{margin:14px 0 4px;min-height:65px}

/* shared header on the planner (21/09/2026) */
body>header.site-header{background:linear-gradient(110deg,#050505 0%,#202020 65%,#3a3a39 100%);color:white;border-bottom:1px solid #ffffff25}
