@font-face{font-family:DM;src:url('/assets/dm-sans-regular.ttf');font-weight:400}@font-face{font-family:DM;src:url('/assets/dm-sans.ttf');font-weight:500 800}*{box-sizing:border-box}body{margin:0;background:#faf7f2;color:#342b25;font:14px DM,system-ui,sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid #a6470c;outline-offset:3px}::selection{background:#ffd7ad}svg{width:19px;height:19px;vertical-align:middle;flex-shrink:0}button{color:inherit}#app{display:flex;min-height:100vh}.sidebar{width:218px;flex-shrink:0;background:#fffcf8;border-right:1px solid #e8ddd2;padding:26px 18px 16px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;gap:10px;align-items:center;color:#823c19;text-decoration:none;margin:0 8px 32px}.brand>svg{width:31px;height:31px}.brand strong{font-size:26px;letter-spacing:-1px;line-height:1}.brand span{display:block;font-size:9px;font-weight:500;letter-spacing:.5px;margin-top:7px}.workspace{display:flex;gap:9px;align-items:center;padding:12px 0 25px;font-size:12px;font-weight:600}.workspace-avatar,.avatar{display:grid;place-items:center;flex-shrink:0;width:31px;height:31px;background:#f5e6d7;border-radius:8px;font-size:12px}.workspace small,.profile small{display:block;font-size:10px;color:#776456;margin-top:3px;font-weight:400}nav{display:flex;flex-direction:column;gap:5px}.nav-item{display:flex;align-items:center;gap:11px;background:transparent;border:0;text-align:left;padding:12px;border-radius:7px;font-size:12px;color:#746153}.nav-item:hover,.side-section button:hover{background:#faeee2}.nav-item.active{color:#97420d;background:#ffead4;font-weight:600}.count{margin-left:auto;background:white;border-radius:5px;padding:1px 5px;font-size:10px}.side-section{margin-top:32px;display:flex;flex-direction:column;gap:7px}.side-section>span{font-size:9px;color:#796757;letter-spacing:1px;margin:0 10px 7px}.side-section button{background:none;border:0;text-align:left;font-size:11px;padding:8px 10px;border-radius:6px}.side-note{margin-top:auto;padding:28px 9px 22px;font-size:11px}.side-note p{color:#766356;line-height:1.7;font-size:10px}.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#b95716;margin-right:6px}.profile{border-top:1px solid #e8ddd2;padding-top:17px;display:flex;align-items:center;gap:10px;font-size:11px}.main{flex:1;min-width:0}.topbar{height:67px;border-bottom:1px solid #e8ddd2;display:flex;align-items:center;justify-content:space-between;padding:0 30px;background:#fff}.breadcrumbs{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:#796454;font-size:11px}.breadcrumbs svg{width:12px;height:12px}.breadcrumbs button{border:0;background:none;padding:0;color:#795f4b;font-size:inherit}.breadcrumbs span:last-child{color:#4c382a}.header-actions{display:flex;gap:12px;align-items:center}.btn{border:1px solid #dfcdbb;border-radius:6px;background:#fff;min-height:35px;padding:7px 12px;font-size:11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none}.btn:hover{background:#fff0e0}.btn.primary{background:#a6470c;color:#fff;border-color:#a6470c}.btn.primary:hover{background:#823508}.btn svg{width:14px;height:14px}.text-button{border:0;background:none;padding:0;color:#805e43;font-size:11px}.badge{display:inline-flex;align-items:center;border:1px solid #e8d8c7;background:#fffcf7;border-radius:5px;padding:4px 7px;font-size:10px;color:#79614d}.page-heading{padding:29px 30px 24px;display:flex;justify-content:space-between}h1{font-size:26px;font-weight:600;letter-spacing:-.8px;margin:0 0 8px}p{line-height:1.65}.page-heading p{font-size:12px;color:#756252;margin:0}.workspace-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 30px 18px}.segments{display:flex;border:1px solid #e8ddd2;background:#f5ecdf;padding:3px;border-radius:7px;gap:2px}.segments button{background:none;border:0;border-radius:4px;font-size:11px;padding:7px 10px;display:flex;align-items:center;gap:4px}.segments .selected{background:white;box-shadow:0 2px 4px #24382a0a}.segments svg{width:13px;height:13px}.toolbar-right{display:flex;gap:12px;align-items:center}.toolbar-right label{font-size:10px;color:#77624e;display:flex;gap:7px;align-items:center}select{border:1px solid #dfcdbb;border-radius:5px;background:#fff;padding:7px;color:#64482f;font-size:11px;max-width:220px}.content{display:flex;margin:0 30px;min-height:650px;gap:18px;align-items:stretch}.canvas-panel{flex:1;min-width:0;border:1px solid #e8dacb;background:white;border-radius:10px;overflow:hidden;display:flex;flex-direction:column}.canvas-controls{min-height:53px;display:flex;align-items:center;padding:12px 18px;border-bottom:1px solid #eee4d9}.canvas-subbar{display:flex;align-items:center;justify-content:space-between;padding:10px 17px;gap:10px}.search{display:flex;align-items:center;gap:7px}.search svg{width:14px;height:14px;color:#806c59}.search input{width:170px;border:0;background:none;outline-offset:0;padding:7px 0;font-size:11px}.muted{color:#77624f;font-size:11px}.diagram-scroll{overflow:auto;flex:1;max-height:650px;background:#fffcf7;position:relative;scrollbar-width:thin;scrollbar-color:#d3b18c #fffcf7}.diagram{display:block;min-width:540px;user-select:none;font-family:DM,system-ui,sans-serif}.node{cursor:grab;touch-action:none}.node:hover>rect:first-child,.selected-node>rect:first-child{stroke:#ac4d10;stroke-width:2}.node:active{cursor:grabbing}.canvas-bottom{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:13px;border-top:1px solid #e9dbcd}.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:9px;color:#77624f}.legend span{display:flex;gap:5px;align-items:center}.legend i{width:6px;height:6px;border-radius:2px}.zoom{display:flex;align-items:center;gap:9px;font-size:10px;white-space:nowrap}.zoom button{background:none;border:0;min-width:24px;min-height:28px}.view-caption{padding:0 13px 12px;color:#796651;font-size:10px}.inspector{width:260px;flex-shrink:0;border:1px solid #e8dacb;border-radius:10px;background:white;padding:20px;overflow:auto;max-height:780px}.inspector h2{font-size:20px;line-height:1.3;margin:16px 0 10px;letter-spacing:-.5px}.inspector p{font-size:11px;color:#786451}.inspector h3{font-size:12px;margin:24px 0 12px}.inspector-top{display:flex;justify-content:space-between;align-items:center}.inspector-top button{font-size:24px}dl{border-top:1px solid #eee4d9;padding-top:14px;margin:20px 0;font-size:11px;display:grid;grid-template-columns:76px 1fr;gap:13px}dt{color:#786451}dd{margin:0}.full{display:flex;width:100%;margin-top:8px}.connection-list button{display:block;width:100%;text-align:left;border:0;background:none;border-bottom:1px solid #eee4d9;padding:10px 0;font-size:11px}.connection-list small{display:block;font-size:9px;color:#79624b;margin-top:5px}.inspector-empty{padding:60px 5px 35px;text-align:center}.inspector-empty>svg{width:35px;height:35px;color:#a4734c}.inspector-empty h3{font-size:15px}.inspector-note{padding-top:20px;border-top:1px solid #eee4d9;font-size:11px}.inspector label{display:block;font-size:11px;margin:9px 0}.inspector input{width:100%;padding:8px;border:1px solid #dfcdbb;border-radius:5px;margin-top:5px}.inspector select{display:block;width:100%;margin-top:5px}footer{display:flex;justify-content:space-between;margin:17px 30px;color:#796651;font-size:10px}.dependency-controls{display:flex;gap:7px;flex-wrap:wrap;align-items:center}.dependency-controls label{font-size:10px;display:flex;gap:5px;align-items:center}.dependency-controls #focus{max-width:180px}.column-view{display:flex;min-height:500px;padding:20px;gap:22px}.column-view section{width:235px;flex-shrink:0}.column-view h3{font-size:12px}.trace-node{width:100%;display:flex;flex-wrap:wrap;gap:10px;padding:16px;margin:10px 0;background:white;border:1px solid #e8dacb;border-radius:9px;text-align:left}.trace-node strong{font-size:12px}.trace-node small{font-size:10px;color:#786451;line-height:1.5}.empty{padding:60px;text-align:center}.review-content{display:block}.review-panel{background:#fff;border:1px solid #e8dacb;border-radius:10px;padding:27px}.review-panel h2{font-size:22px}.review-header,.review-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}.review-panel button{border:1px solid #dfcdbb;background:white;border-radius:6px;padding:8px 12px;font-size:12px;min-height:35px}.review-panel button.primary{background:#a6470c;color:white}.review-panel [role=tablist]{display:flex;gap:5px;margin:24px 0 16px}.review-panel [aria-selected=true]{background:#fff0df;border-color:#cf8949}.review-panel ol{display:flex;gap:24px;flex-wrap:wrap;padding:15px 20px;color:#77624f;font-size:12px}.review-panel input,.review-panel textarea,.review-panel select{padding:10px;border:1px solid #dfcdbb;border-radius:6px;max-width:100%}.review-panel textarea{width:100%;min-height:80px;display:block;margin:9px 0}.review-panel label{font-size:12px;display:block;margin:10px 0}.diff-row{border-bottom:1px solid #ede0d3;padding:13px 0;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:12px}.review-panel section{margin:20px 0}.review-panel h3{font-size:15px;margin-top:25px}.review-panel .badge{margin-right:7px}.comment{padding:15px 0;border-bottom:1px solid #ecdfd1;font-size:12px}.publish-banner{background:#fff0de;display:flex;align-items:center;justify-content:space-between;padding:20px;border-radius:9px;margin:18px 0;font-size:13px}.publish-banner p{font-size:12px}.presentation-content{display:block}.story{background:#fff;border:1px solid #e8dacb;padding:30px;border-radius:10px;margin-bottom:15px}.story-count{font-size:10px;color:#786047;letter-spacing:1px}.story h2{font-size:29px;letter-spacing:-.6px;max-width:700px}.story p{max-width:700px;color:#786451;font-size:14px}.story-controls{display:flex;gap:10px;margin-top:24px;flex-wrap:wrap}.story-diagram{overflow:auto;border:1px solid #e8dacb;border-radius:10px;max-height:650px}#notice{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#5a321c;color:white;border-radius:8px;padding:13px 22px;box-shadow:0 8px 24px #172b2422;opacity:0;pointer-events:none;transition:opacity .15s;z-index:10;max-width:90vw;font-size:12px}#notice.show{opacity:1}@media(min-width:1600px){.diagram-scroll{max-height:760px}.content{min-height:760px}.inspector{width:290px}}@media(max-width:1150px){.sidebar{width:185px;padding:20px 12px}.inspector{width:225px;padding:15px}.content{margin:0 18px;gap:12px}.page-heading{padding:25px 18px}.workspace-toolbar{margin:0 18px 16px}.topbar{padding:0 18px}.canvas-subbar .muted{display:none}.toolbar-right label{font-size:0}.toolbar-right label select{font-size:11px}}@media(max-width:800px){#app{display:block}.sidebar{width:100%;height:auto;position:static;padding:12px 16px;display:block}.brand{margin:0 0 15px}.brand span{display:none}.brand strong{font-size:23px}.workspace,.side-section,.side-note,.profile{display:none}nav{flex-direction:row;justify-content:space-between}.nav-item{font-size:11px;padding:9px 7px;gap:5px}.nav-item svg{width:15px}.topbar{height:60px;padding:0 15px}.topbar .breadcrumbs{display:none}.header-actions{width:100%;justify-content:space-between;gap:6px}.page-heading{padding:23px 16px 18px}h1{font-size:23px}.workspace-toolbar{margin:0 16px 15px;flex-wrap:wrap}.toolbar-right{width:100%;justify-content:space-between}.content{margin:0 12px;display:block;min-height:0}.canvas-panel{min-height:560px}.inspector{width:100%;max-height:none;margin-top:14px}.inspector-empty{padding:15px}.inspector-note{display:none}.diagram-scroll{max-height:540px}.canvas-bottom{flex-wrap:wrap}.legend{gap:8px}.segments button{font-size:10px}.publish-banner{display:block}.review-panel{padding:18px}.review-panel ol{gap:15px}.story{padding:22px}.story h2{font-size:24px}.canvas-subbar{flex-wrap:wrap}footer{margin:17px 15px;gap:15px}.dependency-controls #focus{max-width:160px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}@media print{.sidebar,.topbar,.workspace-toolbar,footer,.story-controls,#notice{display:none}.main{width:100%}.content{margin:0}.story-diagram{max-height:none;overflow:visible}.diagram{width:100%!important;height:auto!important}.page-heading{padding:10px}.inspector{display:none}}
.visual-compare{border-top:1px solid #ebddd0;padding-top:12px}.compare-canvases{display:flex;gap:16px;overflow:auto}.compare-canvas{min-width:0;flex:1;background:#fffcf7;border:1px solid #e8dacb;border-radius:8px;overflow:auto}.compare-canvas h4{padding:0 15px}.compare-canvas svg{width:100%;height:auto;min-width:450px}.diff-row{width:100%;text-align:left;justify-content:flex-start}.review-panel [aria-current=step]{color:#a6470c;font-weight:700;text-decoration:underline;text-underline-offset:5px}@media(max-width:800px){nav{overflow-x:auto;justify-content:flex-start}.nav-item{flex-shrink:0}.compare-canvases{display:block}.compare-canvas{margin-bottom:15px}.compare-canvas svg{min-width:400px}}

.brand strong{font-size:17px;letter-spacing:-.4px;line-height:1.2}.brand{gap:8px;margin-left:0;margin-right:0}.brand>svg{width:25px;height:25px}.brand span{font-size:8px;letter-spacing:.2px}@media(max-width:800px){.brand strong{font-size:20px}}

/* Warm light theme: orange denotes actions and selection, not architecture status. */
:root{--canvas:#faf7f2;--surface:#fffcf8;--ink:#342b25;--muted:#756252;--accent:#a6470c;--selection:#ffead4;--line:#e8ddd2;color-scheme:light}
body{background:var(--canvas);color:var(--ink);caret-color:var(--accent)}
.brand>svg{color:var(--accent)}
.btn,.nav-item,.segments button{transition:background-color .15s ease,color .15s ease}
.mobile-view-switch{display:none}
.object-list{padding:0 16px;background:var(--surface)}
.list-summary{font-size:12px;color:var(--muted);margin:14px 0}
.object-row{display:flex;border-bottom:1px solid var(--line);align-items:stretch}
.object-open{flex:1;min-width:0;display:flex;flex-direction:column;text-align:left;gap:7px;border:0;background:none;padding:18px 0;color:var(--ink)}
.object-open strong{font-size:17px;font-weight:600;line-height:1.3}
.object-open>span:not(.object-domain),.object-open small{font-size:13px;color:var(--muted);line-height:1.5;overflow-wrap:anywhere}
.object-domain{font-size:11px;letter-spacing:.2px}
.object-drill{border:0;background:none;min-width:48px;color:var(--accent)}
.object-open:hover,.object-drill:hover{background:#fff2e4}
.inspector{overscroll-behavior:contain}
.compare-canvas figcaption{padding:12px;font-size:13px}
.review-panel .review-header{align-items:flex-start}
.review-header h2{flex-basis:100%;order:-1;margin:0 0 12px}
.diff-row{overflow-wrap:anywhere}
@media(pointer:coarse){.node{touch-action:pan-x pan-y}.btn,select,.zoom button,.text-button{min-height:44px}.connection-list button{min-height:48px}}
@media(min-width:801px) and (max-width:1100px){.sidebar{width:178px}.content{flex-wrap:wrap}.canvas-panel{flex-basis:100%}.inspector{width:100%;max-height:420px}.inspector-empty{padding:16px}.inspector-note{display:none}}
@media(max-width:800px){
 body{padding-bottom:calc(82px + env(safe-area-inset-bottom));font-size:15px}
 .sidebar{padding:18px 16px;background:var(--surface);border-bottom:1px solid var(--line)}
 .brand{margin:0;gap:9px}.brand strong{font-size:20px}.brand>svg{width:28px;height:28px}
 .sidebar nav{position:fixed;z-index:20;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:8px 6px calc(8px + env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--line);overflow:visible}
 .nav-item{position:relative;flex-direction:column;justify-content:center;gap:5px;min-height:55px;padding:6px 2px;font-size:10px;border-radius:8px;white-space:nowrap}
 .nav-item svg{width:21px;height:21px}.nav-item .count{position:absolute;top:3px;right:16px;font-size:9px;border:1px solid var(--line)}
 .topbar{background:var(--canvas);height:auto;padding:12px 16px;border-bottom:0}.header-actions{gap:8px}.header-actions>.badge{font-size:10px}.header-actions .btn{font-size:12px;padding:8px 10px}
 .btn,.review-panel button,.segments button,select,.text-button,.zoom button{min-height:44px}
 input,select,textarea,.review-panel input,.review-panel textarea,.review-panel select,.inspector input,.inspector select{font-size:16px}
 .page-heading{padding:12px 16px 22px}h1{font-size:26px;line-height:1.2;letter-spacing:-.6px}.page-heading p{font-size:14px;line-height:1.6}
 .workspace-toolbar{gap:12px}.segments{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr)}.segments button{font-size:12px;justify-content:center;overflow-wrap:anywhere}.toolbar-right label{font-size:0}.toolbar-right select{max-width:210px}
 .content{margin:0 12px}.canvas-panel{min-height:0}.canvas-controls{padding:14px}.breadcrumbs{font-size:12px;gap:7px}.breadcrumbs button{min-height:32px}.canvas-controls .badge{font-size:10px}
 .canvas-subbar{padding:12px;gap:10px;display:flex;flex-wrap:wrap;border-bottom:1px solid var(--line)}.mobile-view-switch{display:inline-flex;font-size:12px;order:1}.search{width:100%;background:#f8f1e7;border-radius:6px;padding:0 10px}.search input{width:100%;min-height:44px;font-size:16px}.canvas-subbar>div{order:2}.canvas-subbar .muted{display:none}
 .diagram-scroll{max-height:65dvh;min-height:260px;touch-action:pan-x pan-y}.diagram{min-width:0}.node{touch-action:pan-x pan-y}.canvas-bottom{padding:14px;gap:16px}.legend{font-size:11px;gap:12px}.zoom{font-size:12px;width:100%;justify-content:flex-end}.zoom button{min-width:44px}.view-caption{font-size:11px;line-height:1.5}
 .inspector{display:none}.inspector.is-open{display:block;position:fixed;z-index:25;inset:auto 8px calc(78px + env(safe-area-inset-bottom));width:auto;max-height:72dvh;margin:0;padding:18px;border-radius:16px;background:var(--surface);box-shadow:0 -12px 50px #50351d26;animation:detail-enter .2s ease-out}
 .inspector-top{position:sticky;top:-18px;background:var(--surface);z-index:1;padding:8px 0}.inspector-top button{min-width:44px}.inspector h2{font-size:23px}.inspector p,.inspector label,.inspector dl{font-size:14px}.inspector h3{font-size:16px}.connection-list button{font-size:14px;padding:12px 0}.connection-list small{font-size:12px}.inspector .btn{font-size:14px}.inspector dd{overflow-wrap:anywhere}
 .dependency-controls{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:10px}.dependency-controls label{display:flex;flex-direction:column;align-items:stretch;font-size:12px;gap:5px}.dependency-controls label:first-child{grid-column:1/-1}.dependency-controls select,.dependency-controls #focus{max-width:none;width:100%;min-width:0}.dependency-controls>select{align-self:end}.column-view{padding:14px;gap:14px}.column-view section{width:250px}.column-view h3{font-size:15px}.trace-node strong{font-size:15px}.trace-node small{font-size:12px}
 .review-panel{padding:18px 14px}.review-panel h2{font-size:23px;line-height:1.3}.review-panel h3{font-size:17px}.review-panel .muted{font-size:13px;line-height:1.6}.review-panel ol{display:grid;grid-template-columns:1fr 1fr;gap:14px;font-size:13px}.review-panel label{font-size:14px}.review-toolbar{gap:10px;justify-content:flex-start}.review-toolbar button{font-size:13px;flex-grow:1}.review-panel [role=tablist]{display:grid;grid-template-columns:repeat(3,1fr)}.review-panel [role=tab]{padding:8px;font-size:12px}.diff-row{font-size:13px!important;line-height:1.6}.comment{font-size:14px}.compare-canvas{margin:12px 0}.compare-canvas svg{min-width:620px}.compare-canvases{overflow:hidden}.publish-banner .btn{width:100%}
 .story{padding:22px 18px}.story h2{font-size:25px}.story p{font-size:15px}.story-controls{display:grid;grid-template-columns:1fr 1fr}.story-controls .btn{font-size:12px}.story-diagram{max-height:55dvh}
 footer{font-size:11px;line-height:1.5;flex-wrap:wrap}#notice{bottom:calc(90px + env(safe-area-inset-bottom));width:max-content;max-width:calc(100vw - 24px);font-size:13px}
}
@keyframes detail-enter{from{transform:translateY(16px);opacity:.8}to{transform:translateY(0);opacity:1}}
@media(prefers-reduced-motion:reduce){.inspector.is-open{animation:none}}
@media print{body{padding:0}.sidebar nav{display:none}.inspector.is-open{display:none}}

/* Keep names readable when repositories supply longer object labels. */
.object-open strong{overflow-wrap:anywhere}
*{scrollbar-color:#b99472 var(--canvas);scrollbar-width:thin}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
@media(max-width:800px){.inspector.is-open{border:0}.header-actions>.badge{flex-shrink:0}.toolbar-right select{max-width:min(210px,60vw)}}

/* Keep SVG screen scale consistent with its viewBox at every zoom level. */
.diagram{min-width:0;max-width:none;flex-shrink:0}
body{font-size:15px}
h1{font-size:29px}.page-heading p{font-size:14px}
.btn,.text-button,select,.segments button,.breadcrumbs,.nav-item{font-size:13px}
.btn{min-height:40px;padding:9px 14px}
.workspace,.profile,.side-section button{font-size:13px}
.workspace small,.profile small,.side-note p{font-size:12px}
.badge,.side-note,.legend,.view-caption,footer{font-size:12px}
.search input{font-size:14px}.muted{font-size:13px}
.inspector{width:280px}.inspector p,.inspector dl,.inspector label,.connection-list button{font-size:13px}
.inspector h3{font-size:14px}.connection-list small{font-size:12px}
.toolbar-right label,.dependency-controls label,.zoom{font-size:12px}
.review-panel button,.diff-row,.comment,.review-panel label{font-size:14px}
@media(min-width:801px){.sidebar{width:232px}.brand strong{font-size:18px}.canvas-subbar{flex-wrap:wrap;gap:8px}}
@media(min-width:801px) and (max-width:1100px){.sidebar{width:195px}.inspector{width:100%}.workspace-toolbar{flex-wrap:wrap}}
@media(max-width:800px){
 h1{font-size:28px}.page-heading p{font-size:15px}
 .nav-item{font-size:11px}.nav-item .count{font-size:10px}
 .btn{min-height:44px}.segments button{font-size:13px}.badge{font-size:11px}
 .toolbar-right label{font-size:0}.toolbar-right{gap:8px}
 .inspector.is-open{width:auto}.inspector p,.inspector dl,.inspector label,.connection-list button{font-size:15px}
 .inspector h3{font-size:17px}.inspector input,.inspector select,select{font-size:16px}
 .legend,.view-caption,footer{font-size:12px}.search input{font-size:16px}
 .object-open strong{font-size:18px}.object-open>span:not(.object-domain){font-size:14px}
 .header-actions .btn{padding:8px 9px}.header-actions>.badge{padding:4px}
}
.focus-node>rect:first-child{stroke:var(--accent);stroke-width:3;fill:#fff2e3}.focus-node{cursor:default}.diagram-scroll{scroll-behavior:auto}

.diagram-scroll,.compare-canvas,.story-diagram{cursor:grab}
.pan-ready .diagram-scroll *,.pan-ready .compare-canvas *,.pan-ready .story-diagram *{cursor:grab!important}
.is-panning,.is-panning *{cursor:grabbing!important;user-select:none}

.diagram-scroll svg,.story-diagram svg,.compare-canvas svg{touch-action:none}

/* Desktop workspaces use the remaining window height instead of a fixed canvas cap. */
@media screen and (min-width:801px){
 #app{height:100dvh;min-height:0}
 .main{height:100%;display:flex;flex-direction:column;min-height:0}
 .topbar,.page-heading,.workspace-toolbar,footer{flex-shrink:0}
 .content{flex:1;min-height:0;overflow:auto}
 #app:is([data-view="architecture"],[data-view="dependencies"]) .content{flex-wrap:nowrap;overflow:hidden}
 .canvas-panel{flex:1;min-height:0;min-width:0}
 .diagram-scroll{flex:1;min-height:0;max-height:none}
 .inspector{max-height:100%;width:280px}
 .presentation-content{display:flex;flex-direction:column;overflow:hidden}
 .presentation-content .story{flex-shrink:0}
 .story-diagram{flex:1;min-height:0;max-height:none}
}
/* Keep the viewing toolbar available when browser chrome and app navigation are hidden. */
body.viewing-fullscreen{overflow:hidden}
.viewing-fullscreen #app{height:100dvh;min-height:0}
.viewing-fullscreen .main{height:100%;display:flex;flex-direction:column;min-height:0;padding:16px}
.viewing-fullscreen :is(.sidebar,.topbar,.page-heading,footer){display:none}
.viewing-fullscreen .workspace-toolbar{flex-shrink:0;margin:0 0 12px}
.viewing-fullscreen .content{flex:1;min-height:0;margin:0;overflow:auto}
.viewing-fullscreen #app:is([data-view="architecture"],[data-view="dependencies"]) .content{display:flex;flex-wrap:nowrap;overflow:hidden}
.viewing-fullscreen .canvas-panel{flex:1;min-width:0;min-height:0}
.viewing-fullscreen .diagram-scroll{flex:1;min-height:0;max-height:none}
.viewing-fullscreen .inspector{display:none}
.viewing-fullscreen .story-diagram{flex:1;min-height:0;max-height:none}

.viewing-fullscreen .presentation-content{display:flex;flex-direction:column;overflow:hidden}
.viewing-fullscreen .presentation-content .story{flex-shrink:0}
@media(max-width:800px){.toolbar-right{flex-wrap:wrap}}

.canvas-controls{justify-content:space-between;gap:12px;flex-wrap:wrap}
.canvas-controls>.toolbar-right{margin-left:auto;justify-content:flex-end;flex-wrap:wrap;max-width:100%}
@media(max-width:800px){
 .canvas-controls>.toolbar-right{width:100%;margin-left:0;justify-content:flex-start}
}

.canvas-body{position:relative;display:flex;flex:1;min-height:0;min-width:0;overflow:hidden}
.canvas-body>.diagram-scroll{min-width:0}
@media(min-width:801px){
 .canvas-body>.inspector{position:absolute;z-index:2;top:14px;right:14px;bottom:14px;width:280px;max-width:calc(100% - 28px);margin:0;border:1px solid #d8c0a9;border-radius:12px;max-height:none;box-shadow:0 6px 24px #50351d1a}
}
@media(max-width:800px){.canvas-body{display:block;flex:1 1 auto}}
.viewing-fullscreen .canvas-body{display:flex}

.inspector[hidden]{display:none!important}
.viewing-fullscreen .inspector.is-open{display:block}
@media(max-width:800px){.canvas-body>.inspector.is-open{border:1px solid #d8c0a9}}

.drill-badge{cursor:pointer}
.drill-badge rect{fill:#fff0df;stroke:#d7a474;stroke-width:1}
.drill-badge text{fill:#97420d;font-size:14px;font-weight:700;pointer-events:none}
.drill-badge:hover rect,.drill-badge:focus-visible rect{fill:#ffdfba;stroke:#a6470c;stroke-width:2}

/* Changes: one proposal, one next action, then evidence and discussion. */
#app[data-view="changes"] .page-heading,#app[data-view="changes"] .workspace-toolbar{display:none}
#app[data-view="changes"] .content{margin-top:24px}
#app[data-view="changes"] #new-branch:disabled{display:none}
.review-panel .review-header{align-items:flex-start;gap:16px;margin-bottom:20px}
.review-title{min-width:0;flex:1}
.review-title h2{margin:0 0 8px;order:initial;font-size:24px;line-height:1.3}
.review-title p{margin:0;overflow-wrap:anywhere}
.review-header>.badge{margin:4px 0 0}
.review-decision{display:flex;gap:12px 24px;align-items:center;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid var(--line)}
.review-decision label{display:flex;align-items:center;gap:8px;margin:0}
.review-actions{margin-left:auto;justify-content:flex-start;gap:8px}
.review-consequence,.review-blocker{flex-basis:100%;margin:0;font-size:13px;color:var(--muted)}
.review-blocker{color:#97420d}
.review-more{position:relative}
.review-panel summary{cursor:pointer;font-size:14px;padding:12px 0;color:var(--ink)}
.review-more summary{padding:10px 12px}
.review-more[open]{display:flex;flex-wrap:wrap;gap:8px}
.review-more button{margin:0 4px 4px 0}
.change-summary{font-size:14px;margin:20px 0}
.review-panel .visual-compare{border:0;padding:0;margin:0 0 24px}
.comparison-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.comparison-heading h3{margin:0}
.comparison-heading .review-toolbar{justify-content:flex-start;gap:4px}
.review-panel [aria-pressed="true"]{background:var(--selection);border-color:#cf8949;color:#823508}
.comparison-legend{font-size:12px;color:var(--muted);margin:12px 0}
.review-panel .compare-canvas{margin:0;border-radius:6px}
.review-panel .compare-canvas svg{max-height:440px}
.change-details{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.change-details>summary{font-weight:600;padding:18px 0}
.change-details [role="tabpanel"]{padding-bottom:18px}
.review-panel .diff-row{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:12px 0}
.review-discussion h3{margin:0 0 12px}
.review-discussion{max-width:760px}
.comment-composer textarea{min-height:100px}
@media(max-width:800px){
 #app[data-view="changes"] .content{margin-top:16px}
 .review-title h2{font-size:22px}
 .review-decision{align-items:flex-start;gap:12px}
 .review-decision label{flex-wrap:wrap}
 .review-actions{margin-left:0;width:100%}
 .review-actions button,.comparison-heading button{flex-grow:0}
 .comparison-heading{align-items:flex-start}
 .review-header{flex-wrap:nowrap}
}
#new-branch[hidden]{display:none}
.review-decision .publish-banner{flex-basis:100%;background:none;border:0;padding:0;margin:0;gap:16px}
.review-decision .publish-banner p{margin-bottom:0}
.review-blocker{order:2}
.review-consequence{order:3}
.comparison-heading .review-toolbar{margin-left:auto}

.topbar{height:auto;min-height:67px;gap:12px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}
.topbar-context{display:flex;align-items:center;gap:24px;min-width:0;flex-wrap:wrap}
.topbar-context .segments{max-width:100%}
.topbar .header-actions{margin-left:auto}
.workspace-toolbar:empty{display:none}
.main:has(>.workspace-toolbar:empty)>.content{margin-top:18px}
.viewing-fullscreen .main:has(>.workspace-toolbar:empty)>.content{margin-top:0}
@media(max-width:800px){
 .topbar-context{width:100%;gap:8px}
 .topbar .header-actions{margin-left:0}
}



/* Diagram navigation uses the camera; only lists and detail content scroll. */
.diagram-scroll:has(>svg),.story-diagram,.compare-canvas{overflow:hidden;scrollbar-width:none;overscroll-behavior:none}
.diagram-scroll:has(>svg)::-webkit-scrollbar,.story-diagram::-webkit-scrollbar,.compare-canvas::-webkit-scrollbar{display:none}
@media print{.diagram-scroll:has(>svg),.story-diagram,.compare-canvas{overflow:visible}}

.branch-switcher{position:relative;min-width:0;max-width:100%}
.branch-trigger{display:flex;align-items:center;gap:10px;min-height:42px;max-width:100%;padding:9px 12px;border:1px solid #dfc7ae;border-radius:8px;background:#fff7ee;color:#823508;font-size:13px;font-weight:600}
.branch-trigger:hover,.branch-trigger[aria-expanded="true"]{background:#ffead4;border-color:#c68852}
.branch-trigger>svg{width:17px;height:17px}
.branch-trigger-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:240px}
.branch-chevron{display:flex;margin-left:10px}
.branch-chevron svg{width:15px;height:15px}
.branch-trigger[aria-expanded="true"] .branch-chevron{transform:rotate(180deg)}
.branch-menu{position:absolute;left:0;top:calc(100% + 8px);z-index:100;width:380px;max-width:calc(100vw - 32px);max-height:min(520px,65dvh);overflow:auto;padding:8px;background:#fffdfa;border-radius:12px;box-shadow:0 12px 40px #50351d30}
.branch-menu[hidden],.branch-check[hidden]{display:none}
.branch-option{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:12px;text-align:left;border:0;border-radius:8px;background:transparent;color:var(--ink)}
.branch-option:hover,.branch-option:focus-visible{background:#f8eee2}
.branch-option[aria-checked="true"]{background:var(--selection)}
.branch-option:disabled{cursor:not-allowed}
.branch-option-icon{color:#a77954;flex-shrink:0}
.branch-option-icon svg{width:18px;height:18px}
.branch-option-copy{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.branch-option-copy strong{font-size:13px;font-weight:600;overflow-wrap:anywhere}
.branch-option-copy small{font-size:12px;color:var(--muted);line-height:1.4}
.branch-status{font-size:11px;color:#795638;white-space:nowrap}
.branch-check{color:var(--accent);display:flex;flex-shrink:0}
.branch-check svg{width:17px;height:17px}
.branch-group-label{margin:8px 12px 2px;padding-top:12px;border-top:1px solid var(--line);font-size:12px;font-weight:600;color:var(--muted)}
@media(max-width:800px){.branch-switcher,.branch-trigger{width:100%}.branch-trigger-name{max-width:none;flex:1;text-align:left}.branch-menu{width:100%}.branch-option{gap:8px;padding:12px 8px}.branch-option-icon{display:none}.branch-status{font-size:10px}}
#zoom-reset{min-width:56px;font-variant-numeric:tabular-nums;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:4px}
#zoom-reset:hover{background:var(--selection);color:var(--accent)}
.legend i{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.legend span{gap:7px}

.component-icon{object-fit:contain;flex-shrink:0}
.object-name,.inspector-name{display:flex;align-items:center;gap:10px}
.inspector-name img{width:32px;height:32px}
.icon-picker{width:min(720px,calc(100vw - 32px));max-height:85dvh;padding:24px;border:0;border-radius:16px;background:var(--surface);color:var(--ink);box-shadow:0 16px 60px #342b2538;overflow:auto}
.icon-picker::backdrop{background:#342b2570}
.icon-picker header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.icon-picker h2{font-size:23px;margin:0 0 6px}
.icon-picker header p{margin:0 0 20px}
.icon-picker-close{font-size:26px;min-width:44px;min-height:44px}
.icon-picker-filters{display:flex;gap:16px;align-items:end}
.icon-picker-filters label{display:flex;flex-direction:column;gap:6px;font-size:13px;min-width:0}
.icon-picker-filters label:first-child{flex:1}
.icon-picker input{width:100%;min-height:42px;border:1px solid #dfcdbb;border-radius:6px;padding:10px;background:white;color:var(--ink);font:inherit}
.icon-picker select{min-height:42px;max-width:100%}
.icon-picker-count{font-size:12px;color:var(--muted);margin:16px 0 10px}
.icon-picker-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;max-height:45dvh;overflow:auto;padding:4px}
.icon-choice{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:102px;padding:12px 6px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--ink);font-size:12px;line-height:1.35}
.icon-choice img{object-fit:contain}
.icon-choice:hover{background:#fff2e3;border-color:#c68852}
.icon-choice[aria-pressed="true"]{background:var(--selection);border-color:var(--accent)}
.icon-picker-empty{grid-column:1/-1;padding:28px 8px;color:var(--muted)}
.icon-picker footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:20px 0 0;font-size:12px;color:var(--muted)}
@media(max-width:800px){.icon-picker{padding:18px;max-height:90dvh}.icon-picker-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.icon-picker-filters{flex-wrap:wrap}.icon-picker-filters label:first-child{flex-basis:100%}.icon-picker footer{display:flex;flex-wrap:wrap}.icon-picker input{font-size:16px}}
.object-technology{display:block;margin-top:3px}

/* Presentation uses the same canvas shell as Architecture; narration stays optional. */
.presentation-panel{display:flex;flex-direction:column;overflow:hidden}
.presentation-panel .canvas-controls{gap:12px;flex-wrap:wrap}
.presentation-step{display:flex;align-items:center;gap:8px;min-width:0;font-size:12px;color:#786451;flex:1}
.presentation-step select{max-width:100%;min-width:0;width:360px;font-weight:600;color:#493524}
.presentation-panel .story-diagram{border:0;border-radius:0;max-height:none;min-width:0;min-height:0;flex:1}
.presentation-panel .canvas-body{flex:1;min-height:0}
.presentation-notes{display:flex;gap:16px;align-items:baseline;padding:8px 16px;border-top:1px solid #ede0d3;font-size:12px}
.presentation-notes details{flex:1;min-width:0}
.presentation-notes summary{cursor:pointer;width:fit-content;padding:6px 0;color:#786451}
.presentation-notes p{max-width:75ch;line-height:1.6;margin:8px 0;color:#786451}
.presentation-notes .text-button{white-space:nowrap;min-height:32px}
.presentation-navigation{display:flex;align-items:center;gap:16px}
.presentation-navigation .story-count{font-size:12px;letter-spacing:0;font-variant-numeric:tabular-nums;white-space:nowrap}
#app[data-view="presentations"] .workspace-toolbar:has(>.toolbar-right:only-child){display:none}
#app[data-view="presentations"] .workspace-toolbar:empty{display:none}
@media(max-width:800px){
 .presentation-panel{height:calc(100dvh - 185px);min-height:460px}
 .presentation-step{flex-basis:100%}
 .presentation-step select{width:100%;flex:1}
 .presentation-notes{gap:8px;flex-wrap:wrap;padding:6px 12px}
 .presentation-notes details{flex-basis:100%}
 .presentation-notes summary{padding:8px 0}
 .presentation-notes p{max-height:100px;overflow:auto}
 .presentation-panel .canvas-bottom{gap:8px;padding:8px 12px}
 .presentation-navigation{gap:8px;flex:1;justify-content:space-between}
 .presentation-panel .zoom{margin-left:auto}
}
@media print{
 .presentation-panel{height:auto;overflow:visible}
 .presentation-panel :is(.canvas-controls,.canvas-bottom,.presentation-notes button,.presentation-notes summary){display:none}
 .presentation-notes details::details-content{content-visibility:visible}
 .presentation-panel .canvas-body{overflow:visible}
}
@media screen and (max-width:800px){
 .presentation-panel{height:calc(100dvh - 280px);min-height:400px}
 .presentation-panel .canvas-bottom{flex-wrap:nowrap}
 .presentation-navigation{gap:6px}
 .presentation-navigation .btn{padding:8px;font-size:12px}
 .presentation-navigation .story-count{font-size:11px}
 .presentation-panel .zoom{gap:0}
 .presentation-panel .zoom button{min-width:24px;padding:4px}
 .viewing-fullscreen .presentation-panel{height:100%;min-height:0}
}
.presentation-navigation .btn{white-space:nowrap;flex-shrink:0}
@media(max-width:800px){.presentation-panel .canvas-bottom{gap:4px}.presentation-navigation{flex:0 1 auto}.presentation-panel .zoom{flex-shrink:0}}
.presentation-panel .canvas-body{display:flex}
.presentation-panel .story-diagram{height:auto}
@media(max-width:800px){.presentation-panel .zoom{width:auto}}
.presentation-panel{overflow:visible}
.presentation-panel .canvas-body{overflow:hidden}
.presentation-selectors{display:flex;gap:8px;flex:1;min-width:0;flex-wrap:wrap}
.presentation-menu .branch-trigger{gap:8px;max-width:100%;background:#fffdfa}
.presentation-menu-label{font-size:11px;font-weight:400;color:#786451}
.presentation-menu .branch-trigger-name{max-width:230px;font-size:12px}
.presentation-menu .branch-option[aria-checked="true"]{background:#fff0df;color:#923b08;font-weight:600}
.presentation-menu .branch-menu{width:330px;max-width:calc(100vw - 48px)}
.presentation-flow{animation:flow-travel 1s linear infinite;pointer-events:none}
@keyframes flow-travel{to{stroke-dashoffset:-20}}
@media(prefers-reduced-motion:reduce){.presentation-flow{animation:none}}
@media(max-width:800px){
 .presentation-selectors{flex-basis:100%;flex-wrap:nowrap}
 .presentation-menu{flex:1;min-width:0;width:auto}
 .presentation-menu .branch-trigger{padding:8px;min-height:56px;flex-wrap:wrap;gap:2px 4px}
 .presentation-menu-label{flex-basis:100%;text-align:left}
 .presentation-menu .branch-trigger-name{font-size:11px;max-width:calc(100% - 24px)}
 .presentation-menu:last-child .branch-menu{left:auto;right:0}
 .presentation-menu .branch-menu{width:300px}
}
@media(max-width:360px){
 .presentation-panel .canvas-bottom{flex-wrap:wrap}
 .presentation-navigation{flex-basis:100%}
}