/* Shared by the hosted site and the self-hosted Debian app. */
html[data-product-mode="home"],html[data-product-mode="croquis"]{height:auto;min-height:100%;overflow:auto}
body[data-product-mode="home"],body[data-product-mode="croquis"]{height:auto;min-height:100dvh;overflow:auto}
body[data-product-mode="home"] .app-header,body[data-product-mode="home"] .workspace,body[data-product-mode="croquis"] .workspace{display:none}
body[data-product-mode="croquis"] .header-actions,body[data-product-mode="croquis"] .document-name{display:none}
body[data-product-mode="croquis"] .mode-switch{margin-left:auto}
body[data-product-mode="render"] #assistant-tab,body[data-product-mode="render"] #nav-assistant,body[data-product-mode="assistant"] #render-tab,body[data-product-mode="assistant"] #nav-render{display:none}
.mode-home{min-height:100dvh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 90% 5%,#eaf0ff 0,transparent 38%),#f8f9fc;padding:0 5.5vw}
.mode-home-top{display:flex;align-items:center;justify-content:space-between;gap:20px;height:105px;flex:none}
.mode-home-top .brand strong{font-size:25px}.mode-home-top .brand small{font-size:8px;letter-spacing:1.6px}.mode-home-top .button{gap:15px;background:transparent;font-size:11px}
.mode-home-content{width:100%;max-width:1210px;margin:auto; padding:40px 0 35px}
.mode-home-heading{margin-bottom:40px}.mode-home-heading>.eyebrow{color:#6b7f9f;font-size:10px;letter-spacing:2px}
.mode-home-heading h1{font-size:clamp(42px,5vw,68px);font-weight:600;letter-spacing:-2.8px;line-height:1.06;color:#162944;margin:20px 0 18px;outline:none}.mode-home-heading h1 span{color:#275df5}
.mode-home-heading p{font-size:14px;line-height:1.7;color:#718099;margin:0}
.mode-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.mode-card{display:flex;flex-direction:column;text-align:left;position:relative;overflow:hidden;min-width:0;background:#fff;border:1px solid #e1e7f0;border-radius:19px;padding:24px 25px 0;box-shadow:0 8px 24px #17314d04;color:#273b58;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.mode-card:hover:not(:disabled){transform:translateY(-6px);border-color:#b4cafa;box-shadow:0 18px 40px #1738620e;background:#fff}.mode-card:focus-visible{outline-offset:5px}.mode-card.current-mode{border-color:#8aaffd}
.mode-card-top{display:flex;align-items:center;justify-content:space-between;gap:9px;width:100%}.mode-number{font-size:9px;letter-spacing:1.2px;color:#8494ad;font-weight:550}
.mode-status{display:inline-flex;align-items:center;align-self:flex-start;border-radius:5px;padding:5px 7px;background:#edf4ff;color:#5b7fbd;font-size:8px;font-weight:500;line-height:1.4;white-space:nowrap}.mode-status.upcoming{background:#f3eee5;color:#957750}
.mode-art{display:block;width:100%;margin:12px 0 8px;background:radial-gradient(ellipse,#f0f5fd 0,transparent 70%)}.mode-art svg{display:block;width:100%;height:auto;aspect-ratio:320/190}
.plan-lines{fill:none;stroke:#7089ae;stroke-width:2}.plan-lines .thin-line{stroke-width:1;stroke:#a3b5cd}.plan-highlight{fill:#d3e4ff;stroke:#84aaf5;stroke-width:1.5}.art-check{fill:#285ff4}.art-check-mark{stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none}.art-annotations{stroke:#bbc9dd;stroke-width:2;fill:none}.house-lines{fill:none;stroke:#fff;stroke-width:1.5;opacity:.65}.sketch-lines{stroke:#7d8da5;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.sketch-guides{stroke:#bac4d3;fill:none;stroke-width:1;stroke-dasharray:4 5}
.mode-card-title{display:flex;width:100%;align-items:center;justify-content:space-between;font-size:27px;letter-spacing:-1px;font-weight:600;margin-bottom:12px;line-height:1.25}.mode-card-title>span{font-size:22px;color:#a0b3d1;font-weight:400}
.mode-card-description{font-size:12px;line-height:1.85;color:#7d8ca2;max-width:285px;min-height:66px}.mode-card-features{margin:21px 0 25px;font-size:8px;letter-spacing:1.1px;color:#9aa8bc;line-height:1.6}
.mode-card-action{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #edf0f6;width:calc(100% + 50px);margin:0 -25px;padding:19px 25px;font-size:11px;font-weight:550;color:#4169a8;background:#fafcff}.render-card .mode-card-action{background:#275df5;border-color:#275df5;color:#fff}.mode-card-action>span{font-size:18px}.croquis-card .mode-card-action{color:#778aa9}
.mode-home-note{display:flex;align-items:center;gap:13px;margin-top:30px;color:#7789a5}.mode-home-note>.icon{width:21px;height:21px;color:#90a4c2}.mode-home-note p{font-size:11px;line-height:1.8;margin:0}.mode-home-note p span{font-size:10px;color:#96a3b7}.mode-home-signature{margin-left:auto;font-size:8px;letter-spacing:1.6px;color:#96a4b8}
.mode-home-footer{display:flex;justify-content:space-between;gap:20px;padding:23px 0;border-top:1px solid #e8ecf4;font-size:8px;line-height:1.7;color:#96a4b9}.mode-home-footer>span:first-child{letter-spacing:1.5px;white-space:nowrap}
.mode-switch{display:inline-flex;align-items:center;gap:10px;flex:none;border:1px solid #dce6f9;border-radius:8px;background:#f4f7ff;color:#3d639f;padding:9px 12px;font-size:11px;font-weight:550;white-space:nowrap}.mode-switch>.icon{width:15px;height:15px;color:#5b83c7}.mode-switch:hover:not(:disabled){background:#eaf1ff;border-color:#b4caf6}.mode-switch>span:last-child{font-size:14px;color:#7895bf}
.workspace-nav{gap:8px}.nav-tool{height:53px}.app-header{gap:17px}.document-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;justify-content:flex-start}.document-name:before{margin-right:8px}
.assistant-pane>h3{font-size:28px;line-height:1.2}.assistant-overview{border:1px solid #e1e9f7;background:#f8faff;border-radius:10px;padding:16px;margin:22px 0 16px}.assistant-overview>strong{display:block;font-size:11px;line-height:1.7;overflow-wrap:anywhere;margin-top:12px;color:#556b8b}.assistant-overview>p{font-size:9px;line-height:1.7;margin:14px 0 0;color:#8999ae}
.assistant-metrics{display:flex;gap:10px;margin-top:17px;justify-content:space-between}.assistant-metrics>div{min-width:0}.assistant-metrics b{display:block;font-size:23px;font-weight:550;letter-spacing:-.6px;color:#476594}.assistant-metrics span{display:block;font-size:9px;color:#8d9eb5;margin-top:3px}
.assistant-actions{display:grid;gap:9px;margin:23px 0}.assistant-action{display:flex;align-items:center;gap:12px;border:1px solid #e5eaf3;background:#fff;border-radius:9px;padding:14px 11px;text-align:left;width:100%}.assistant-action:hover:not(:disabled){border-color:#c5d5f6;background:#f8faff}.assistant-action>.icon{width:22px;height:22px;flex:none;color:#8da9d4}.assistant-action>span:nth-child(2){flex:1}.assistant-action strong{display:block;font-size:10px;font-weight:550;color:#4e668b}.assistant-action small{display:block;font-size:9px;line-height:1.8;color:#8d9ab0;margin-top:3px}.assistant-action>b{font-size:17px;color:#a4b6d1;font-weight:400}.assistant-future{background:#f7f8fa;border:1px dashed #dfe4ec;border-radius:9px;padding:16px;margin-bottom:18px}.assistant-future>.eyebrow{display:block;margin-bottom:9px;font-size:9px}.assistant-future>p{font-size:10px;line-height:1.8;color:#8b99ad;margin:12px 0 0}#assistant-to-render{font-size:11px;color:#4d74b5;justify-content:space-between}
.croquis-workspace{min-height:calc(100dvh - 78px);background:radial-gradient(ellipse at 85% 35%,#edf2ff 0,transparent 60%),#f8f9fc;display:flex;align-items:center;padding:60px 7vw}.croquis-layout{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;max-width:1150px;width:100%;margin:auto}.croquis-copy>.eyebrow{display:block;font-size:10px;letter-spacing:2px;color:#8194b0;margin-bottom:17px}.croquis-copy h1{font-size:clamp(35px,3.7vw,55px);letter-spacing:-2px;line-height:1.1;font-weight:600;color:#223855;margin:25px 0 22px;outline:none}.croquis-copy h1 span{color:#275df5}.croquis-copy>p{font-size:14px;line-height:1.9;color:#7d8ea6;max-width:380px}.croquis-pending{border-left:2px solid #cad8f3;padding-left:18px;margin:30px 0}.croquis-pending strong{font-size:12px;font-weight:550;color:#627897}.croquis-pending p{font-size:11px;line-height:1.9;color:#91a0b5;max-width:370px;margin:8px 0 0}.croquis-buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}.croquis-buttons .button{font-size:11px;gap:13px}.croquis-preview{background:#fff;border:1px solid #e0e7f1;border-radius:18px;padding:27px;box-shadow:0 20px 60px #46699207;transform:rotate(2deg)}.croquis-preview>.eyebrow{font-size:9px;letter-spacing:1.5px;color:#92a1b7}.croquis-preview svg{display:block;width:100%;height:auto;aspect-ratio:400/340;margin:10px 0}.croquis-preview-footer{display:flex;justify-content:space-between;gap:15px;font-size:8px;line-height:1.7;color:#a2afc1;border-top:1px solid #eef1f6;padding-top:18px}.croquis-preview-footer>span:first-child{letter-spacing:.8px}
@media(max-width:1250px){.brand .version,.brand small{display:none}.app-header{gap:12px}.mode-switch{font-size:10px;padding:8px 10px;gap:7px}.mode-card{padding:21px 21px 0}.mode-card-title{font-size:24px}.mode-card-action{width:calc(100% + 42px);margin:0 -21px;padding:18px 21px}.mode-status{font-size:7px}.mode-home-content{padding-top:30px}.mode-home-heading h1{font-size:58px}.document-name{max-width:125px}.header-actions .button{font-size:9px}}
@media(max-width:1100px){.app-header .brand>div{display:none}.mode-card-top{flex-wrap:wrap;gap:8px}.mode-card-title{font-size:22px}.mode-cards{gap:15px}.mode-card-description{font-size:11px}.mode-home-signature{display:none}.mode-home-content{padding-top:25px}.croquis-layout{gap:35px}.croquis-workspace{padding:50px 5vw}}
@media(max-width:850px){.mode-home{padding:0 6vw}.mode-home-top{height:90px}.mode-home-heading h1{font-size:52px}.mode-cards{grid-template-columns:1fr;max-width:520px;margin:auto}.mode-card{display:grid;grid-template-columns:1fr 125px;padding:23px 23px 0;border-radius:15px}.mode-card-top{grid-column:1/-1;flex-wrap:nowrap}.mode-art{grid-column:2;grid-row:2/5;align-self:center;margin:14px 0 0;width:145px;margin-left:-9px}.mode-card-title{grid-column:1;margin-top:23px;font-size:25px}.mode-card-description{grid-column:1;max-width:250px;min-height:0;font-size:11px}.mode-card-features{grid-column:1;margin:17px 0 20px;font-size:7px}.mode-card-action{grid-column:1/-1;width:calc(100% + 46px);margin:0 -23px;padding:17px 23px}.mode-home-heading{margin-bottom:30px}.mode-home-content{max-width:520px}.mode-home-top .brand>div{display:block}.mode-home-note{margin-top:23px}.mode-home-footer{margin-top:10px}.mode-home-footer>span:last-child{max-width:240px;text-align:right}.mode-home-footer>span:first-child{font-size:7px}.mode-switch{gap:6px}.mode-switch>.icon{width:13px;height:13px}.header-actions #open-btn{font-size:0;width:33px;padding:8px;gap:0}.header-actions #save-btn,.header-actions #export-btn{font-size:0;width:33px;padding:8px;gap:0}.croquis-layout{grid-template-columns:1fr;max-width:550px;gap:35px}.croquis-workspace{padding:45px 8vw}.croquis-copy h1{font-size:45px}.croquis-preview{max-width:400px;width:100%;justify-self:center}.croquis-copy>p{max-width:450px}}
@media(max-width:520px){.app-header{padding:0 10px;gap:8px}.app-header .brand img{width:28px;height:28px;border-radius:7px}.mode-switch{font-size:9px;padding:8px 9px;gap:6px}.mode-switch>.icon{display:none}.header-actions{gap:3px}.header-actions .button.icon-button{width:29px;padding:7px;min-height:33px}.header-actions #projects-btn,.header-actions #open-btn,.header-actions #save-btn,.header-actions #export-btn{width:29px;padding:7px;min-height:33px}.mode-home-top{gap:10px}.mode-home-top .brand strong{font-size:22px}.mode-home-top .brand small{font-size:6px;letter-spacing:1px}.mode-home-top .brand img{width:34px;height:34px}.mode-home-top .button{font-size:9px;padding:8px;gap:3px;max-width:118px;line-height:1.6}.mode-home-heading h1{font-size:47px;letter-spacing:-2px}.mode-home-heading p{font-size:12px}.mode-home-heading>.eyebrow{font-size:8px;letter-spacing:1.3px}.mode-home-content{padding-top:25px}.mode-card{grid-template-columns:1fr 96px;padding:20px 20px 0}.mode-card-title{font-size:23px}.mode-art{width:118px;margin-left:-13px}.mode-card-description{font-size:10px;max-width:200px}.mode-card-top .mode-number{font-size:8px}.mode-card-action{width:calc(100% + 40px);margin:0 -20px;padding:16px 20px}.mode-card-features{font-size:6px;letter-spacing:.7px}.mode-home-footer{flex-direction:column;gap:8px}.mode-home-footer>span:last-child{max-width:none;text-align:left;font-size:8px}.mode-home-note p{font-size:10px}.mode-home-note p span{font-size:9px}.croquis-workspace{padding:40px 7vw;min-height:calc(100dvh - 68px)}.croquis-copy h1{font-size:39px;letter-spacing:-1.6px}.croquis-copy>p{font-size:12px}.croquis-buttons .button{font-size:10px;gap:8px}.croquis-preview{padding:20px}.croquis-preview-footer{font-size:7px}.assistant-pane>h3{font-size:28px}}
@media(prefers-reduced-motion:no-preference){.mode-home-heading{animation:mode-reveal .5s ease both}.mode-card{animation:mode-reveal .6s ease both}.mode-card:nth-child(2){animation-delay:.08s}.mode-card:nth-child(3){animation-delay:.16s}.croquis-copy{animation:mode-reveal .5s ease both}@keyframes mode-reveal{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}}
@media(prefers-reduced-motion:reduce){.mode-card{transition:none}.mode-card:hover:not(:disabled){transform:none}}
@media(max-width:380px){body[data-product-mode="assistant"] .app-header>.brand,body[data-product-mode="render"] .app-header>.brand{display:none}}
