: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{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background:var(--color-white);font-family:var(--font-ui)}body{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__intro .designer__integration-note{border-radius:var(--radius-small);color:#66500e;background:#fffaf0;border:1px solid #c8a74a6b;width:fit-content;max-width:760px;padding:7px 10px;font-size:11px;font-weight:650}.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}.designer-key{border:1px solid var(--color-border);border-radius:var(--radius-medium);background:var(--color-white);width:min(100%,380px);box-shadow:var(--shadow-subtle);margin-bottom:12px;padding:14px 20px}.designer-key label{color:var(--color-ink);margin-bottom:6px;font-size:10px;font-weight:750;display:block}.designer-key input{border:1px solid var(--color-border-strong);border-radius:var(--radius-small);width:100%;min-height:36px;color:var(--color-ink);background:var(--color-white);outline:0;padding:7px 10px}.designer-key input:focus{border-color:var(--color-gold);box-shadow:0 0 0 3px #c8a74a21}.designer-key input[aria-invalid=true]{border-color:#d9202fa6}.designer-key p{color:var(--color-ink-soft);margin-top:5px;font-size:9px;line-height:1.35}.designer-key input[aria-invalid=true]+p{color:#9d1723}.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}.preview__heading{justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:14px;display:flex}.preview__heading h2{font-family:var(--font-heading);font-size:23px;line-height:1.1}.preview__heading p{color:var(--color-ink-soft);margin-top:6px;font-size:12px}.preview-tabs{border:1px solid var(--color-border);background:var(--color-canvas);border-radius:8px;flex:none;padding:3px;display:inline-flex}.preview-tabs button{min-height:34px;color:var(--color-ink-soft);cursor:pointer;background:0 0;border:0;border-radius:5px;padding:0 13px;font-size:11px;font-weight:750}.preview-tabs button[aria-selected=true]{color:var(--color-white);background:var(--color-ink);box-shadow:0 3px 8px #0a1b3829}.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}.preview__stage[data-view="2d"]{background-color:#fbfcfd;padding:0}.uniform-2d-preview{border-radius:calc(var(--radius-medium) - 2px);background:#ffffffe6;flex-direction:column;flex:auto;min-width:0;min-height:485px;display:flex;overflow:hidden}.uniform-2d-preview__toolbar{border-bottom:1px solid var(--color-border);background:var(--color-white);grid-template-columns:minmax(120px,auto) minmax(240px,1fr) auto;align-items:center;gap:16px;padding:12px 14px;display:grid}.uniform-2d-preview__selection span,.uniform-2d-preview__selection strong{display:block}.uniform-2d-preview__selection span{color:var(--color-ink-soft);font-size:9px;font-weight:750}.uniform-2d-preview__selection strong{margin-top:1px;font-size:12px}.uniform-2d-preview__scale-control{grid-template-columns:30px minmax(140px,1fr) 30px;align-items:end;gap:8px;display:grid}.uniform-2d-preview__scale-control label{gap:3px;display:grid}.uniform-2d-preview__scale-control label span{color:var(--color-ink-soft);font-size:9px;font-weight:750}.uniform-2d-preview__scale-control input{width:100%;height:22px;accent-color:var(--color-ink);cursor:pointer;margin:0}.uniform-2d-preview__scale-control button,.uniform-2d-preview__reset-actions button{border:1px solid var(--color-border-strong);border-radius:var(--radius-small);color:var(--color-ink);background:var(--color-white);cursor:pointer;font-size:10px;font-weight:750}.uniform-2d-preview__scale-control button{width:30px;height:30px;padding:0;font-size:16px;line-height:1}.uniform-2d-preview__reset-actions{gap:6px;display:flex}.uniform-2d-preview__reset-actions button{min-height:30px;padding:0 9px}.uniform-2d-preview__scale-control button:not(:disabled):hover,.uniform-2d-preview__reset-actions button:not(:disabled):hover{border-color:var(--color-gold);background:#fffaf0}.uniform-2d-preview__scale-control button:disabled,.uniform-2d-preview__scale-control input:disabled,.uniform-2d-preview__reset-actions button:disabled{cursor:not-allowed;opacity:.45}.uniform-2d-preview__help{border-bottom:1px solid var(--color-border);color:var(--color-ink-soft);background:#fbfcfd;padding:8px 14px;font-size:10px}.uniform-2d-preview__templates{overscroll-behavior:contain;flex:auto;min-height:0;padding:16px 18px 22px;overflow:auto}.uniform-2d-preview__group+.uniform-2d-preview__group{border-top:1px solid var(--color-border);margin-top:18px;padding-top:16px}.uniform-2d-preview__group h3{color:var(--color-ink-soft);letter-spacing:.08em;margin:0 0 8px;font-size:10px;font-weight:800}.uniform-2d-preview__grid{grid-template-columns:repeat(4,minmax(100px,1fr));gap:10px;display:grid}.uniform-2d-template{border-radius:var(--radius-small);min-width:0;color:var(--color-ink-soft);cursor:grab;touch-action:none;background:0 0;border:1px solid #0000;gap:5px;padding:5px;display:grid}.uniform-2d-template:active{cursor:grabbing}.uniform-2d-template:hover{color:var(--color-ink);background:#f4f6f9d1}.uniform-2d-template[data-selected=true]{color:var(--color-ink);background:#fffaf0;border-color:#c8a74ab8;box-shadow:0 0 0 2px #c8a74a1f}.uniform-2d-template__canvas{aspect-ratio:1;background-color:var(--color-canvas);background-image:linear-gradient(#aeb8c71f 1px,#0000 1px),linear-gradient(90deg,#aeb8c71f 1px,#0000 1px);background-size:16px 16px;border-radius:4px;display:block;overflow:hidden}.uniform-2d-template__canvas canvas{pointer-events:none;width:100%;height:100%;display:block}.uniform-2d-template__label{text-align:center;text-overflow:ellipsis;white-space:nowrap;font-size:9px;font-weight:750;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}.preview__heading{align-items:flex-start}.uniform-2d-preview{min-height:430px}.uniform-2d-preview__toolbar{grid-template-columns:minmax(100px,auto) minmax(220px,1fr)}.uniform-2d-preview__reset-actions{grid-column:1/-1;justify-content:flex-end}}@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}.preview__heading{display:grid}.preview-tabs{width:100%}.preview-tabs button{flex:50%}.controls{min-height:500px}.preview,.preview__stage{min-height:440px}.uniform-preview-canvas,.uniform-2d-preview{min-height:400px}.uniform-2d-preview__toolbar{grid-template-columns:1fr}.uniform-2d-preview__reset-actions{grid-column:auto;justify-content:stretch}.uniform-2d-preview__reset-actions button{flex:50%}.uniform-2d-preview__grid{grid-template-columns:repeat(2,minmax(100px,1fr))}.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}}