:root{font-family:Avenir Next,Pretendard,Noto Sans KR,sans-serif;--bg-base: #e6eef1;--bg-elevated: #ecf3f6;--bg-muted: #dce6ea;--text-primary: #1a2f37;--text-secondary: #36505c;--text-dim: #5f7681;--accent-primary: #2f7f9b;--accent-strong: #1d677f;--success: #1f8f6a;--warning: #9a6420;--danger: #9a3030;--focus-ring: #2f7f9b;--surface-highlight: rgba(255, 255, 255, .95);--surface-shadow: rgba(127, 151, 164, .52);--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--shadow-raised-sm: -2px -2px 4px var(--surface-highlight), 2px 2px 5px rgba(127, 151, 164, .38);--shadow-raised-md: -4px -4px 8px var(--surface-highlight), 4px 4px 10px rgba(127, 151, 164, .42);--shadow-inset-sm: inset -1px -1px 3px rgba(255, 255, 255, .7), inset 1px 1px 3px rgba(131, 152, 162, .35);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;color:var(--text-primary);background:linear-gradient(160deg,#e9f0f3,#dbe7ec)}*{box-sizing:border-box}body{margin:0;color:var(--text-primary);background:transparent}h1,h2,p{margin:0}.app-shell{min-height:100vh;max-width:1180px;margin:0 auto;padding:var(--space-5) var(--space-4) var(--space-6)}.topbar{display:flex;flex-direction:column;justify-content:flex-start;gap:var(--space-3);align-items:stretch;padding:var(--space-5);border-radius:var(--radius-lg);background:var(--bg-elevated);box-shadow:var(--shadow-raised-md)}.topbar h1{font-size:clamp(1.4rem,1.2rem + 1vw,2rem);letter-spacing:-.02em}.topbar p{margin-top:var(--space-2);color:var(--text-secondary);line-height:1.45}.topbar-copy{min-width:0;width:100%}.topbar-controls{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2);align-self:stretch;width:100%;max-width:100%;min-width:0}@media(min-width:768px){.topbar-controls{margin-right:0;margin-bottom:calc(var(--space-3) * -1)}.topbar-project-select-wrap{margin-right:calc(var(--space-3) * -1)}}.topbar-project-select-wrap{--project-select-caret-size: 16px;--project-select-caret-right: 12px;--project-select-caret-gutter: 0px;position:relative;display:inline-flex;align-items:center;width:min(100%,420px);flex:0 1 420px;min-width:0;margin-left:auto;max-width:100%}.project-select{min-width:0;width:100%;max-width:100%;height:32px;border:0;border-radius:var(--radius-sm);padding:0 calc(var(--project-select-caret-size) + var(--project-select-caret-right) + var(--project-select-caret-gutter)) 0 10px;font:inherit;color:var(--text-secondary);appearance:none;-webkit-appearance:none;-moz-appearance:none;background:var(--bg-elevated);box-shadow:var(--shadow-inset-sm);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.project-select-caret{pointer-events:none;position:absolute;right:var(--project-select-caret-right);top:50%;transform:translateY(-50%);width:var(--project-select-caret-size);height:var(--project-select-caret-size);display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;color:var(--text-secondary);background:transparent;border:0;box-shadow:none}.project-select-icon{width:16px;height:16px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;background:transparent;border:0;box-shadow:none}.project-select:focus,.project-select:focus-visible{outline:none;box-shadow:var(--shadow-inset-sm),inset -1px -1px 2px #ffffffbf,inset 1px 1px 2px #7f97a43d}.project-select option{color:var(--text-secondary);background:var(--bg-elevated)}.project-select option:checked{color:var(--text-primary);background:var(--bg-muted)}.project-select option[value=__todochain_add_project__]{font-weight:700;color:var(--accent-strong)}.tree-panel{margin-top:var(--space-5);border-radius:var(--radius-lg);padding:var(--space-4);background:var(--bg-elevated);box-shadow:var(--shadow-raised-md)}.panel-title{margin:var(--space-5) 0 var(--space-2);font-size:.95rem;color:var(--text-secondary);letter-spacing:.07em;text-transform:uppercase}.panel-title-row{margin-top:var(--space-5);display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2)}.panel-title-row .panel-title{margin:0}.panel-title-toggle{border:0;background:transparent;padding:0;cursor:pointer;text-align:right;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-size:.95rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-secondary);line-height:1.2;font-family:Avenir Next,Pretendard,Noto Sans KR,sans-serif}.panel-title-toggle:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.timeline-panel{position:relative;overflow:visible}.timeline-root-wrap{display:flex;justify-content:center;margin-bottom:var(--space-4)}.timeline-root-list,.timeline-child-list,.tree-list{list-style:none;margin:0;padding:0}.timeline-root-list{width:min(680px,100%)}.timeline-stage{--timeline-half-gap: 10px;--timeline-marker-size: 12px;--timeline-marker-top: calc(var(--space-2) + 32px);position:relative;display:grid;gap:var(--space-4);padding:4px 8px}.timeline-stage:before{content:"";position:absolute;top:0;bottom:var(--space-2);left:50%;width:2px;transform:translate(-50%);background:linear-gradient(180deg,#9fb8c3,#b9ced6)}.timeline-item{width:calc(50% - var(--timeline-half-gap));position:relative;padding:2px 6px;transition:opacity .4s ease,transform .4s ease}.timeline-item-entering{animation:timeline-item-enter .4s ease}.timeline-item-removing{opacity:0;transform:translateY(-6px);visibility:hidden;pointer-events:none;transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s}.timeline-item-left{justify-self:start}.timeline-item-right{justify-self:end}.timeline-rail-link{display:none}.timeline-item:before{content:"";position:absolute;top:var(--timeline-marker-top);width:var(--timeline-marker-size);height:var(--timeline-marker-size);border-radius:50%;background:#d14b4b;transform:translateY(-50%);box-shadow:0 0 0 6px var(--bg-elevated);z-index:2}.timeline-item-left .timeline-rail-link{right:-20px}.timeline-item-left:before{right:calc((var(--timeline-half-gap) * -1) - (var(--timeline-marker-size) / 2))}.timeline-item-right .timeline-rail-link{left:-20px}.timeline-item-right:before{left:calc((var(--timeline-half-gap) * -1) - (var(--timeline-marker-size) / 2))}.timeline-stage-wrap,.timeline-stage-wrap.collapsed{max-height:0;visibility:hidden;pointer-events:none;opacity:0;transform:translateY(-6px);transition:max-height .4s ease,opacity .4s ease,transform .4s ease,visibility 0s linear .4s;overflow:clip}.timeline-stage-wrap.expanded{max-height:20000px;visibility:visible;pointer-events:auto;opacity:1;transform:translateY(0);overflow:visible;transition:max-height .4s ease,opacity .4s ease,transform .4s ease,visibility 0s linear 0s}.timeline-stage-wrap.collapsed>.timeline-stage>.timeline-item{animation:none;opacity:0;transform:translateY(-6px);visibility:hidden;transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s}.tree-item{margin:var(--space-2) 0;transition:opacity .4s ease,transform .4s ease,max-height .4s ease,margin .4s ease;max-height:20000px}.tree-item-entering{animation:tree-item-enter .4s ease}.tree-item-removing{opacity:0;transform:translateY(-6px);max-height:0;margin-top:0;margin-bottom:0;visibility:hidden;pointer-events:none;transition:opacity .4s ease,transform .4s ease,max-height .4s ease,margin .4s ease,visibility 0s linear .4s}.tree-list{margin-top:var(--space-2);margin-left:var(--space-4);padding:2px 0}.node-row{display:grid;grid-template-columns:34px minmax(0,1fr) max-content;grid-template-rows:36px auto;row-gap:var(--space-2);column-gap:4px;align-items:center;border-radius:var(--radius-md);padding:6px 10px;background:var(--bg-elevated);box-shadow:var(--shadow-raised-sm)}.node-row-leaf{grid-template-rows:36px;row-gap:0}.node-row-warning-empty{outline:1px solid #d8bf93}.expand-button,.action-button{border:0;border-radius:var(--radius-sm);background:var(--bg-elevated);color:var(--text-secondary);box-shadow:var(--shadow-raised-sm);cursor:pointer}.expand-button,.action-button,.icon-button{height:32px}.expand-button:disabled{cursor:not-allowed;color:#8ca0a8;box-shadow:var(--shadow-inset-sm)}.icon-button{width:32px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-weight:700}.button-icon{width:16px;height:16px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.button-icon-dot{fill:none;stroke:currentColor}.expand-button:focus-visible,.action-button:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.title-input:focus-visible,.title-input-warning{outline:none}.node-main{min-width:0;width:100%;padding-left:4px;display:flex;justify-content:space-between;align-items:center;gap:var(--space-2);height:32px}.node-head{width:100%;min-width:0;height:32px;display:flex;align-items:center;justify-content:space-between}.title-zone{min-width:0;width:100%;flex:1;display:flex;align-items:center;gap:var(--space-2);height:32px}.warning-line{height:32px;display:flex;align-items:center;justify-content:flex-end;gap:6px;margin-top:0;width:100%}.warning-line:empty{display:none}.title-input{width:100%;min-width:0;border:0;border-radius:0;padding:0;height:32px;font:inherit;font-weight:700;line-height:32px;color:inherit;background:transparent;box-shadow:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.node-meta{display:flex;justify-content:flex-end;align-items:center;gap:8px;height:32px;flex-shrink:0}.node-progress-chip{font-size:.76rem;font-weight:700;color:var(--accent-strong);padding:0 10px;border-radius:999px;box-shadow:var(--shadow-inset-sm);height:32px;display:inline-flex;align-items:center;line-height:32px;white-space:nowrap}.node-progress-chip-root{grid-column:3;grid-row:1;justify-self:end;align-self:center;z-index:1;transition:opacity .4s ease,transform .4s ease,visibility 0s linear 0s}.node-progress-gauge-full{grid-column:1 / -1;width:100%;height:8px;max-height:8px;border-radius:999px;overflow:hidden;background:#2f7f9b17;box-shadow:inset 0 0 0 1px #66808c0d;opacity:1;transform:translateY(0);transition:max-height .4s ease,opacity .4s ease,transform .4s ease,margin .4s ease}.node-progress-gauge-full.gauge-hidden{display:none;max-height:0;opacity:0;transform:translateY(-4px);margin-top:0;margin-bottom:0;pointer-events:none}.node-progress-gauge-full.gauge-visible{max-height:8px;opacity:1;transform:translateY(0)}.node-progress-gauge-full-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#2f7f9b,#5ba7be);transition:width .4s ease}.node-progress-gauge-full.gauge-root .node-progress-gauge-full-fill{background:linear-gradient(90deg,#2f7f9b,#67aac1)}.node-progress-gauge-full.gauge-trunk .node-progress-gauge-full-fill{background:linear-gradient(90deg,#3f8a63,#74b687)}.node-progress-gauge-full.gauge-branch .node-progress-gauge-full-fill{background:linear-gradient(90deg,#7568ba,#9e94d8)}.action-group{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:center;align-self:center;grid-column:3;grid-row:1;justify-self:end;gap:var(--space-2);overflow:visible;white-space:nowrap;padding:0;min-width:max-content}.node-row-root .action-group{opacity:0;visibility:hidden;width:0;min-width:0;gap:0;overflow:hidden;padding:0;pointer-events:none;transform:translate(4px);transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s}.node-row-root:hover .action-group,.node-row-root:focus-within .action-group{opacity:1;visibility:visible;width:max-content;min-width:max-content;gap:var(--space-2);overflow:visible;pointer-events:auto;transform:translate(0);transition:opacity .4s ease,transform .4s ease,visibility 0s linear 0s}.node-row-root:focus-within .node-progress-chip-root{opacity:0;visibility:hidden;transform:translate(4px);pointer-events:none;transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s}@media(hover:hover)and (pointer:fine){.node-row .action-group{opacity:0;visibility:hidden;width:0;min-width:0;gap:0;overflow:hidden;padding:0;pointer-events:none;transform:translate(4px);transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s}.node-row:hover .action-group,.node-row:focus-within .action-group{opacity:1;visibility:visible;width:max-content;min-width:max-content;gap:var(--space-2);overflow:visible;pointer-events:auto;transform:translate(0);transition:opacity .4s ease,transform .4s ease,visibility 0s linear 0s}.node-row-root:hover .node-progress-chip-root,.node-row-root:focus-within .node-progress-chip-root{opacity:0;visibility:hidden;transform:translate(4px);pointer-events:none;transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s}}.action-button{flex:0 0 auto}.action-danger{color:#8d2e2e}.leaf-checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:32px;height:32px;margin:0;border:none;border-radius:10px;background:var(--bg-elevated);box-shadow:-2px -2px 4px #ffffffbf,2px 2px 5px #7f97a440;cursor:pointer}.leaf-checkbox:checked{background:linear-gradient(160deg,#74b687,#3f8a63);box-shadow:inset 0 0 0 2px #ecf3f6f2}.node-children,.node-children.collapsed{max-height:0;visibility:hidden;pointer-events:none;opacity:0;transform:translateY(-6px);transition:max-height .4s ease,opacity .4s ease,transform .4s ease,visibility 0s linear .4s;overflow:clip}.node-children.expanded{max-height:20000px;visibility:visible;pointer-events:auto;opacity:1;transform:translateY(0);overflow:visible;transition:max-height .4s ease,opacity .4s ease,transform .4s ease,visibility 0s linear 0s}.node-children.collapsed>.tree-list>.tree-item{animation:none;opacity:0;transform:translateY(-6px);visibility:hidden;transition:opacity .4s ease,transform .4s ease,visibility 0s linear .4s}.node-children{transform-origin:top;will-change:max-height,opacity,transform}.node-children>.tree-list{overflow:visible}.mermaid-panel{margin-top:var(--space-5);overflow:hidden;transform-origin:top;transition:max-height .4s ease,opacity .4s ease,transform .4s ease,margin-top .4s ease}.mermaid-panel-open{max-height:2000px;opacity:1;transform:translateY(0);pointer-events:auto}.mermaid-panel-closed{max-height:0;opacity:0;transform:translateY(-6px);margin-top:0;pointer-events:none}.json-panel{margin-top:var(--space-5);overflow:hidden;transform-origin:top;transition:max-height .4s ease,opacity .4s ease,transform .4s ease,margin-top .4s ease}.json-panel-open{max-height:2000px;opacity:1;transform:translateY(0);pointer-events:auto}.json-panel-closed{max-height:0;opacity:0;transform:translateY(-6px);margin-top:0;pointer-events:none}.json-tree-code{margin:0;padding:var(--space-3);border-radius:var(--radius-md);background:var(--bg-base);box-shadow:var(--shadow-inset-sm);color:var(--text-secondary);font-size:.82rem;line-height:1.45;overflow:auto}.mermaid-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.mermaid-toggle{padding:.42rem .8rem;font:inherit;font-weight:600}.mermaid-canvas{margin-top:var(--space-3);overflow-x:auto;display:flex;justify-content:center}.mermaid-canvas svg{max-width:100%}.mermaid-error{margin-top:var(--space-3);color:var(--danger)}.preview-content-switch{animation:preview-content-switch-in .26s ease}@keyframes tree-item-enter{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes timeline-item-enter{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes preview-content-switch-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1023px){.timeline-stage{--timeline-half-gap: 12px}}@media(max-width:767px){.timeline-panel{--timeline-stage-pad-x: 8px;--timeline-item-pad-x: 6px;--timeline-indent-x: 8px;--timeline-marker-local-x: -10px;--timeline-line-center-x: calc( var(--timeline-stage-pad-x) + var(--timeline-item-pad-x) + var(--timeline-marker-local-x) )}.app-shell{padding:var(--space-4) var(--space-3) var(--space-5)}.topbar{flex-direction:column;align-items:stretch;gap:var(--space-3);padding:var(--space-4) var(--space-3) var(--space-3)}.topbar-controls{justify-content:flex-start;align-self:stretch;width:100%}.topbar-project-select-wrap{width:100%}.project-select{min-width:0;width:100%;display:block}.tree-panel{width:100%;margin-left:0;margin-right:0}.timeline-root-wrap{justify-content:stretch}.timeline-root-list{width:100%}.timeline-stage:before{left:var(--timeline-line-center-x);transform:translate(-50%)}.timeline-stage{padding-left:var(--timeline-stage-pad-x);padding-right:0;gap:var(--space-3)}.timeline-item,.timeline-item-left,.timeline-item-right{width:100%;justify-self:stretch;padding-left:var(--timeline-item-pad-x);padding-right:0}.timeline-item:before{left:calc(var(--timeline-item-pad-x) + var(--timeline-marker-local-x));right:auto;transform:translate(-50%,-50%)}.timeline-child-list{margin-left:var(--timeline-indent-x);width:auto}.tree-list{margin-left:var(--space-3)}.node-row{grid-template-columns:32px minmax(0,1fr) auto;grid-template-rows:36px auto;row-gap:12px;column-gap:8px}.node-row-leaf{grid-template-rows:36px}.node-row-root{grid-template-columns:32px minmax(0,1fr) auto auto}.node-row-root .node-progress-chip-root{grid-column:3;min-width:40px;padding:0 6px;justify-content:center}.node-row-root .action-group{grid-column:4;opacity:1;visibility:visible;width:max-content;min-width:max-content;gap:var(--space-2);overflow:visible;pointer-events:auto;transform:none}.expand-button,.action-button,.icon-button{width:32px;height:32px}}@media(prefers-reduced-motion:reduce){.timeline-stage-wrap{transition:none}}