:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#111110;color:#f4f4ed;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button{border:1px solid #555;background:transparent;color:inherit;padding:13px 18px;min-height:46px}button:hover{background:#ffffff15}button:disabled{opacity:.25;cursor:default}:focus-visible{outline:3px solid #fff;outline-offset:5px}header{height:112px;display:flex;align-items:center;justify-content:space-between;margin:0 4%;border-bottom:1px solid #444;gap:30px}.brand{font-size:46px;font-weight:950;letter-spacing:-4px}.brand span{font-size:15px;vertical-align:top;letter-spacing:0;display:inline-block;margin:9px 0 0 7px}nav{display:flex;gap:8px}nav a{padding:15px 22px;font-size:14px;font-weight:bold;letter-spacing:1px;border-radius:40px}nav a.active{background:#f1f0e8;color:#111}#count{font-size:12px;margin-left:5px}.local,footer,.eyebrow,.meta,.tag{font-family:monospace;font-size:13px;letter-spacing:1px}.local{color:#aaa}main{padding:46px 4% 70px;min-height:calc(100vh - 192px)}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:12px 0 38px}.eyebrow{color:#aaa;margin-bottom:18px}.page-heading h1{font-size:clamp(56px,7.2vw,108px);letter-spacing:-.065em;line-height:.95;margin:0;font-weight:900}.page-heading p{color:#aaa;font-size:16px;margin:22px 0 0}.primary{background:#e7fa5a;color:#111;border:0;font-size:14px;font-weight:800;letter-spacing:1px}.primary:hover{background:#f1ff9e}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.project{aspect-ratio:1;min-height:285px;background:var(--color);color:#101010;padding:24px;display:flex;flex-direction:column;transition:transform .18s}.project:hover{transform:translateY(-5px)}.project-top{display:flex;justify-content:space-between;align-items:center}.project h2{font-size:clamp(28px,3.2vw,54px);line-height:.96;letter-spacing:-.055em;overflow-wrap:anywhere;margin:35px 0 14px;font-weight:900}.project-note{font-size:14px;line-height:1.5;max-width:220px;margin:0 0 26px}.project-bottom{margin-top:auto}.project .next{font-size:15px;line-height:1.4;margin:10px 0 17px;min-height:40px}.bar{height:3px;background:#0002}.bar span{display:block;height:100%;background:#111}.project .meta{font-size:12px}.index{font-size:14px}.arrow{font-size:24px}.overview-bottom{display:flex;justify-content:space-between;border-top:1px solid #444;margin-top:32px;padding-top:18px;color:#999;font-size:13px}.back{display:inline-block;color:#aaa;font-size:14px;margin-bottom:26px}.milestones{display:grid;gap:15px}.milestone{display:flex;align-items:center;gap:24px;border:1px solid #444;padding:28px;min-height:128px}.milestone.current{background:var(--color);color:#111;border-color:var(--color)}.milestone>a{flex:1}.milestone h2{font-size:30px;letter-spacing:-1px;margin:8px 0}.milestone .number{font-size:35px;font-weight:bold;color:inherit;opacity:.55}.milestone.finished{opacity:.5}.actions{display:flex;gap:8px;align-items:center}.small{font-size:13px;padding:10px 13px}.steps{display:grid;gap:12px;max-width:1100px}.step{padding:24px;border:1px solid #454543;display:flex;gap:20px;align-items:center}.step.focus{background:var(--color);border-color:var(--color);color:#111;padding:32px 24px}.step.done{opacity:.5}.step.done h2{text-decoration:line-through}.step-body{flex:1;min-width:0}.step h2{font-size:23px;line-height:1.2;margin:10px 0;letter-spacing:-.5px;overflow-wrap:anywhere}.step.focus h2{font-size:32px}.step p{font-size:15px;line-height:1.5;white-space:pre-wrap}.check{width:50px;height:50px;flex-shrink:0;border:2px solid currentColor;padding:0;font-size:24px;border-radius:50%}.tag{font-size:12px;font-weight:bold}.step .meta{font-size:12px;line-height:1.8}.step-tools{display:flex;gap:5px}.step-tools button{padding:10px;min-width:42px}.later-heading{font-size:13px;color:#aaa;letter-spacing:2px;margin:34px 0 6px}.empty{padding:45px;border:1px dashed #777;font-size:20px}.now-list{display:grid;gap:16px}.now-list .step{min-height:145px}.now-list .step h2{font-size:clamp(24px,3vw,38px)}footer{margin:0 4%;border-top:1px solid #444;display:flex;justify-content:space-between;padding:25px 0;color:#999}dialog{border:1px solid #666;background:#191918;color:#f4f4ed;padding:30px;width:min(560px,92vw);max-height:90vh}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;font:13px monospace}.dialog-top button{border:0}dialog h2{font-size:36px;letter-spacing:-1px;margin:15px 0 24px}label{display:flex;flex-direction:column;gap:8px;font-size:14px;margin-bottom:18px}input,textarea,select{width:100%;background:#282827;border:1px solid #666;border-radius:0;color:#fff;padding:12px;min-width:0}.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.hint{font-size:13px;color:#aaa;line-height:1.5}form>.primary{width:100%;margin-top:12px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#f3f3eb;color:#111;padding:14px 24px;display:none;box-shadow:0 8px 40px #0008;z-index:10}#toast.show{display:block}.heading-actions{display:flex;gap:8px}.detail-note{max-width:650px;line-height:1.5}.project-meta{margin-bottom:20px;color:#aaa;font-size:14px}@media(min-width:1600px){main,header,footer{max-width:1600px;margin-left:auto;margin-right:auto}}@media(max-width:1100px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project h2{font-size:52px}.local{display:none}.project{min-height:320px}.step-tools{flex-wrap:wrap;max-width:94px}}@media(max-width:600px){header{height:88px;gap:12px}.brand{font-size:34px;letter-spacing:-3px}.brand span{font-size:10px}nav a{font-size:11px;padding:12px 10px;letter-spacing:0}main{padding-top:30px}.page-heading{align-items:flex-start;flex-direction:column;gap:24px}.page-heading h1{font-size:58px}.grid{grid-template-columns:1fr}.project{min-height:330px}.project h2{font-size:62px}.project-note{max-width:none}.project .next{min-height:0}.milestone{padding:20px;gap:14px;flex-wrap:wrap}.milestone h2{font-size:26px}.milestone .actions{margin-left:auto}.step,.step.focus{padding:20px 15px;gap:14px;flex-wrap:wrap}.step h2,.step.focus h2{font-size:25px}.step-body{min-width:65%}.step-tools{max-width:none;width:100%;justify-content:flex-end}.check{width:42px;height:42px}.fields{grid-template-columns:1fr}footer{font-size:10px;gap:10px}.overview-bottom{font-size:11px}.heading-actions{flex-wrap:wrap}}
.project{width:100%;min-width:0;aspect-ratio:1;min-height:340px}.project h2{font-size:clamp(26px,2.6vw,48px)}@media(max-width:1100px){.project h2{font-size:clamp(32px,5vw,54px)}}@media(max-width:600px){.project h2{font-size:clamp(32px,9vw,58px)}}
/* Project structure: compact actions feed into a full-width milestone goal. */
.structure-toolbar{display:flex;align-items:center;gap:10px;border-top:1px solid #444;padding:22px 0 30px}.structure-toolbar>div{flex:1}.structure-toolbar p{color:#aaa;margin:8px 0 0;font-size:15px}.structure-toolbar button{font-size:12px}.project-tree{max-width:1200px}.stage{position:relative;padding-left:40px;padding-bottom:42px}.stage:before{content:'';position:absolute;left:17px;top:28px;bottom:0;width:2px;background:#454541}.stage:last-child:before{bottom:90px}.stage-top{display:flex;align-items:center;gap:12px;font:13px monospace;letter-spacing:1px;margin-bottom:10px;color:#aaa;min-height:44px}.disclosure{position:absolute;left:0;background:#111110;width:36px;min-height:36px;height:36px;padding:0;border-color:#666;font-size:24px;z-index:1}.stage-count{margin-left:auto;font-size:12px}.branch{margin-left:22px;border-left:1px solid #454541;padding-left:20px}.branch[hidden]{display:none}.tree-step{display:flex;align-items:center;gap:14px;padding:15px 18px;background:#1c1c1a;border:1px solid #373735;position:relative;min-height:88px}.tree-step:before{content:'';position:absolute;left:-21px;width:20px;height:1px;background:#555}.tree-now{border-color:var(--color);box-shadow:inset 4px 0 var(--color)}.tree-now .step-type{color:var(--color)}.tree-done .step-title{text-decoration:line-through;color:#888}.tree-done .step-type{color:#777}.drag-handle{padding:0;min-width:24px;min-height:44px;border:0;color:#888;font-size:28px;cursor:grab}.drag-handle:active{cursor:grabbing}.tree-check{width:28px;height:28px;min-height:28px;padding:0;border:1px solid #888;border-radius:50%;flex-shrink:0}.tree-step-content{flex:1;min-width:0}.step-type{display:block;color:#999;font:12px monospace;letter-spacing:1px;margin-bottom:6px}.step-title{display:block;text-align:left;border:0;padding:0;min-height:28px;font-size:18px;font-weight:600;line-height:1.35;overflow-wrap:anywhere}.tree-step-content p{font-size:14px;color:#aaa;margin:8px 0;line-height:1.5}.step-date{font-size:12px;color:#aaa}.tree-step-actions{display:flex;align-items:center;gap:5px}.tree-step-actions>button{padding:8px;min-width:36px;border:0;color:#aaa}.move-control{margin:0;gap:3px;width:130px}.move-control>span{font-size:11px;color:#aaa}.move-control select{font-size:12px;padding:7px;background:#222;min-height:36px}.drop-slot{height:12px;position:relative;transition:height .12s}.drop-slot span{display:none;font:12px monospace;padding:10px}.is-dragging .drop-slot{height:40px;border:1px dashed #666;margin:3px 0}.is-dragging .drop-slot span{display:block;color:#aaa}.drop-active{background:#e7fa5a22!important;outline:2px solid var(--color);outline-offset:-2px}.add-tree-step{border:0;color:#aaa;font:12px monospace;margin-bottom:14px}.milestone-goal{position:relative;display:flex;align-items:center;gap:20px;background:var(--color);color:#111;padding:26px 28px;min-height:132px}.milestone-goal:before{content:'';position:absolute;left:-23px;width:23px;height:2px;background:var(--color)}.goal-symbol{font-size:30px}.goal-content{flex:1;min-width:0}.goal-content h2{font-size:clamp(25px,3vw,40px);line-height:1.1;letter-spacing:-1px;margin:10px 0 0;overflow-wrap:anywhere}.goal-content p{font-size:15px;margin:10px 0 0}.goal-actions{display:flex;gap:8px}.goal-actions button{border-color:#0005;font-size:12px;font-weight:bold}.collapsed-summary{display:block;font-size:13px;margin-top:12px}.stage-done .milestone-goal{background:#292a25;color:#b8bcaa}.stage-done .goal-actions button{border-color:#777}.stage-done .milestone-goal:before{background:#777}@media(max-width:750px){.structure-toolbar{flex-wrap:wrap}.structure-toolbar>div{flex-basis:100%;margin-bottom:10px}.stage{padding-left:28px}.stage:before{left:12px}.disclosure{width:26px}.stage-count{font-size:10px;letter-spacing:0}.branch{margin-left:0;padding-left:12px}.tree-step{padding:12px 10px;gap:9px;flex-wrap:wrap}.tree-step:before{left:-13px;width:12px}.tree-step-content{flex-basis:65%}.tree-step-actions{width:100%;justify-content:flex-end}.step-title{font-size:16px}.milestone-goal{padding:20px 16px;gap:12px;flex-wrap:wrap}.milestone-goal:before{left:-16px;width:16px}.goal-content{flex-basis:70%}.goal-actions{margin-left:auto}.goal-symbol{font-size:22px}.goal-content .tag{font-size:11px}.move-control{width:150px}.stage{padding-bottom:28px}}
.drag-handle{touch-action:none;user-select:none}.is-dragging{user-select:none;cursor:grabbing}.is-dragging .tree-step{cursor:grabbing}
/* Etappen behalten ihren Namen und Projektfarbton auch über langen Listen. */
.stage-top{position:relative;margin-left:-40px;padding:12px 18px 12px 10px;gap:14px;color:var(--color);background:color-mix(in srgb,var(--color) 13%,#111110);border:1px solid color-mix(in srgb,var(--color) 28%,#111110);min-height:62px;letter-spacing:.5px}.stage-top .disclosure{position:static;flex:0 0 36px;background:color-mix(in srgb,var(--color) 12%,transparent);border-color:color-mix(in srgb,var(--color) 40%,transparent);color:var(--color);min-height:36px}.stage-label{flex:1;line-height:1.5;min-width:0}.stage-label strong{font-family:Arial,Helvetica,sans-serif;font-size:16px;letter-spacing:0;overflow-wrap:anywhere}.stage-divider{opacity:.6;margin:0 9px}.stage-top .stage-count{color:var(--color);opacity:.85;white-space:nowrap}.project-tile{min-width:0;display:flex;flex-direction:column}.project-tile .project{flex:1}.project-order{display:flex;align-items:center;gap:6px;padding:10px 0;color:#aaa}.project-order>span{flex:1;font:12px monospace;letter-spacing:1px}.project-order button{padding:6px 12px;min-width:44px;min-height:44px;font-size:20px;border-color:#444}.project-tile .project:focus-visible{outline-offset:-5px;outline-color:#111}#project-colors{padding:0;border:0;margin:0 0 24px}#project-colors[hidden]{display:none}#project-colors legend{font-size:14px;margin-bottom:12px}.color-options{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.color-option{position:relative;margin:0;cursor:pointer;font-size:12px;gap:8px}.color-option input{position:absolute;width:1px;height:1px;opacity:0;padding:0;min-height:0}.swatch{height:42px;background:var(--swatch);display:block;border:3px solid transparent;position:relative}.color-option input:checked+.swatch{outline:2px solid var(--swatch);outline-offset:3px;border-color:#191918}.color-option input:checked+.swatch:after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:#111;font-size:22px;font-weight:bold}.color-option input:focus-visible+.swatch{outline:3px solid white;outline-offset:4px}dialog .primary{background:var(--editor-color,#e7fa5a)}.tree-check:hover,.tree-check:focus-visible{border-color:var(--color);color:var(--color)}@media(max-width:750px){.stage-top{margin-left:-28px;flex-wrap:wrap;padding:10px;gap:10px}.stage-top .stage-count{margin-left:46px;width:calc(100% - 46px);font-size:11px}.stage-label{font-size:12px}.stage-label strong{font-size:15px}.stage-divider{margin:0 5px}}
#app .primary{background:var(--accent,#e7fa5a)}#app .primary:hover{filter:brightness(1.08)}
[hidden]{display:none!important}
.project-view .page-heading h1{color:var(--accent)}
.milestone-goal{background:color-mix(in srgb,var(--color) 28%,#111110);color:var(--color);border:1px solid color-mix(in srgb,var(--color) 45%,#111110)}.goal-actions button{border-color:color-mix(in srgb,var(--color) 40%,transparent);color:var(--color)}.stage-done .milestone-goal{background:color-mix(in srgb,var(--color) 12%,#111110);color:var(--color)}
.color-options{grid-template-columns:repeat(8,minmax(0,1fr));gap:5px;max-width:400px}.color-option{min-height:40px;display:grid;place-items:center}.color-option>span:last-child{display:none}.swatch{width:27px;height:27px;border-radius:50%;border:2px solid transparent}.color-option input:checked+.swatch:after{font-size:16px}.color-option input:checked+.swatch{outline-offset:2px}.project-tile{position:relative}.project-grip{position:absolute;z-index:2;right:50px;top:14px;font-size:25px;color:#1119;border:0;padding:0;width:40px;height:44px;cursor:grab;touch-action:none}.project-grip:hover{background:#0001;color:#111}.project-tile .project{transition:none;user-select:none}.project-tile .project:hover{transform:none}.project-dragging{opacity:.5;cursor:grabbing}.project-drop{outline:3px solid var(--color);outline-offset:6px}.project-drop .project{box-shadow:inset 0 0 0 4px #111}.project-order{display:none}#toast{max-width:min(600px,90vw);line-height:1.5}
/* A shared content edge and one quiet surface for each stage and its goal. */
.project-tree{max-width:none;width:100%}.stage:before,.milestone-goal:before,.stage-done .milestone-goal:before{background:var(--color)}
.milestone-goal,.stage-done .milestone-goal{background:color-mix(in srgb,var(--color) 13%,#111110);border-color:color-mix(in srgb,var(--color) 28%,#111110)}
.mode-toggle{font:12px monospace;letter-spacing:1px;border-radius:24px;padding:10px 15px;min-height:44px;color:#aaa}.mode-toggle[aria-pressed="true"]{color:#111;background:#ddd;border-color:#ddd}.project-tile .project{touch-action:pan-y}.project-dragging .project{cursor:grabbing}
.monochrome{background:#111;color:#eee}.monochrome body{background:#111}.monochrome [style*="--color"]{--color:#d5d5d5!important}.monochrome #app{--accent:#d5d5d5!important}.monochrome dialog{--editor-color:#d5d5d5!important;background:#191919;color:#eee}.monochrome .color-options{filter:grayscale(1)}.monochrome .drop-active{background:#ffffff22!important}.monochrome .stage-top,.monochrome .milestone-goal{background:#2a2a2a}.monochrome nav a.active{background:#e5e5e5}.monochrome #toast{background:#eee}.monochrome .tree-step{background:#1c1c1c}.monochrome .disclosure{background:#292929}.monochrome .tree-done .step-title{color:#888}
@media(max-width:600px){header{height:auto;min-height:88px;flex-wrap:wrap;padding:18px 0;gap:12px}header .brand{margin-right:auto}header nav{order:3;width:100%}header nav a{flex:1;text-align:center}.mode-toggle{font-size:11px;padding:8px 12px}}
.monochrome .branch{border-left-color:#454545}.monochrome .tree-step{border-color:#373737}.monochrome .tree-now{border-color:#d5d5d5}.monochrome .tree-step:before{background:#555}
/* Milestone connectors share the exact quiet tone of the stage borders. */
.stage:before,.milestone-goal:before,.stage-done .milestone-goal:before{background:color-mix(in srgb,var(--color) 28%,#111110)}
.monochrome .project-tile .project{background:#111;color:#ccc;border:1px solid #555}.monochrome .project .bar{background:#333}.monochrome .project .bar span{background:#aaa}.monochrome .project-tile .project:focus-visible{outline-color:#ddd}.monochrome .project-drop .project{box-shadow:inset 0 0 0 2px #aaa}
.uppercase-input{text-transform:uppercase}.project-target{font-size:13px;line-height:1.5;font-weight:400;letter-spacing:0;margin:0 0 18px;opacity:.75}.detail-target{font-size:15px;color:#aaa;opacity:1;margin:-12px 0 30px}.detail-target span{color:#888}.project .project-target{border-top:1px solid currentColor;padding-top:10px;border-color:#0003}.monochrome .project .project-target{border-color:#444}
/* Card typography follows its own width; content may grow instead of overflowing. */
.project-tile{container-type:inline-size}.project-tile .project{aspect-ratio:auto;min-height:max(340px,100cqi)}.project h2{font-size:var(--title-size,clamp(24px,12cqi,48px));min-height:var(--title-line,1em);line-height:1.05;overflow-wrap:anywhere;flex-shrink:0}.project .project-top,.project .project-note,.project .project-bottom{flex-shrink:0}
dialog form>.primary:hover,dialog form>.primary:focus-visible{background:var(--editor-color,#e7fa5a);color:#111;box-shadow:inset 0 0 0 2px #111,0 0 0 2px var(--editor-color,#e7fa5a);filter:none}
.monochrome .project-tile .project{background:#d5d5d5;color:#111;border:1px solid #d5d5d5}.monochrome .project .bar{background:#0002}.monochrome .project .bar span{background:#111}.monochrome .project .project-target{border-color:#0003}.monochrome .project-tile .project:focus-visible{outline-color:#111}.monochrome .project-drop .project{box-shadow:inset 0 0 0 3px #111}
/* Neutral milestone surfaces; only stage headings retain the tinted fill. */
.milestone-goal,.stage-done .milestone-goal{background:#1c1c1a;color:var(--color)}
.monochrome .milestone-goal,.monochrome .stage-done .milestone-goal{background:#1c1c1c}
/* Full-width sticky navigation, with controls aligned to the page gutters. */
header{position:sticky;top:0;z-index:20;width:100%;max-width:none;margin:0;padding:0 4%;background:#111110;border-bottom:1px solid #444}
.monochrome header{background:#111}
html{scroll-padding-top:130px}
@media(min-width:1600px){header{padding-left:calc((100% - 1600px)/2 + 4%);padding-right:calc((100% - 1600px)/2 + 4%)}}
@media(max-width:600px){header{padding:18px 4%}html{scroll-padding-top:160px}}
.stage-collapsed{padding-bottom:12px}.stage-collapsed .stage-top{margin-bottom:0}.stage-collapsed:last-child:before{display:none}
.focus-card{container-type:inline-size;display:flex;flex-direction:column;min-width:0;background:var(--color);color:#111;padding:24px;min-height:350px;text-decoration:none;border:1px solid transparent}.focus-project{font-size:20px;font-weight:800;letter-spacing:-.5px;overflow-wrap:anywhere;line-height:1.15;border-bottom:1px solid #0003;padding-bottom:18px;margin-bottom:28px}.focus-type{font:12px monospace;letter-spacing:1px}.focus-card h2{font-size:clamp(26px,12cqi,40px);letter-spacing:-1px;line-height:1.08;margin:12px 0 28px;overflow-wrap:anywhere}.focus-bottom{margin-top:auto;border-top:1px solid #0003;padding-top:14px}.focus-bottom p{font-size:14px;font-weight:600;margin:0 0 8px;line-height:1.4}.focus-bottom span{font:12px monospace;opacity:.75}.focus-card:hover{box-shadow:inset 0 0 0 2px #111}.focus-card:focus-visible{outline:3px solid white;outline-offset:4px}.empty-link{font-size:16px;text-decoration:underline}.stage{scroll-margin-top:130px}header{background:rgba(17,17,16,.78);backdrop-filter:blur(18px) saturate(.7);-webkit-backdrop-filter:blur(18px) saturate(.7)}.monochrome header{background:rgba(17,17,17,.78)}@media(max-width:600px){.stage{scroll-margin-top:160px}.focus-card{min-height:330px}.focus-project{font-size:22px}}
.stage{scroll-margin-top:12px}
.focus-card h2{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}.focus-grid{grid-template-columns:repeat(3,minmax(0,1fr))}@media(min-width:1450px){.focus-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:950px){.focus-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.focus-grid{grid-template-columns:1fr}}
nav a{color:#888;border-radius:0}nav a.active,.monochrome nav a.active{background:transparent;color:#f4f4ed}nav a:hover{color:#fff;background:transparent}nav a.active{box-shadow:inset 0 -1px #777}
footer{width:100%;max-width:none;margin:0;padding:25px 4%;border-top:1px solid #444}@media(min-width:1600px){footer{padding-left:calc((100% - 1600px)/2 + 4%);padding-right:calc((100% - 1600px)/2 + 4%)}}
.repeat-badge{display:block;margin-top:10px;font-size:13px!important;font-family:inherit!important;font-weight:600;opacity:1!important}.project-target{opacity:.9}
.countdown-badge{font:13px monospace;letter-spacing:.5px;white-space:nowrap;opacity:.75;margin-left:12px}.project-top .index{flex:1}
.focus-card-top{display:flex;align-items:flex-start;gap:10px;border-bottom:1px solid #0003;padding-bottom:18px;margin-bottom:28px}.focus-card-top .focus-project{flex:1;min-width:0;border:0;padding:0;margin:0}.focus-card-top .countdown-badge{flex-shrink:0;margin:3px 0 0;font-size:13px}
.tree-step-content .step-note{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6;margin:6px 0 4px}.note-toggle{display:block;border:0;padding:5px 0;min-height:36px;font-size:12px;color:#aaa;text-align:left;background:transparent}.note-toggle:hover{color:var(--color);background:transparent}
.move-control select{appearance:none;-webkit-appearance:none;-moz-appearance:none;border-radius:0;border:1px solid #666;background-color:#222;color:#eee;font:12px Arial,Helvetica,sans-serif;line-height:1.4;padding:9px 27px 9px 9px;min-height:38px;box-shadow:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23bbb' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 9px center;background-size:10px 7px}.move-control select:hover{border-color:#999}.move-control select:focus-visible{outline:2px solid var(--color);outline-offset:2px}
.tree-step{align-items:flex-start}.tree-step>.drag-handle{align-self:flex-start;margin-top:12px}.tree-step>.tree-check{align-self:flex-start;margin-top:20px}.tree-step:before{top:42px}
.tree-step-content .step-note.note-preview{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.tree-step-actions{display:grid;grid-template-columns:36px 36px 130px;align-items:end;align-self:flex-start;gap:5px;margin-left:auto}.tree-step-actions .note-toggle{grid-column:1/-1;justify-self:end;min-height:28px;padding:0;font-size:12px;white-space:nowrap}.tree-step-actions .move-control{grid-column:3}.tree-step-actions>button:not(.note-toggle){grid-row:auto}
@media(max-width:750px){.tree-step-actions{width:auto;grid-template-columns:36px 36px 150px;max-width:100%}.tree-step>.drag-handle{margin-top:10px}.tree-step>.tree-check{margin-top:18px}.tree-step-content{min-width:0}.tree-step:before{top:38px}}
.space-tile{container-type:inline-size;display:flex;min-width:0}.space-card{flex:1;min-height:max(300px,100cqi);aspect-ratio:auto}.project-space{margin-top:16px;padding-top:12px;border-top:1px solid #0003;font:12px monospace;letter-spacing:1px;opacity:.7;overflow-wrap:anywhere}.monochrome .space-card{background:#d5d5d5;color:#111}#space-label select{appearance:none;-webkit-appearance:none;border-radius:0;min-height:44px}header nav{gap:0}header nav a{padding-left:16px;padding-right:16px}@media(max-width:600px){header nav a{padding-left:6px;padding-right:6px;font-size:10px}}
#archive-actions{border-top:1px solid #444;margin-top:24px;padding-top:14px;display:flex;flex-wrap:wrap;gap:8px}#archive-actions p{flex-basis:100%;font-size:13px;color:#aaa;line-height:1.5}#archive-actions button{font-size:12px}.archive-list{display:grid;gap:12px}.archive-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px;border:1px solid #444}.archive-row h2{margin:10px 0 0;font-size:26px}.archive-row .tag{color:#aaa}@media(max-width:600px){.archive-row{align-items:flex-start;flex-direction:column}}
.archive-buttons,.delete-buttons{display:flex;gap:10px;flex-wrap:wrap}.archive-buttons button{font-size:12px}#delete-confirm p{line-height:1.6;color:#bbb}#delete-final{border-color:#bd7777;color:#efb0b0}#delete-final:hover{background:#442323}.space-tile.project-tile .space-card{min-height:max(300px,100cqi)}
/* View preferences are independent: day/night surfaces and optional monochrome. */
.view-modes{display:flex;gap:8px;align-items:center}.check-label{flex-direction:row;align-items:center;gap:10px}.check-label input{width:18px;height:18px;accent-color:var(--editor-color);flex-shrink:0}.check-label+#color-source{margin-top:-8px;margin-bottom:18px}
.light-mode{color-scheme:light;background:#f5f4ef;color:#20211f}.light-mode body{background:#f5f4ef}.light-mode header{background:rgba(245,244,239,.8);border-color:#cccac3}.light-mode footer{border-color:#cccac3;color:#666861}.light-mode nav a{color:#777970}.light-mode nav a.active,.light-mode nav a:hover{color:#20211f;background:transparent}.light-mode nav a.active{box-shadow:inset 0 -1px #686b61}.light-mode button{border-color:#b6b8af}.light-mode button:hover{background:#00000008}.light-mode .primary{color:#111}.light-mode :focus-visible{outline-color:#30332c}.light-mode .mode-toggle{color:#55584e}.light-mode .mode-toggle[aria-pressed="true"]{background:#e0e1d9;color:#20211f;border-color:#a8aaa0}.light-mode .eyebrow,.light-mode .back,.light-mode .detail-note,.light-mode .page-heading p,.light-mode .detail-target,.light-mode .hint,.light-mode #archive-hint,.light-mode .archive-row .tag{color:#64685f}.light-mode .archive-row{border-color:#cccac3}.light-mode dialog{background:#faf9f5;color:#20211f;border-color:#b6b8af}.light-mode input,.light-mode textarea,.light-mode select{background:#f0f0ea;color:#20211f;border-color:#acafa3}.light-mode #archive-actions{border-color:#cccac3}.light-mode #delete-confirm p{color:#62665b}.light-mode #delete-final{color:#a33535;border-color:#b97474}.light-mode #toast{background:#252722;color:#f5f4ef}.light-mode .structure-toolbar{border-color:#cccac3}.light-mode .structure-toolbar p{color:#64685f}
/* Keep the selected hue while increasing contrast for text on pale surfaces. */
.light-mode .project-view .page-heading h1{color:color-mix(in srgb,var(--accent) 48%,#202820)}
.light-mode .project-tree{--project-ink:color-mix(in srgb,var(--color) 48%,#202820);--project-border:color-mix(in srgb,var(--color) 36%,#d1d2c8)}
.light-mode .stage-top{background:color-mix(in srgb,var(--color) 20%,#f5f4ef);border-color:var(--project-border);color:var(--project-ink)}
.light-mode .stage-top .stage-count,.light-mode .stage-top .disclosure{color:var(--project-ink)}
.light-mode .tree-step,.light-mode .milestone-goal,.light-mode .stage-done .milestone-goal{background:#eeeee7;border-color:#d1d2c8}
.light-mode .milestone-goal,.light-mode .stage-done .milestone-goal{color:var(--project-ink);border-color:var(--project-border)}
.light-mode .goal-actions button{color:var(--project-ink);border-color:var(--project-border)}
.light-mode .stage:before,.light-mode .milestone-goal:before{background:var(--project-border)}
.light-mode .branch{border-left-color:#cccfc4}.light-mode .tree-step:before{background:#cccfc4}.light-mode .tree-now{border-color:var(--project-ink)}.light-mode .tree-now .tag,.light-mode .note-toggle:hover,.light-mode .tree-check:hover{color:var(--project-ink)}
.light-mode .tree-step-content p,.light-mode .step-date,.light-mode .note-toggle,.light-mode .move-control>span,.light-mode .tree-step-actions>button,.light-mode .add-tree-step{color:#62665b}.light-mode .move-control select{background-color:#f5f4ef;color:#20211f;border-color:#acafa3}.light-mode .tree-check{border-color:#85897b}.light-mode .tree-done .step-title{color:#777c6f}.light-mode .color-option input:checked+.swatch{border-color:#faf9f5}.light-mode .color-option input:focus-visible+.swatch{outline-color:#20211f}
.light-mode.monochrome [style*="--color"]{--color:#353733!important}.light-mode.monochrome #app{--accent:#353733!important}.light-mode.monochrome dialog{--editor-color:#353733!important}
.light-mode.monochrome .project-tile .project,.light-mode.monochrome .space-card,.light-mode.monochrome .focus-card{background:#353733;color:#f3f3ed;border-color:#353733}
.light-mode.monochrome .project .bar{background:#ffffff30}.light-mode.monochrome .project .bar span{background:#f3f3ed}.light-mode.monochrome .project-space,.light-mode.monochrome .focus-card-top,.light-mode.monochrome .focus-bottom{border-color:#ffffff30}
.light-mode.monochrome .primary,.light-mode.monochrome dialog form>.primary:hover,.light-mode.monochrome dialog form>.primary:focus-visible{background:#353733!important;color:#f3f3ed;box-shadow:none}.light-mode.monochrome .project-drop .project,.light-mode.monochrome .focus-card:hover{box-shadow:inset 0 0 0 2px #f3f3ed}.light-mode.monochrome .project-tile .project:focus-visible{outline-color:#f3f3ed}.light-mode.monochrome .stage-top{background:#e0e1d9}.light-mode.monochrome .disclosure{background:#d5d7cd}.light-mode.monochrome .drop-active{background:#00000012!important}
@media(max-width:850px){header{gap:12px}.view-modes{gap:4px}.view-modes .mode-toggle{font-size:10px;padding:8px}header nav a{padding-left:9px;padding-right:9px}}
@media(max-width:600px){.view-modes{margin-left:auto}header nav{order:3;width:100%}}
.light-mode .tree-now{box-shadow:inset 4px 0 var(--project-ink)}.light-mode .tree-now .step-type{color:var(--project-ink)}

/* Compact appearance controls; full-width two-row palette. */
.view-modes .mode-toggle{width:38px;height:38px;min-height:38px;padding:8px;display:grid;place-items:center;flex-shrink:0;border-radius:50%}.mode-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.color-options{grid-template-columns:repeat(12,minmax(0,1fr));max-width:none;width:100%;gap:3px}.color-option{min-height:36px}.swatch{width:min(27px,100%);aspect-ratio:1;height:auto}
@media(max-width:420px){.color-options{grid-template-columns:repeat(8,minmax(0,1fr))}}
.goal-content>.tag{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;line-height:1.6}.milestone-date,.milestone-countdown{white-space:nowrap}.milestone-countdown{font-size:15px}
/* One compact stage header replaces the separate milestone goal. */
.stage-top{flex-wrap:wrap}.stage-label{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 6px}.stage-name{font:700 16px Arial,Helvetica,sans-serif;color:inherit;border:0;padding:5px 0;min-height:32px;text-align:left;overflow-wrap:anywhere;max-width:100%}.stage-name:hover{text-decoration:underline;background:transparent}.stage-date{font:12px monospace;line-height:1.6}.stage-date strong{font:700 14px monospace}.stage-actions{display:flex;gap:6px;flex-shrink:0}.stage-actions button{color:inherit;border-color:color-mix(in srgb,var(--color) 35%,transparent);font:700 12px Arial,Helvetica,sans-serif;padding:8px 10px;min-height:36px}.stage-note{white-space:pre-wrap;overflow-wrap:anywhere;color:#aaa;font-size:14px;line-height:1.6;margin:16px 0 8px}.light-mode .stage-note{color:#62665b}.light-mode .stage-actions button{border-color:var(--project-border)}.heading-actions{flex-wrap:wrap}.stage:last-child:before{display:none}
@media(max-width:750px){.stage-top .stage-count{width:auto;flex:1}.stage-actions{margin-left:auto}.stage-label{flex-basis:calc(100% - 50px)}}
/* Action branches join the single stage spine. */
.branch{margin-left:0;border-left:0;padding-left:20px}.tree-step:before{left:-44px;width:43px}.stage:last-child:before{display:block;bottom:42px}.stage-collapsed:last-child:before{display:none}.stage-top{z-index:1}
.stage-status{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:8px 10px;border:1px solid color-mix(in srgb,var(--color) 30%,transparent);font:12px monospace;white-space:nowrap}
.tree-step-actions{grid-template-columns:30px 30px 130px auto}.tree-step-actions .step-done-button{grid-column:4;border:1px solid color-mix(in srgb,var(--color) 40%,transparent);color:var(--color);font-size:12px;font-weight:bold;min-height:38px;white-space:nowrap;padding:8px 10px}.light-mode .tree-step-actions .step-done-button{color:var(--project-ink);border-color:var(--project-border)}
@media(max-width:750px){.branch{padding-left:12px}.tree-step:before{left:-29px;width:28px}.stage:last-child:before{bottom:28px}.tree-step-actions{grid-template-columns:28px 28px minmax(95px,130px) auto}.tree-step-actions .move-control{width:100%}.tree-step-actions .step-done-button{padding:8px}.stage-status{font-size:11px}}
.tree-step-actions{grid-template-columns:28px 28px 130px 32px auto}.tree-step-actions .step-delete-button{grid-column:4;padding:6px;min-width:32px;min-height:38px;display:grid;place-items:center}.step-delete-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.tree-step-actions .step-done-button{grid-column:5}.tree-step-actions .step-delete-button:hover{color:#d56262;background:#b33a3a15}
@media(max-width:750px){.tree-step-actions{grid-template-columns:24px 24px minmax(80px,120px) 30px auto;gap:3px}.tree-step-actions .step-delete-button{min-width:30px}.tree-step-actions .step-done-button{padding:8px 6px}}

/* Full color belongs to the current stage and next action, never completion. */
:root{--focus-ink:#111;--focus-border:#0005}.light-mode.monochrome{--focus-ink:#f3f3ed;--focus-border:#ffffff60}
.project-tree .stage-current .stage-top,.project-tree .tree-now{background:var(--color);color:var(--focus-ink);border-color:var(--color);box-shadow:none}
.project-tree .stage-current .stage-top .stage-count,.project-tree .stage-current .disclosure,.project-tree .stage-current .stage-actions button{color:inherit}
.project-tree .stage-current .disclosure,.project-tree .stage-current .stage-status,.project-tree .stage-current .stage-actions button{border-color:var(--focus-border);background:transparent}
.project-tree .tree-now .step-type,.project-tree .tree-now .step-title,.project-tree .tree-now .step-note,.project-tree .tree-now .step-date,.project-tree .tree-now .drag-handle,.project-tree .tree-now .tree-check,.project-tree .tree-now .tree-step-actions>button,.project-tree .tree-now .move-control>span{color:inherit}
.tree-step-actions .step-delete-button{border:1px solid color-mix(in srgb,var(--color) 40%,transparent)}.light-mode .tree-step-actions .step-delete-button{border-color:var(--project-border)}
.project-tree .tree-now .tree-check,.project-tree .tree-now .step-done-button,.project-tree .tree-now .step-delete-button{border-color:var(--focus-border)}
.project-tree .tree-now .move-control select{color:var(--focus-ink);background-color:transparent;border-color:var(--focus-border)}
.project-tree .tree-now :focus-visible{outline-color:var(--focus-ink)}
/* NOW uses a quiet tint; the current stage retains the full project color. */
.project-tree .tree-now{background:color-mix(in srgb,var(--color) 13%,#111110);color:#f4f4ed;border-color:color-mix(in srgb,var(--color) 28%,#111110);--focus-ink:#f4f4ed;--focus-border:color-mix(in srgb,var(--color) 40%,transparent)}
.light-mode .project-tree .tree-now{background:color-mix(in srgb,var(--color) 20%,#f5f4ef);color:#20211f;border-color:var(--project-border);--focus-ink:#20211f;--focus-border:var(--project-border)}
.monochrome .project-tree .tree-now{background:#2a2a2a}.light-mode.monochrome .project-tree .tree-now{background:#e0e1d9}
/* Only the current stage and NOW action carry project color. */
.project-tree .stage:not(.stage-current) .stage-top{background:#1c1c1a;color:#bcbcb5;border-color:#373733}
.project-tree .stage:not(.stage-current) .stage-top .stage-count,.project-tree .stage:not(.stage-current) .disclosure,.project-tree .stage:not(.stage-current) .stage-actions button{color:inherit}
.project-tree .stage:not(.stage-current) .disclosure,.project-tree .stage:not(.stage-current) .stage-actions button,.project-tree .stage:not(.stage-current) .stage-status{background:transparent;border-color:#62625c}
.light-mode .project-tree .stage:not(.stage-current) .stage-top{background:#eeeee7;color:#62665b;border-color:#d1d2c8}
.light-mode .project-tree .stage:not(.stage-current) .disclosure,.light-mode .project-tree .stage:not(.stage-current) .stage-actions button,.light-mode .project-tree .stage:not(.stage-current) .stage-status{border-color:#acafa3}
.monochrome:not(.light-mode) .project-tree .stage:not(.stage-current) .stage-top{background:#1c1c1c;border-color:#373737}
.project-tree .stage.stage-done .stage-status{border:1px solid #d5d5d0;color:#f4f4ed;font-weight:700;background:transparent}
.light-mode .project-tree .stage.stage-done .stage-status{border-color:#20211f;color:#20211f}

.space-open-steps{display:block;margin-top:10px;line-height:1.5}
button.focus-card{text-align:left;cursor:pointer}button.focus-card:hover{background:var(--color)}
#quick-actions{background:var(--color);color:#111;border:0;padding:28px}#quick-actions .dialog-top{gap:16px;margin-bottom:26px}#quick-project{font-weight:bold;overflow-wrap:anywhere}#quick-actions h2{overflow-wrap:anywhere;line-height:1.1}#quick-stage{font-size:14px;margin-bottom:26px}.quick-buttons{display:grid;gap:10px}.quick-buttons button{min-height:54px;border:1px solid currentColor;font-weight:700;font-size:14px;letter-spacing:.5px}#quick-close{flex-shrink:0;min-width:44px}.monochrome #quick-actions{background:#d5d5d5;color:#111}.light-mode.monochrome #quick-actions{background:#353733;color:#f3f3ed}#quick-actions :focus-visible{outline-color:currentColor}
.pool-steps{display:grid;gap:12px}.pool-steps .tree-step:before{display:none}.pool-actions{display:flex;gap:6px;align-items:center;margin-left:auto}.pool-actions button{min-height:42px;font-size:12px}.pool-actions .step-delete-button{padding:10px}.pool-steps .tree-step>.tree-check{margin-top:20px}
.pool-tree .pool-steps{padding-top:12px}.pool-tree .pool-steps .tree-step:before{display:block}.pool-tree .stage-top{background:color-mix(in srgb,var(--color) 13%,#111110);color:var(--color)}.light-mode .pool-tree .stage-top{background:color-mix(in srgb,var(--color) 20%,#f5f4ef);color:var(--project-ink)}.pool-tree .stage:not(.stage-current) .stage-top{background:color-mix(in srgb,var(--color) 13%,#111110);color:var(--color)}.light-mode .pool-tree .stage:not(.stage-current) .stage-top{background:color-mix(in srgb,var(--color) 20%,#f5f4ef);color:var(--project-ink)}#pool-palette{border:0;padding:0;margin:0 0 20px}#pool-palette legend{margin-bottom:12px}#category-delete{margin-top:18px}header nav{flex-shrink:0}@media(max-width:600px){header nav a{padding-left:5px;padding-right:5px;font-size:10px}}
.monochrome #pool-palette .color-options{filter:grayscale(1)}
@media(min-width:601px) and (max-width:1000px){header{gap:12px}header nav a{padding-left:8px;padding-right:8px;font-size:12px}}
.pool-actions{flex-wrap:wrap;justify-content:flex-end}@media(max-width:750px){.pool-actions{width:100%}}#assign-step-title{line-height:1.5;overflow-wrap:anywhere}
/* Generous, consistent controls and pickers across browsers. */
dialog select,.move-control select{appearance:none;-webkit-appearance:none;border-radius:0;min-height:50px;padding:13px 38px 13px 14px;font-size:16px;line-height:1.4;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10'%3E%3Cpath d='m2 2 6 6 6-6' fill='none' stroke='%23888' stroke-width='2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:14px 9px;cursor:pointer}.move-control{width:160px}.move-control select{font-size:14px}dialog input:not([type=checkbox]):not([type=radio]),dialog textarea{font-size:16px}dialog label{font-size:15px}.date-source{display:none}.date-trigger{width:100%;text-align:left;min-height:52px;background:#282827;border:1px solid #666;padding:13px 14px;font-size:16px;display:flex;justify-content:space-between;align-items:center;gap:10px}.date-trigger:after{content:'▦';font-size:22px;opacity:.65}.light-mode .date-trigger{background:#f0f0ea;border-color:#acafa3}.control-picker{width:min(460px,94vw);padding:24px}.control-picker h2{font-size:30px;margin-bottom:22px}.picker-options{display:grid;gap:8px;max-height:55vh;overflow:auto;padding:4px}.picker-options button{font-size:17px;text-align:left;min-height:54px;line-height:1.4;overflow-wrap:anywhere}.control-picker button[aria-pressed=true]{background:var(--editor-color,#e7fa5a);color:#111;border-color:transparent;font-weight:bold}.light-mode.monochrome .control-picker button[aria-pressed=true]{color:#fff}.calendar-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.calendar-heading strong{font-size:20px}.calendar-heading button{font-size:22px;padding:8px 14px}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;margin-bottom:24px}.calendar-grid>span{text-align:center;font:12px monospace;opacity:.6;padding:8px 0}.calendar-grid button{padding:0;min-height:44px;aspect-ratio:1;font-size:17px;border-color:transparent}.calendar-grid button[aria-current=date]{box-shadow:inset 0 0 0 1px currentColor}.calendar-actions{display:flex;flex-wrap:wrap;gap:8px}.calendar-actions button{flex:1;font-size:14px}.control-picker :focus-visible{outline:2px solid currentColor;outline-offset:1px}@media(max-width:420px){.control-picker{padding:18px}.calendar-grid{gap:2px}.calendar-grid button{min-height:40px}}
/* Inline tools stay within their grid cells; large choices open separately. */
.tree-step-actions .move-control{width:100%;min-width:0;margin:0}.tree-step-actions .move-control select{width:100%;min-width:0;min-height:38px;height:38px;padding:8px 26px 8px 9px;font-size:13px;line-height:20px;background-position:right 8px center;background-size:10px 7px}.tree-step-actions{flex-shrink:0}.pool-steps{display:block}.pool-steps>.tree-step:before{display:none}.pool-steps>.drop-slot{height:12px}.is-dragging .pool-steps>.drop-slot{height:40px}.pool-steps>.tree-step>.drag-handle{flex-shrink:0}
@media(max-width:1050px){.tree-step{flex-wrap:wrap}.tree-step-content{flex:1;min-width:50%}.tree-step-actions{margin-left:auto;max-width:100%}}
@media(max-width:420px){.tree-step-actions{grid-template-columns:24px 24px minmax(80px,1fr) 30px auto;width:100%}}
/* Stable action columns irrespective of completion labels. */
.tree-step-actions{grid-template-columns:28px 28px 130px 32px 88px}.tree-step-actions .step-done-button{width:88px;padding:8px 6px}.pool-actions>button:last-child{width:100px;flex-shrink:0}.pool-filter-toolbar{flex-wrap:wrap}.pool-filter-toolbar>.tag-chips{flex:0 1 auto}#step-tags{border:0;padding:0;margin:0 0 20px}#step-tags[hidden]{display:none}#step-tags legend{font-size:15px;margin-bottom:12px}.tag-chips{display:flex;flex-wrap:wrap;gap:7px}.tag-chips button{font-size:13px;min-height:38px;padding:8px 13px}.tag-chips button[aria-pressed=true]{background:var(--editor-color,var(--accent,#ddd));color:#111;border-color:transparent}.light-mode.monochrome .tag-chips button[aria-pressed=true]{background:#353733;color:#fff}.step-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.step-tags:empty{display:none}.step-tags span{border:1px solid currentColor;opacity:.65;padding:3px 7px;font:11px monospace}.tag-chips .hint{flex-basis:100%}@media(max-width:750px){.tree-step-actions{grid-template-columns:24px 24px minmax(80px,120px) 30px 88px}}@media(max-width:420px){.tree-step-actions{grid-template-columns:22px 22px minmax(72px,1fr) 30px 78px}.tree-step-actions .step-done-button{width:78px;font-size:11px}}

.pool-filter-toolbar>.tag-chips{margin-left:auto;justify-content:flex-end}
/* A quieter shared card treatment. */
.focus-card,button.focus-card{border:0}.project,.focus-card{transition:filter .15s,box-shadow .15s!important}.project:hover,.focus-card:hover,button.focus-card:hover,.light-mode.monochrome .focus-card:hover{box-shadow:inset 0 0 0 2px #1116;filter:brightness(1.04);transform:none}.project:focus-visible,.focus-card:focus-visible{outline:2px solid currentColor;outline-offset:4px}.project-top>.index{min-width:0;overflow-wrap:anywhere}.sort-control{margin:0;gap:5px;min-width:190px}.sort-control>span{font:11px monospace;color:#999}.sort-control select{font-size:14px;min-height:46px}.heading-actions{align-items:flex-end}.step-tags,#step-tags{display:none!important}.direct-steps>.stage-top{display:none}.direct-steps:before,.direct-steps .tree-step:before{display:none}.direct-steps{padding-left:0}.direct-steps>.branch{border:0;margin:0;padding-left:0}.is-dragging .drop-slot,.is-dragging .pool-steps>.drop-slot{height:12px;border:0;margin:0}.is-dragging .drop-slot span{display:none}.drop-slot.drop-active{outline:0;background:var(--color)!important;height:3px!important;margin:4px 0!important}
.sort-buttons{display:flex;gap:8px;flex-wrap:wrap}.sort-buttons button{font-size:14px}.sort-buttons button[aria-pressed=true]{border-color:currentColor;box-shadow:inset 0 -2px currentColor}.inactive-badge{font:700 19px monospace;flex-shrink:0;opacity:.7}[data-action="toggle-active"][aria-pressed=true]{background:#7796ff;color:#111;border-color:#7796ff}.monochrome [data-action="toggle-active"][aria-pressed=true]{background:#d5d5d5;border-color:#d5d5d5;color:#111}.light-mode.monochrome [data-action="toggle-active"][aria-pressed=true]{background:#353733;border-color:#353733;color:#fff}#delete-confirm .delete-buttons{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}#delete-confirm .delete-buttons button{width:100%;text-align:center;min-height:52px;font-size:13px;padding:12px}#archive-actions[hidden]{display:none}@media(max-width:420px){#delete-confirm .delete-buttons{grid-template-columns:1fr}}

.project-state{display:flex;align-items:center;justify-content:flex-end;gap:14px;flex-shrink:0}.active-badge{font-size:15px;line-height:1;opacity:.7}.project-state .countdown-badge{margin:0}
.sort-buttons button[aria-pressed=true]{background:#e7fa5a;color:#111;border-color:#e7fa5a;box-shadow:none;font-weight:800}.sort-buttons button[aria-pressed=true]:hover{background:#e7fa5a;box-shadow:inset 0 0 0 2px #111}
.project-active-toggle{font-size:14px;font-weight:800;letter-spacing:1px;padding:13px 18px;min-height:46px}[data-action="toggle-active"].project-active-toggle[aria-pressed=true]{background:var(--accent);border-color:transparent;color:#111}[data-action="toggle-active"].project-active-toggle[aria-pressed=true]:hover{background:var(--accent);box-shadow:inset 0 0 0 2px #111}.monochrome .sort-buttons button[aria-pressed=true]{background:#d5d5d5;border-color:#d5d5d5;color:#111}.light-mode.monochrome .sort-buttons button[aria-pressed=true]{background:#353733;border-color:#353733;color:#fff}
/* Project actions have their own row, independent of title length. */
.project-view .page-heading{display:grid;grid-template-columns:minmax(0,1fr);gap:26px;align-items:start}.project-view .page-heading>.heading-actions{display:grid;grid-template-columns:repeat(4,max-content);justify-content:end;gap:8px;width:100%}.project-view .heading-actions>button{white-space:nowrap;min-height:46px;margin:0}.project-view .page-heading h1{overflow-wrap:anywhere}
@media(max-width:650px){.project-view .page-heading>.heading-actions{grid-template-columns:repeat(2,minmax(0,1fr));justify-content:stretch}.project-view .heading-actions>button{width:100%;font-size:12px;padding:12px 8px;letter-spacing:.5px}}

.activity-icon{display:block;width:22px;height:22px;flex-shrink:0}.activity-badge{display:inline-flex;align-items:center;flex-shrink:0}.project-active-toggle{display:inline-flex;align-items:center;justify-content:center;gap:9px}.project-active-toggle .activity-icon{width:20px;height:20px}
/* Fixed geometry for both active states, with a shared text baseline. */
.project-view .page-heading>.heading-actions{align-items:center;grid-template-columns:max-content max-content max-content 132px}
.project-view .heading-actions>button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;height:46px;min-height:46px;max-height:46px;padding:0 18px;line-height:20px;border-width:1px;border-style:solid}
.project-view .heading-actions>.primary{border-color:transparent}
.project-view .heading-actions>.project-active-toggle{width:132px}
.stage-top .stage-label{font:400 13px/1.5 monospace;letter-spacing:.5px}
.stage-top .stage-label .stage-name,.stage-top .stage-label .stage-date,.stage-top .stage-label strong{font:inherit;letter-spacing:inherit}
.stage-top .stage-label .stage-name{padding:0;min-height:0}
@media(max-width:650px){.project-view .page-heading>.heading-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.project-view .heading-actions>button{padding:0 8px}.project-view .heading-actions>.project-active-toggle{width:100%}}
/* Hover changes brightness only; keyboard focus stays visible. */
#app .project:hover,#app .focus-card:hover{box-shadow:none;filter:brightness(1.10)}
#app .project-active-toggle:hover{box-shadow:none;filter:brightness(1.08)}
#app .project-active-toggle[aria-pressed=true]:hover{background:var(--accent)}
.monochrome #app .project-active-toggle[aria-pressed=true]:hover{background:#d5d5d5}
.light-mode.monochrome #app .project-active-toggle[aria-pressed=true]:hover{background:#353733}
.project-tree .stage.direct-steps:before,.project-tree .stage.direct-steps:after,.project-tree .stage.direct-steps>.branch:before,.project-tree .stage.direct-steps>.branch:after{display:none!important}.project-tree .stage.direct-steps>.branch{border:0!important}
.tree-step-actions{grid-template-columns:28px 28px 32px 32px 88px}.tree-step-actions .step-edit-button{grid-column:3;border:1px solid color-mix(in srgb,var(--color) 40%,transparent);min-height:38px;padding:6px;color:inherit}.light-mode .tree-step-actions .step-edit-button{border-color:var(--project-border)}
@media(max-width:420px){.tree-step-actions{grid-template-columns:24px 24px 32px 32px 78px}}

/* Keep the activity column stable in its new second position. */
.project-view .page-heading>.heading-actions{grid-template-columns:max-content 132px max-content max-content}
#app .sort-buttons button:hover{box-shadow:none;filter:brightness(1.08)}
@media(max-width:650px){.project-view .page-heading>.heading-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* One consistent outline; selection adds the accent fill. */
#app .sort-buttons button{border:1px solid #555}
.light-mode #app .sort-buttons button{border-color:#b6b8af}

/* Description above, target and actions together just before the project flow. */
.project-view .page-heading{margin-bottom:20px;gap:0}.project-view .page-heading .detail-note{margin-top:18px;margin-bottom:0;max-width:760px}.project-heading-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.project-heading-bottom .detail-target{margin:0;flex:1}.project-heading-bottom>.heading-actions{display:grid;grid-template-columns:max-content 132px max-content max-content;align-items:center;gap:8px;margin-left:auto}.project-heading-bottom+.structure-toolbar{padding-top:18px;padding-bottom:22px}
@media(max-width:900px){.project-heading-bottom{flex-wrap:wrap}.project-heading-bottom .detail-target{flex-basis:100%}}
@media(max-width:650px){.project-heading-bottom>.heading-actions{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}.project-heading-bottom .heading-actions>.project-active-toggle{width:100%}}

.project-view .page-heading{margin-bottom:38px}
.direct-steps>.branch>.add-tree-step{display:none}

footer .data-link{border:0;padding:0;min-height:24px;font:inherit;color:inherit}footer{gap:20px}footer>a{margin-left:auto}[data-confirm][hidden]{display:none}[data-message]{font-size:14px;line-height:1.5}

footer{align-items:center;flex-wrap:wrap}footer .data-link,footer>a,footer>span{line-height:24px;margin-top:0;margin-bottom:0}footer .data-link{display:inline-flex;align-items:center;justify-content:center;height:24px;min-height:24px;letter-spacing:inherit}footer .language-switch{white-space:nowrap}

.direct-drop-target{display:none}.is-dragging .direct-drop-target{display:block;height:28px;position:relative;margin-bottom:8px}.is-dragging .direct-drop-target:after{content:'';position:absolute;left:0;right:0;top:12px;height:3px;background:var(--color);opacity:.35}.is-dragging .direct-drop-target.drop-active{background:transparent!important;outline:none}.is-dragging .direct-drop-target.drop-active:after{background:#e7fa5a;opacity:1}

.direct-focus-card{position:relative;display:flex;flex-direction:column}.focus-project-link{display:flex;flex-direction:column;flex:1;min-height:0}.direct-focus-card .focus-bottom{padding-right:94px;min-height:66px}.focus-done{position:absolute;right:24px;bottom:24px;min-width:82px;min-height:44px;padding:10px 12px;border:1px solid currentColor;color:inherit;font-size:12px;font-weight:800;z-index:1}.focus-done:hover{background:#0000000c;box-shadow:none}.focus-project-link:after{content:'';position:absolute;inset:0}.focus-project-link:focus-visible{outline:2px solid currentColor;outline-offset:5px}.focus-done:focus-visible{outline:2px solid currentColor;outline-offset:3px}

#app .focus-done{border:1px solid #0003;background:transparent}
.light-mode.monochrome #app .focus-done{border-color:#ffffff30}
#app .focus-done:hover{background:#0000000c}
.light-mode.monochrome #app .focus-done:hover{background:#ffffff0c}
/* DONE outlines match card dividers in both themes. */

.welcome-panel{border:1px solid var(--line,#555);padding:clamp(24px,4vw,48px);margin-bottom:40px}.welcome-panel h2{font-size:clamp(28px,4vw,48px);margin:16px 0}.welcome-panel p{max-width:720px;line-height:1.6}.welcome-panel button{margin-top:12px}

.focus-card.project-tile .focus-project-link{user-select:none;-webkit-user-select:none;touch-action:pan-y}

.focus-space{font-family:inherit;font-size:12px;font-weight:800;line-height:1.4;letter-spacing:-.2px;text-transform:uppercase;opacity:.75;margin-bottom:8px;overflow-wrap:anywhere}

.tree-view-link{border:1px solid #555}.light-mode .tree-view-link{border-color:#b6b8af}
.universe-tree{font-size:14px;line-height:1.3;max-width:100%;border-top:1px solid #7775}
.universe-node{position:relative}.universe-node> .universe-link{position:absolute;top:0;left:32px;right:0}
.universe-node summary{height:38px;list-style:none;cursor:pointer;width:32px;display:grid;place-items:center}
.universe-node summary::-webkit-details-marker{display:none}.universe-node summary span{font-size:22px;transition:transform .12s}.universe-node details[open]>summary span{transform:rotate(90deg)}
.universe-children{margin-left:16px;padding-left:16px;border-left:1px solid #7775}
.universe-link{display:flex;align-items:center;gap:12px;min-height:38px;padding:5px 10px;border-bottom:1px solid #7772}
.universe-link:hover{background:#ffffff12}.light-mode .universe-link:hover{background:#00000008}
.universe-kind{font:10px monospace;letter-spacing:.5px;opacity:.65;width:54px;flex-shrink:0}.universe-name{overflow-wrap:anywhere;min-width:0}.universe-node>.universe-link .universe-name{font-weight:700}.universe-node>.universe-link:before{content:'';width:5px;height:16px;background:var(--branch-color);flex-shrink:0}.universe-done{opacity:.45}.universe-done .universe-name{text-decoration:line-through}.universe-check{margin-left:auto}.universe-empty{padding:10px;font-size:12px;opacity:.5}
@media(max-width:600px){.universe-children{margin-left:8px;padding-left:8px}.universe-kind{width:42px;font-size:9px}.universe-link{gap:6px}.universe-tree{font-size:13px}}

.universe-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.universe-link{height:38px}

.universe-node details:not([open])>.universe-children{display:none}
.universe-node details[open]>.universe-children{display:block}

.universe-leaf{padding-left:49px}.universe-activity{margin-left:auto;flex-shrink:0;display:flex;align-items:center}.universe-activity svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5}

.account-panel hr{border:0;border-top:1px solid #7775;margin:24px 0}.account-panel h3{font-size:20px}.account-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.account-panel [hidden]{display:none!important}.account-panel [data-message]{line-height:1.5;font-size:14px}.account-reset{margin-top:12px;border:0;padding-left:0;text-decoration:underline}.account-panel [data-user]{overflow-wrap:anywhere}

.account-panel [data-profile]{margin:20px 0}.account-panel [data-confirm-email]{padding:22px;border:1px solid #7775;margin:20px 0}.account-panel [data-confirm-address]{font-weight:700;overflow-wrap:anywhere}.account-panel [data-auth-intro]{line-height:1.5}

.view-modes .account-trigger.is-signed-in{width:auto;display:flex;gap:8px;padding:8px 12px;border-radius:20px;max-width:180px}.account-header-name{font:600 13px/1.2 Arial,Helvetica,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.account-trigger svg{flex-shrink:0}.account-header-name[hidden]{display:none}@media(max-width:600px){.view-modes .account-trigger.is-signed-in{max-width:130px}.account-header-name{font-size:12px}}