:root{color-scheme:light;font-family:IBM Plex Sans,Avenir Next,sans-serif;background:radial-gradient(circle at top left,rgba(18,102,79,.16),transparent 28%),linear-gradient(180deg,#f5f0e7,#efe7d6);color:#18212b;line-height:1.5;font-weight:400}*{box-sizing:border-box}html,body,#root{min-height:100%;height:100%;width:100%;overflow-x:hidden}body{margin:0;overflow-x:hidden}button,textarea{font:inherit}button{cursor:pointer}.workspace-shell{display:grid;grid-template-columns:360px minmax(0,1fr);gap:16px;height:100svh;overflow:hidden;align-items:stretch;width:100%;max-width:100%;isolation:isolate;position:relative}.left-rail{width:100%;max-width:360px;padding:24px;display:grid;gap:16px;border-right:1px solid rgba(24,33,43,.08);background:#fbf8f2;height:100%;align-content:start;align-self:stretch;min-width:0;overflow-y:auto;overflow-x:hidden;position:relative;z-index:2;overflow-wrap:break-word;word-break:break-word}.brand-block{padding:16px 18px;border-radius:16px;border:1px solid rgba(18,102,79,.12);background:#fffdf8;display:grid;gap:6px}.brand-block h1,.stage-header h2{margin:0}.brand-block h1{font-size:clamp(1.1rem,3.5vw,1.5rem);line-height:1.2;overflow-wrap:break-word}.brand-subhead{margin:0;font-size:.8rem;color:#52606d;line-height:1.45}.brand-block p:last-child,.stage-header p,.panel-footnote,.empty-state,.project-card span,.detail-grid dt{color:#52606d}.eyebrow{margin:0 0 8px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:#12664f}.brand-mark{width:44px;height:44px;border-radius:14px;background:radial-gradient(circle at top,#e6f6ef,#c7eadb 45%,#b2dcc9);display:inline-flex;align-items:center;justify-content:center;margin-bottom:12px;box-shadow:0 12px 20px #1234282e}.brand-mark svg{width:28px;height:28px}.panel{background:#fffdf8;border:1px solid rgba(24,33,43,.12);border-radius:16px;padding:16px;min-width:0;max-width:100%}.section-title{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}.section-title h2,.section-title h3{margin:0;font-size:1rem;line-height:1.3}.canvas-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:4px}.canvas-discard,.canvas-commit{padding:10px 0;border-radius:12px;border:0;font:inherit;font-size:.875rem;font-weight:600;cursor:pointer;text-align:center;white-space:nowrap}.canvas-discard{background:#8f3b2e1a;color:#8f3b2e;border:1px solid rgba(143,59,46,.18)}.canvas-discard:hover{background:#8f3b2e29}.canvas-commit{background:#12664f;color:#fff}.canvas-commit:hover{background:#0f5540}.badge,.status-chip{display:inline-flex;align-items:center;border-radius:999px;padding:8px 12px;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.badge{background:#18212b14;color:#314054}.status-chip{background:#12664f1f;color:#12664f}textarea{width:100%;max-width:100%;resize:vertical;border:1px solid rgba(24,33,43,.12);border-radius:16px;padding:14px;background:#fff}.primary-button,.ghost-button,.project-card{border:0;border-radius:16px}.primary-button,.ghost-button{padding:12px 14px}.primary-button{margin-top:12px;width:100%;background:#12664f;color:#fff}.primary-button:disabled{opacity:.5;cursor:not-allowed}.ghost-button{background:#12664f14;color:#12664f}.panel-footnote{margin-bottom:0}.error-text{margin:8px 0 0;color:#8f3b2e;font-size:.9rem}.project-list{display:grid;gap:10px}.project-card{width:100%;display:grid;gap:4px;text-align:left;padding:14px;background:#ffffffb3;border:1px solid transparent}.project-card.active{background:#12664f1a;border-color:#12664f38}.detail-grid{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.detail-grid div{min-width:0}.detail-grid dt{font-size:.8rem;margin-bottom:2px}.detail-grid dd{margin:0;font-weight:600}.main-stage{padding:24px;display:grid;grid-template-rows:auto auto 1fr;gap:18px;height:100%;min-height:0;min-width:0;overflow:hidden;position:relative;z-index:1}.stage-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:start;width:100%}.stage-header>*{min-width:0}.stage-actions{display:flex;flex-direction:row;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;min-width:0}.canvas-frame{min-height:0;border:1px solid rgba(24,33,43,.12);border-radius:18px;overflow:hidden;background:#fff;display:flex;flex-direction:column;max-width:100%}.preview-frame{flex:1 1 0;min-height:0;overflow:hidden;background:#fff;display:flex;flex-direction:column;max-width:100%}.preview-frame iframe{display:block;width:100%;height:100%;border:0;background:#fff}.spec-editor{font-family:IBM Plex Mono,SFMono-Regular,ui-monospace,monospace;font-size:.82rem;line-height:1.45}.canvas-grid{display:grid;gap:10px}.canvas-block h3{margin:0 0 10px}.field-grid{display:grid;gap:6px}.field-grid label{display:grid;gap:4px;font-size:.8rem}.field-grid input[type=color]{width:100%;height:30px;border-radius:12px;border:1px solid rgba(24,33,43,.12);padding:2px;background:#fff}.field-grid input,.field-grid textarea{border:1px solid rgba(24,33,43,.12);border-radius:12px;padding:8px 10px;font-size:.85rem}.add-component-row{display:grid;gap:12px}.add-component-row select{border:1px solid rgba(24,33,43,.12);border-radius:12px;padding:10px 12px;background:#fff;font:inherit}.component-list{display:grid;gap:8px}.component-card{border-radius:16px;border:1px solid rgba(18,102,79,.12);padding:8px;background:#ffffffb3;display:grid;gap:8px;cursor:grab;transition:transform .2s ease,box-shadow .2s ease}.component-card:focus-within{outline:2px solid rgba(18,102,79,.25);outline-offset:2px}.component-card.dragging{cursor:grabbing;transform:scale(.98);box-shadow:0 20px 40px #0f172a29;background:#ffffffe6}.component-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}.component-actions{display:flex;gap:4px;flex-wrap:wrap}.spec-actions{display:flex;gap:8px}.tips-panel ul{margin:0;padding-left:18px;color:#52606d}.templates-panel{flex:1 1 0;min-height:0;overflow-y:auto;padding:16px;max-width:100%}.template-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.template-card{display:flex;flex-direction:column;gap:10px;border-radius:16px;border:1px solid rgba(18,102,79,.12);padding:16px 14px;background:#ffffffbf}.template-card strong{font-size:.875rem;line-height:1.3}.template-card .ghost-button{margin-top:auto;padding:8px 12px;font-size:.82rem;text-align:center;width:fit-content}.template-copy{margin:0;color:#52606d;font-size:.8rem;line-height:1.5;flex:1}.info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0}.info-grid dt{font-size:.75rem;color:#52606d;text-transform:uppercase;letter-spacing:.08em}.info-grid dd{margin:4px 0 0;font-weight:600}.feedback-block{display:grid;gap:10px}.company-footer{margin-top:18px;margin-bottom:0;padding:20px;border-radius:16px;border:1px solid rgba(24,33,43,.12);background:#fffdf8;display:grid;gap:16px;max-width:100%}.company-footer h3{margin:0 0 6px}.company-footer p{margin:0;color:#52606d}.footer-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.footer-grid dt{font-size:.75rem;color:#52606d;text-transform:uppercase;letter-spacing:.08em}.footer-grid dd{margin:6px 0 0;font-weight:600}.footer-grid a{color:#12664f;text-decoration:none}.footer-grid a:hover{text-decoration:underline}.footer-note{margin-top:6px;font-size:.85rem;color:#8a6a00}.empty-preview,.error-banner{padding:20px}.error-banner{color:#8f3b2e;border-bottom:1px solid rgba(143,59,46,.14);background:#8f3b2e0f}.warning-banner{display:grid;gap:6px;padding:16px 20px;color:#8a6a00;border-bottom:1px solid rgba(138,106,0,.18);background:#ffc83d2e;font-size:.9rem}.modal-backdrop{position:fixed;inset:0;background:#0a0e1466;display:grid;place-items:center;padding:24px;z-index:50}.modal{width:min(560px,100%);background:#fffaf4;border:1px solid rgba(18,102,79,.2);border-radius:20px;padding:24px;display:grid;gap:18px;box-shadow:0 24px 64px #0f172a2e}.modal h3{margin:6px 0 8px}.modal-copy{margin:0;color:#52606d}.plan-list{margin:12px 0 0;padding-left:20px;color:#1f2933}.plan-list li{margin-bottom:8px}.modal-actions{display:flex;gap:12px;justify-content:flex-end}.stat-callout{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:linear-gradient(135deg,#12664f17,#12664f0a);border:1px solid rgba(18,102,79,.18);margin-top:6px}.stat-number{font-size:1.65rem;font-weight:800;color:#12664f;line-height:1;letter-spacing:-.02em;flex-shrink:0;white-space:nowrap}.stat-context{display:grid;gap:2px}.stat-context strong{font-size:.8rem;font-weight:700;color:#12664f;line-height:1.3}.stat-context span{font-size:.75rem;color:#52606d;line-height:1.4}.how-it-works{display:flex;align-items:center;gap:8px;padding:12px 14px;border-radius:12px;background:#12664f0f;border:1px solid rgba(18,102,79,.1);font-size:.78rem;flex-wrap:wrap}.hiw-step{display:flex;align-items:center;gap:6px;font-weight:500;color:#18212b}.hiw-num{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#12664f;color:#fff;font-size:.7rem;font-weight:700;flex-shrink:0}.hiw-arrow{color:#a0aec0;font-size:.8rem}.prompt-intake{background:var(--surface, #fff);border:1px solid rgba(24,33,43,.1);border-radius:16px;padding:16px 18px}.prompt-row--structured{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.prompt-label{font-size:.9rem;font-weight:500;color:#52606d;white-space:nowrap}.prompt-select{border-radius:8px;border:1px solid rgba(24,33,43,.18);padding:8px 12px;font:inherit;font-size:.875rem;background:#fafafa;color:inherit;cursor:pointer}.prompt-select:focus{outline:2px solid rgba(18,102,79,.4);outline-offset:1px}.prompt-select--domain{flex:1;min-width:180px}.offline-toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:#12664f;color:#fff;padding:12px 22px;border-radius:999px;font-size:.875rem;font-weight:500;box-shadow:0 4px 20px #0000002e;z-index:200;animation:slideUp .3s ease-out,fadeOut .4s ease-in 4.6s forwards;white-space:nowrap}@keyframes slideUp{0%{opacity:0;transform:translate(-50%) translateY(12px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.template-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.template-type-badge{flex-shrink:0;font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;padding:2px 7px;border-radius:999px;background:#12664f1a;color:#12664f}.why-appmint{padding:14px 16px;border-radius:12px;background:#fff9;border:1px solid rgba(18,102,79,.1)}.why-title{margin:0 0 8px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#52606d}.why-list{margin:0;padding:0;list-style:none;display:grid;gap:5px}.why-list li{font-size:.8rem;color:#18212b;display:flex;align-items:center;gap:7px}.why-check{color:#12664f;font-weight:700;flex-shrink:0}@media(max-width:980px){html,body,#root{height:auto;min-height:100%;overflow-y:auto}.workspace-shell{grid-template-columns:1fr;height:auto;min-height:100svh;overflow:visible}.left-rail{width:100%;max-width:none;height:auto;overflow-y:visible;border-right:0;border-bottom:1px solid rgba(24,33,43,.08)}.main-stage{height:auto;overflow:visible;grid-template-rows:auto auto auto}.stage-header{grid-template-columns:1fr}.canvas-frame{height:70vh;min-height:380px}.preview-frame{height:100%;flex:1 1 auto}.preview-frame iframe{height:100%}}