@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap');
:root{--ink:#233c37;--muted:#667570;--paper:#f4f3eb;--line:#dce1d7;--green:#275848;--orange:#dc714e}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font:15px 'DM Sans',sans-serif}header{min-height:82px;display:flex;align-items:center;gap:24px;padding:16px 4.5%;border-bottom:1px solid var(--line)}a{color:inherit}button,input,select,textarea{font:inherit}button,a,summary,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;border-radius:7px;padding:12px 18px;font-weight:600}button:disabled{opacity:.5;cursor:wait}button:hover{filter:brightness(.95)}:focus-visible{outline:3px solid #bd593a;outline-offset:3px}.brand{display:flex;align-items:center;gap:12px;font-size:19px;font-weight:700;text-decoration:none}.brand-icon{font-size:36px;color:var(--green)}.header-note{margin-left:auto;color:var(--muted);font-size:13px}.quiet{background:transparent;border:1px solid var(--line)}main{max-width:1440px;margin:auto;padding:46px 4.5% 24px}.intro{display:flex;justify-content:space-between;gap:24px;align-items:center}.eyebrow{font-size:10px!important;letter-spacing:2px;font-weight:700;color:var(--green)!important;margin:0 0 14px!important}h1{font:48px/1.08 'Libre Caslon Display',Georgia,serif;letter-spacing:-.6px;margin:0 0 20px}h1 em{color:var(--green);font-weight:400}p{line-height:1.65;color:var(--muted)}.intro-stamp{text-align:center;font-size:11px;line-height:1.6;transform:rotate(7deg);border:1px solid #b9c9b8;border-radius:50%;width:156px;height:156px;padding:20px;flex-shrink:0}.intro-stamp strong{font:50px Georgia,serif}nav{display:flex;gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:28px 0}nav a{flex:1;text-decoration:none;padding:18px 10px;font-size:13px}nav b{display:inline-flex;align-items:center;justify-content:center;width:27px;height:27px;background:#e4e9de;border-radius:50%;margin-right:8px;font-size:10px}nav span{float:right}.workbench{display:grid;grid-template-columns:340px minmax(0,1fr);gap:24px;align-items:start}.panel{background:#fffefa;border:1px solid var(--line);border-radius:12px;padding:26px}h2{font:27px/1.15 'Libre Caslon Display',Georgia,serif;margin:0 0 12px}h3{font-size:16px;margin:0 0 16px}.spinner-panel>p{font-size:13px}.wheel-wrap{position:relative;max-width:280px;margin:26px auto}.wheel-wrap svg{width:100%;display:block;transition:transform 2.2s cubic-bezier(.16,.7,.12,1)}.pointer{position:absolute;left:calc(50% - 10px);top:-6px;border-left:10px solid transparent;border-right:10px solid transparent;border-top:22px solid var(--ink);z-index:2}.wheel-hub{position:absolute;inset:33%;background:#fffdf5;border:5px solid white;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:9px;letter-spacing:1px;box-shadow:0 3px 16px #203e3420}.wheel-hub strong{font:25px 'Libre Caslon Display',Georgia,serif;letter-spacing:0}.wheel-hub span{font-size:20px}.primary{background:var(--green);color:white}.secondary{background:#eaf0e5;color:var(--ink)}.full{width:100%}.small{font-size:11px!important}.centered{text-align:center;min-height:34px}.axis-picker{padding:18px 0;border-bottom:1px solid var(--line)}label{font-size:12px;font-weight:600}label>span{float:right;color:var(--muted);font-size:10px;font-weight:400}select,input:not([type=checkbox]),textarea{width:100%;border:1px solid #d8ded4;border-radius:6px;padding:11px 12px;color:var(--ink);background:#fffefa}select{margin-top:8px;font-size:12px}textarea{resize:vertical;line-height:1.5}input::placeholder,textarea::placeholder{color:#87918b;font-weight:400}.lock{display:flex;align-items:center;gap:7px;margin-top:10px;font-size:11px;font-weight:400}.lock input{accent-color:var(--green)}.tip{background:#eef1e8;border-radius:6px;padding:15px;font-size:12px!important}.spinner-panel summary{font-size:12px}summary{cursor:pointer;font-weight:600}ol{padding-left:23px;font-size:12px;line-height:1.9}.section-top{display:flex;justify-content:space-between;gap:12px}.save{font-size:10px;color:var(--muted);text-align:right;max-width:140px}.field{display:block;margin-top:16px}.field input,.field textarea{display:block;margin-top:7px;font-weight:400}.canvas-hint{font-size:12px;margin:23px 0 8px}.model{position:relative;padding:45px 59px;margin:6px -12px 14px}.quadrants{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative}.quadrants:before,.quadrants:after{content:'';position:absolute;background:#54675b;z-index:1;pointer-events:none}.quadrants:before{width:1px;top:-10px;bottom:-10px;left:50%}.quadrants:after{height:1px;left:-10px;right:-10px;top:50%}.quadrant{padding:15px;border-radius:7px;min-width:0;background:#eaf0e1}.quadrant:nth-child(2){background:#f6ecd7}.quadrant:nth-child(3){background:#e8eef0}.quadrant:nth-child(4){background:#f6e5df}.quadrant .combo{display:block;min-height:30px;font-size:10px;line-height:1.4;color:#52665c;margin-bottom:6px}.quadrant input,.quadrant textarea{border:0;background:#ffffff65;padding:8px;margin:4px 0}.quadrant input{font-weight:600;font-size:13px}.quadrant textarea{font-size:12px;min-height:104px}.pole{position:absolute;font-weight:700;font-size:11px;text-align:center;line-height:1.2;overflow-wrap:anywhere}.top,.bottom{left:25%;right:25%}.top{top:12px}.bottom{bottom:11px}.left,.right{top:50%;transform:translateY(-50%);width:55px}.left{left:0}.right{right:0}.origin{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;background:var(--ink);color:white;width:23px;height:23px;text-align:center;line-height:23px;z-index:2}.movement{border-top:1px solid var(--line);padding-top:20px}.route{display:flex;align-items:end;gap:12px}.route .field{flex:1;min-width:0;margin:0}.route>span{padding-bottom:10px}.export-panel{margin-top:24px;display:grid;grid-template-columns:1fr 1fr;gap:32px;background:#eaf0e5}.export-panel p{font-size:13px}.export-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.export-actions button{font-size:12px}.prompt-details{padding:18px;background:#fffefa;border:1px solid var(--line);border-radius:8px;align-self:start}.prompt-details summary{font-size:13px}.prompt-details summary span{float:right}.prompt-details textarea{margin-top:16px;font-size:12px}footer{display:flex;justify-content:space-between;gap:20px;font-size:10px;color:var(--muted);padding:25px 0}dialog{border:1px solid var(--line);border-radius:12px;padding:28px;max-width:480px}dialog::backdrop{background:#182e2866}@media(min-width:1400px){h1{font-size:56px}}@media(max-width:1000px){.workbench{grid-template-columns:290px minmax(0,1fr);gap:16px}.panel{padding:20px}.model{padding:45px 39px}.left,.right{width:36px;font-size:10px}.quadrant{padding:9px}.header-note{display:none}.brand{margin-right:auto}}@media(max-width:760px){main{padding:28px 16px}.intro-stamp{display:none}h1{font-size:39px}.desktop{display:none}nav a{font-size:11px;padding:14px 5px}nav b{display:block;margin-bottom:8px}.workbench,.export-panel{grid-template-columns:1fr}.wheel-wrap{max-width:235px}.section-top{gap:8px}.panel{padding:20px}.export-panel{gap:14px}header{padding:12px 16px}.brand{font-size:15px}.brand-icon{font-size:28px}header button{font-size:11px;padding:10px}footer{display:block;line-height:2}footer span{display:block}.quadrant textarea{min-height:125px}.model{margin-left:-10px;margin-right:-10px}.route{gap:6px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.wheel-wrap svg{transition:none}}@media print{header,nav,.intro,.spinner-panel,.export-panel,footer,.save,.canvas-hint{display:none}body,main{background:white;padding:0}.workbench{display:block}.canvas-panel{border:0}.model{break-inside:avoid}textarea{height:auto;overflow:visible}.quadrant,.panel{-webkit-print-color-adjust:exact;print-color-adjust:exact}button{display:none}}

/* Room for complete axis words: labels sit in a dedicated middle band. */
.model{padding:48px 0;margin:10px 0 20px}.quadrants{column-gap:14px;row-gap:72px}.quadrants:after{left:0;right:0}.quadrants:before{top:-10px;bottom:-10px}.pole{overflow-wrap:normal;word-break:normal;hyphens:none;font-size:12px;z-index:2}.left,.right{width:calc(50% - 22px);top:50%;transform:translateY(-50%);background:#fffefa;padding:5px 8px;line-height:1.35}.left{left:0;text-align:left}.right{right:0;text-align:right}.top,.bottom{left:10%;right:10%}.archetype-help{background:#f2f4ec;padding:17px;border-radius:8px;margin:20px 0}.archetype-help h3{margin:0 0 8px}.archetype-help p,.movement>p{font-size:12px;margin:6px 0}.archetype-help p:last-child{margin-bottom:0}.profile-legend{display:flex;gap:24px;justify-content:center;font-size:13px;font-weight:700;margin:22px 0 10px}.ist-key{color:#24628c}.soll-key{color:#ab4d23}.profile-chart{position:relative;max-width:460px;margin:16px auto;padding:46px 0}.profile-chart svg{width:100%;display:block;background:conic-gradient(from 0deg,#f6ecd780 0 25%,#f6e5df80 25% 50%,#e8eef080 50% 75%,#eaf0e180 75%);border-radius:8px}.profile-corner{position:absolute;width:47%;font-size:12px;font-weight:600;line-height:1.35;overflow-wrap:anywhere}.corner-0{top:5px;left:0}.corner-1{top:5px;right:0;text-align:right}.corner-2{bottom:5px;left:0}.corner-3{bottom:5px;right:0;text-align:right}.profile-control{border-top:1px solid var(--line);padding:14px 0}.profile-control h4{font-size:12px;margin:0 0 10px}.profile-sliders{display:grid;grid-template-columns:1fr 1fr;gap:22px}.profile-sliders label{display:block;font-size:11px}.profile-sliders input[type=range]{width:100%;padding:0;margin-top:10px;accent-color:#24628c}.profile-sliders .soll-range{accent-color:#ab4d23!important}.profile-sliders output{float:right;font-variant-numeric:tabular-nums}.route{margin-top:16px}[hidden]{display:none!important}@media(max-width:760px){.pole{font-size:11px}.quadrant{padding:10px}.profile-sliders{gap:15px}.quadrant input{font-size:12px}.model{padding:48px 0}.left,.right{width:calc(50% - 16px);padding:4px}}@media print{.profile-chart,.profile-control{break-inside:avoid}.profile-chart{max-width:360px}.archetype-help{display:none}}
/* Keep the horizontal axis visible beneath its endpoint labels. */
.left,.right{top:calc(50% - 5px);transform:translateY(-100%);background:transparent;padding-bottom:3px}