:root{color-scheme:dark;--bg: #0b0e13;--bg-2: #12171f;--bg-3: #181e28;--line: #2a3342;--text: #e7edf4;--muted: #8b98a8;--accent: #4c9bd6;--accent-2: #3d7eae;--ok: #3fbf7f;--bad: #e05c5c;--warn: #d6a441;--radius: 8px;font-family:IBM Plex Sans,system-ui,sans-serif;font-size:13.5px;line-height:1.4;color:var(--text);background:var(--bg)}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}button,input,select{font:inherit;color:inherit}code{font-family:IBM Plex Mono,ui-monospace,monospace;font-size:12px}.app{height:100%;display:grid;grid-template-columns:360px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"top top" "side view" "bottom bottom"}.topbar{grid-area:top;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:6px 12px;border-bottom:1px solid var(--line);background:var(--bg-2)}.topbar-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.title-block{display:flex;align-items:center;gap:10px;min-width:0}.title-input{background:transparent;border:none;font-size:16px;font-weight:600;padding:0;width:min(280px,40vw)}.title-input:focus{outline:none;box-shadow:0 1px 0 var(--accent)}.units-select{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:11px}.units-select select{width:auto;padding:2px 6px}.sidebar{grid-area:side;overflow:auto;border-right:1px solid var(--line);background:var(--bg-2);padding-bottom:24px}.viewport{grid-area:view;position:relative;min-width:0;min-height:0;overflow:hidden;background:#0b0e13}.viewport canvas{display:block;width:100%!important;height:100%!important}.viewport-chrome{position:absolute;top:10px;right:10px;z-index:2;display:flex;align-items:center;gap:8px;padding:4px 6px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius)}.viewport-banner{position:absolute;left:12px;right:88px;bottom:12px;z-index:2;max-height:40%;overflow:auto;background:var(--bg-2);border:1px solid var(--bad);border-radius:var(--radius);padding:8px 10px}.viewport-banner p{margin:0 0 4px;color:var(--bad)}.viewport-banner p:last-child{margin:0}.bottom{grid-area:bottom;display:flex;justify-content:space-between;gap:16px;align-items:stretch;padding:10px 16px;border-top:1px solid var(--line);background:var(--bg-2)}.panel-section{padding:8px 12px 6px;border-bottom:1px solid var(--line)}.panel-section header{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}.panel-section h2{margin:0;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}.section-toggle{display:flex;align-items:center;gap:6px;background:none;border:none;padding:0;cursor:pointer;color:inherit}.section-toggle .chevron{color:var(--muted);font-size:11px;width:.9em}.section-actions{margin-bottom:8px}.field-group{margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}.field-group:first-of-type{border-top:none;padding-top:0;margin-top:0}.field-group h3{margin:0 0 6px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}.planform-sketch{display:block;width:100%;height:72px;margin:2px 0 8px}.planform-sketch polygon{fill:#1e2834;stroke:var(--accent);stroke-width:1.5;vector-effect:non-scaling-stroke}.stack{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.card{background:var(--bg-3);border:1px solid var(--line);border-radius:var(--radius);padding:4px 8px 6px}.card.invalid{border-color:var(--bad)}.card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:2px}.card-head strong{font-size:12px;font-weight:600}.field{display:grid;grid-template-columns:1fr 1fr;gap:6px;align-items:center;margin:1px 0;min-height:22px}.field>span:first-child{color:var(--muted);font-size:11px;line-height:1.2}.field.invalid>span:first-child{color:var(--bad)}.field.disabled{opacity:.65}.field-input{display:flex;align-items:center;gap:6px}.field-input em{font-style:normal;color:var(--muted);font-size:11px;min-width:1.5em}.field-input input,input[type=email],input[type=password],select,.inline-name{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:4px;padding:2px 6px;line-height:1.25}.field.invalid input,.field.invalid select{border-color:var(--bad)}.inline-name{font-weight:600}.btn-row{display:flex;gap:4px}.btn-row.wrap{flex-wrap:wrap}.btn{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:3px 7px;cursor:pointer}.btn:hover:not(:disabled){border-color:var(--accent)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.primary{background:var(--accent-2);border-color:var(--accent);font-weight:600;padding:8px 14px}.btn.icon{width:22px;height:22px;padding:0;line-height:1}.btn.danger:hover:not(:disabled){border-color:var(--bad);color:var(--bad)}.menu{display:flex;align-items:center;gap:4px;position:relative}.menu-pop{position:absolute;top:calc(100% + 6px);right:0;width:min(320px,80vw);background:var(--bg-3);border:1px solid var(--line);border-radius:var(--radius);padding:8px;z-index:30;box-shadow:0 10px 28px #0007}.library-list{list-style:none;margin:6px 0 0;padding:0;max-height:240px;overflow:auto}.library-list li{display:flex;gap:4px;align-items:center}.library-load{flex:1;min-width:0;text-align:left;background:none;border:none;padding:4px 6px;cursor:pointer;display:flex;flex-direction:column}.library-load strong{font-size:12px}.library-load span{font-size:10px;color:var(--muted)}.library-load:hover{background:var(--bg);border-radius:4px}.muted{color:var(--muted)}.tiny{font-size:11px;margin:6px 0 0}.error{color:var(--bad);margin:6px 0}.warn{color:var(--warn);margin:6px 0}.hint{color:var(--muted);margin:6px 0;font-size:12px}.check{display:flex;align-items:center;gap:6px;color:var(--muted)}.atom-list{list-style:none;margin:0 0 8px;padding:0;font-size:11px;display:flex;flex-direction:column;gap:2px}.atom-list li{display:flex;gap:8px;align-items:baseline}.atom-list code{color:var(--muted);min-width:1.25em}.member-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px 6px;font-size:11px}.quality{flex:1;min-width:0}.quality-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.quality-summary{color:var(--text);min-width:0}.pill{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:99px;border:1px solid var(--line)}.pill.ok{color:var(--ok);border-color:var(--ok)}.pill.bad{color:var(--bad);border-color:var(--bad)}.pill.busy{color:var(--accent);border-color:var(--accent)}.pill.warn{color:var(--warn);border-color:var(--warn)}.persist-status{font-size:11px;color:var(--muted);white-space:nowrap}.persist-status.error{color:var(--bad)}.metrics{display:flex;flex-wrap:wrap;gap:12px 20px;margin:8px 0 0}.metrics div{min-width:120px}.metrics dt{color:var(--muted);font-size:11px}.metrics dd{margin:0;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:12px}.export{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.lock-block{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-right:12px;margin-right:4px;border-right:1px solid var(--line)}.lock-detail{margin:0}.lock-error{margin:0;font-size:11px}.login-shell{min-height:100%;display:grid;place-items:center;padding:24px;background:radial-gradient(1200px 500px at 50% -10%,#1a2a3d 0%,transparent 60%),var(--bg)}.login-card{width:min(420px,100%);background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:28px 24px;display:flex;flex-direction:column;gap:8px}.login-card h1{margin:0 0 4px;font-size:26px}.login-card .field{grid-template-columns:1fr}.login-card .eyebrow{margin:0;text-transform:uppercase;letter-spacing:.12em;font-size:10px;color:var(--muted)}.boot{padding:48px;text-align:center;color:var(--muted)}.home{min-height:100%;overflow:auto;background:radial-gradient(1200px 500px at 50% -10%,#1a2a3d 0%,transparent 60%),var(--bg)}.home a{color:var(--accent)}.home-top{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid var(--line)}.home-main{width:min(720px,calc(100% - 40px));margin:0 auto;padding:48px 0 80px}.home-main h1{margin:8px 0 16px;font-size:36px;line-height:1.15}.home-lead{color:var(--muted);font-size:16px}.home-steps{margin:24px 0;padding-left:20px;display:flex;flex-direction:column;gap:12px}.home-card{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin:16px 0}.home-card h2{margin:0 0 8px;font-size:16px}.home-card p{margin:0 0 8px;color:var(--muted)}.home-card p:last-child{margin-bottom:0}.projects-page{min-height:100%;overflow:auto;padding:24px;width:min(860px,100%);margin:0 auto}.projects-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}.projects-top h1{margin:4px 0 6px}.projects-create{display:flex;gap:10px;align-items:end;margin-bottom:20px}.projects-create .field{flex:1;grid-template-columns:1fr;margin:0}.project-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.project-row{display:flex;gap:8px;align-items:center;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);padding:8px 10px}.project-open{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;color:inherit;text-decoration:none}.project-open:hover strong{color:var(--accent)}.project-shell{height:100%;display:flex;flex-direction:column;min-height:0}.project-chrome{flex:0 0 auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:6px 12px;border-bottom:1px solid var(--line);background:var(--bg-2)}.project-chrome-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.phase-nav{display:flex;gap:4px;margin-left:auto}.phase-tab{color:var(--muted);text-decoration:none;padding:4px 10px;border-radius:6px;border:1px solid transparent}.phase-tab.active{color:var(--text);border-color:var(--line);background:var(--bg)}.project-body{flex:1;min-height:0;display:flex;flex-direction:column}.project-body .app{height:100%}.phase-placeholder{padding:32px 24px;width:min(640px,100%)}.phase-placeholder .pill{margin-right:8px}.login-card a{color:var(--accent)}@media (max-width: 960px){.app{height:auto;min-height:100%;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(280px,50vh) auto auto;grid-template-areas:"top" "view" "bottom" "side"}.sidebar{overflow:visible;border-right:none}.title-input{width:min(280px,55vw)}}
