:root{--color-white:#fff;--color-canvas:#f4f6f9;--color-ink:#0a1b38;--color-ink-soft:#566173;--color-border:#d9dee7;--color-border-strong:#aeb8c7;--color-gold:#c8a74a;--color-red:#d9202f;--shadow-subtle:0 18px 45px #0a1b3814;--radius-small:6px;--radius-medium:10px;--font-ui:Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-heading:"Arial Narrow", "Roboto Condensed", var(--font-ui)}*,:before,:after{box-sizing:border-box}html{color-scheme:light;background:var(--color-white);font-family:var(--font-ui)}body{min-width:320px;color:var(--color-ink);background:var(--color-white);-webkit-font-smoothing:antialiased;margin:0;font-size:15px;line-height:1.5}button,textarea{color:inherit;font:inherit}button:focus-visible,textarea:focus-visible,input:focus-visible,a:focus-visible{outline-offset:2px;outline:3px solid #c8a74a66}h1,h2,p,figure{margin:0}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.site-header{border-bottom:1px solid var(--color-border);background:var(--color-white);align-items:center;min-height:72px;padding:0 30px;display:flex}.site-header__inner{width:100%;max-width:1500px;margin:0 auto}.brand{color:var(--color-ink);font-family:var(--font-heading);align-items:center;gap:11px;font-size:20px;font-weight:800;text-decoration:none;display:inline-flex}.brand__mark{flex:none;width:40px;height:40px}.designer{width:min(100% - 48px,1500px);margin:0 auto;padding:30px 0 48px}.designer__intro{margin-bottom:22px}.designer__intro h1{font-family:var(--font-heading);font-size:clamp(26px,4vw,38px);line-height:1.1}.designer__intro p{color:var(--color-ink-soft);margin-top:7px}.designer__layout{grid-template-columns:minmax(300px,380px) minmax(0,1fr);align-items:start;gap:18px;display:grid}.controls,.preview{border:1px solid var(--color-border);border-radius:var(--radius-medium);background:var(--color-white);box-shadow:var(--shadow-subtle)}.controls{flex-direction:column;height:620px;min-height:500px;max-height:calc(100vh - 36px);display:flex;position:sticky;top:18px;overflow:hidden}.chat-panel__header{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;gap:16px;padding:18px 20px 16px;display:flex}.chat-panel__header h2{font-family:var(--font-heading);font-size:20px;line-height:1.1}.chat-panel__eyebrow{color:var(--color-red);letter-spacing:.14em;margin-bottom:3px;font-size:9px;font-weight:800}.chat-panel__session{border:1px solid var(--color-border);color:var(--color-ink-soft);border-radius:999px;flex:none;padding:4px 7px;font-size:9px;font-weight:700}.chat-messages{overscroll-behavior:contain;scrollbar-gutter:stable;background:#fbfcfd;flex-direction:column;flex:auto;gap:12px;min-height:0;padding:18px;display:flex;overflow-y:auto}.chat-message{border:1px solid var(--color-border);background:var(--color-white);overflow-wrap:anywhere;border-radius:12px 12px 12px 3px;width:fit-content;max-width:88%;padding:10px 12px;box-shadow:0 4px 14px #0a1b380a}.chat-message[data-role=user]{color:var(--color-white);border-color:var(--color-ink);background:var(--color-ink);border-radius:12px 12px 3px;align-self:flex-end}.chat-message[data-status=generating]{border-color:#c8a74a8c;animation:1.6s ease-in-out infinite chat-pulse}.chat-message[data-status=error]{color:#9d1723;background:#fff8f8;border-color:#d9202f59}.chat-message__label{color:var(--color-ink-soft);letter-spacing:.08em;margin-bottom:3px;font-size:9px;font-weight:800;display:block}.chat-message[data-role=user] .chat-message__label{color:#ffffffad}.chat-message p{white-space:pre-wrap;font-size:12px;line-height:1.5}.chat-composer{border-top:1px solid var(--color-border);background:var(--color-white);flex:none;padding:14px}.panel-selector{border:0;min-width:0;margin:0 0 10px;padding:0}.panel-selector legend{color:var(--color-ink-soft);margin-bottom:6px;padding:0;font-size:10px;font-weight:750}.panel-selector__options{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;display:grid}.panel-selector__groups{gap:8px;display:grid}.panel-selector__group>span{color:var(--color-ink-soft);margin-bottom:4px;font-size:9px;font-weight:750;display:block}.panel-selector label{border:1px solid var(--color-border);border-radius:var(--radius-small);min-height:30px;color:var(--color-ink-soft);cursor:pointer;background:#fbfcfd;justify-content:center;align-items:center;gap:4px;padding:4px 5px;font-size:9px;font-weight:700;display:flex}.panel-selector label[data-selected=true]{color:var(--color-ink);background:#c8a74a1a;border-color:#c8a74abf}.panel-selector input{width:12px;height:12px;accent-color:var(--color-ink);margin:0}.panel-selector:disabled label{cursor:default}.panel-selector p{color:var(--color-ink-soft);margin-top:5px;font-size:9px}.chat-composer__box{border:1px solid var(--color-border-strong);border-radius:var(--radius-medium);background:var(--color-white);padding:10px;box-shadow:0 5px 16px #0a1b380f}.chat-composer__box:focus-within{border-color:var(--color-gold);box-shadow:0 0 0 3px #c8a74a21}.chat-composer textarea{resize:none;background:0 0;border:0;outline:0;width:100%;min-height:66px;max-height:130px;padding:0;line-height:1.45;display:block}.chat-composer textarea::placeholder{color:#7c8696;opacity:1}.chat-composer textarea:disabled{color:var(--color-ink-soft);cursor:wait}.chat-composer__actions{color:var(--color-ink-soft);justify-content:space-between;align-items:center;gap:10px;margin-top:5px;font-size:9px;display:flex}.chat-send{border:1px solid var(--color-ink);border-radius:var(--radius-small);min-height:34px;color:var(--color-white);background:var(--color-ink);cursor:pointer;justify-content:center;align-items:center;gap:6px;padding:0 12px;font-weight:750;display:inline-flex}.chat-send svg{width:15px;height:15px;fill:var(--color-gold);stroke:none}.chat-send:not(:disabled):hover{background:#162f59;border-color:#162f59}.chat-send:disabled{cursor:not-allowed;opacity:.62}.generation-disclosure{color:var(--color-ink-soft);margin-top:7px;font-size:9px;line-height:1.4}@keyframes chat-pulse{0%,to{opacity:1}50%{opacity:.62}}.preview{min-height:620px;padding:24px}.section-heading{margin-bottom:14px}.section-heading h2{font-family:var(--font-heading);font-size:23px;line-height:1.1}.section-heading p{color:var(--color-ink-soft);margin-top:6px;font-size:12px}.preview__stage{border:1px solid var(--color-border);border-radius:var(--radius-medium);background-color:var(--color-canvas);background-image:linear-gradient(#aeb8c724 1px,#0000 1px),linear-gradient(90deg,#aeb8c724 1px,#0000 1px);background-size:32px 32px;min-height:525px;padding:18px;display:flex;position:relative;overflow:hidden}.uniform-preview-canvas{border-radius:calc(var(--radius-medium) - 2px);background:radial-gradient(circle at 50% 43%,#ffffffc7,#fff0 66%);flex:auto;min-height:485px;position:relative;overflow:hidden}.uniform-preview-canvas__host{position:absolute;inset:0}.uniform-preview-canvas__host canvas{cursor:grab;outline:none;width:100%;height:100%;display:block}.uniform-preview-canvas__host canvas:active{cursor:grabbing}.uniform-preview-canvas__status,.uniform-preview-canvas__fallback{max-width:calc(100% - 20px);color:var(--color-ink-soft);pointer-events:none;background:#ffffffe6;border:1px solid #c8a74a6b;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:650;position:absolute;top:10px;left:10px;box-shadow:0 4px 15px #0a1b380f}.uniform-preview-canvas__status[data-phase=ready]{color:var(--color-ink)}.uniform-preview-canvas__status[data-phase=error],.uniform-preview-canvas__fallback{color:#9d1723;border-color:#d9202f59}.uniform-preview-canvas__fallback{border-radius:var(--radius-small);text-align:center;width:min(330px,100% - 32px);max-width:none;padding:18px 20px;top:50%;left:50%;transform:translate(-50%,-50%)}.uniform-preview-canvas__fallback strong,.uniform-preview-canvas__fallback span{display:block}.uniform-preview-canvas__fallback strong{color:var(--color-ink);margin-bottom:5px;font-size:15px}.uniform-preview-canvas__fallback span{color:var(--color-ink-soft);font-size:11px;font-weight:500;line-height:1.5}.legal-page{background:var(--color-canvas);min-height:calc(100vh - 136px);padding:44px 20px}.legal-page article{border:1px solid var(--color-border);background:var(--color-white);width:min(100%,820px);box-shadow:var(--shadow-subtle);border-radius:14px;margin:0 auto;padding:36px}.legal-eyebrow{color:var(--color-red);letter-spacing:.16em;font-size:11px;font-weight:800}.legal-page h1{font-family:var(--font-heading);margin:4px 0 8px;font-size:clamp(28px,5vw,40px);line-height:1.1}.legal-page__version{color:var(--color-ink-soft);font-size:12px}.legal-page section{margin-top:28px}.legal-page section h2{margin:0 0 8px;font-size:18px}.legal-page section p{color:#38465c;line-height:1.85}.legal-footer{border-top:1px solid var(--color-border);background:var(--color-white);justify-content:center;align-items:center;gap:24px;min-height:64px;padding:12px 24px;font-size:12px;display:flex}.legal-footer a{color:var(--color-ink)}@media (width<=820px){.site-header{min-height:68px;padding:0 22px}.designer{width:min(100% - 32px,1500px);padding-top:24px}.designer__layout{grid-template-columns:1fr}.controls{height:560px;max-height:none;position:static}.preview{min-height:560px}.preview__stage{min-height:470px}.uniform-preview-canvas{min-height:430px}}@media (width<=480px){.site-header{padding-inline:16px}.brand{font-size:17px}.brand__mark{width:36px;height:36px}.designer{width:min(100% - 24px,1500px)}.preview{padding:18px}.controls{min-height:500px}.preview,.preview__stage{min-height:440px}.uniform-preview-canvas{min-height:400px}.legal-page{padding:28px 12px}.legal-page article{padding:24px 20px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (forced-colors:active){button:focus-visible,textarea:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid canvastext}.chat-composer__box:focus-within{box-shadow:none;border-color:canvastext}}