/* An expressive atelier in the Factory's charcoal and turquoise palette. */
body{background:radial-gradient(ellipse at 8% 0,#d8e9e8 0,transparent 34%),radial-gradient(ellipse at 98% 28%,#e9e6f1 0,transparent 28%),#f0f2f1}
#editorView{max-width:1790px;padding-top:26px}header{background:#101d24;border-bottom:1px solid #36575c}.demo-bar{background:#e3eceb}
.editor-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;min-height:320px;padding:36px 42px 30px;margin-bottom:20px;overflow:hidden;border-radius:24px;background:radial-gradient(ellipse at 85% 18%,#2b6162 0,transparent 45%),linear-gradient(125deg,#14242d,#0e2027 64%,#173d40);border:1px solid #36585e;box-shadow:0 20px 55px #0c2d3520;color:#f4f6ef;gap:0}
.editor-hero::before{content:'';position:absolute;inset:0;z-index:-1;background-image:radial-gradient(#c5e8d218 .7px,transparent .7px);background-size:7px 7px;opacity:.35;pointer-events:none}
.hero-copy{position:relative;z-index:1}.editor-hero .eyebrow{display:flex;align-items:center;gap:10px;color:#a9c3c6;font-size:9px;letter-spacing:.16em;margin:0 0 18px}.hero-live{width:6px;height:6px;background:#bfe7b6;box-shadow:0 0 14px #c9f1b68c;border-radius:50%;flex:none}.editor-hero .studio-mark{margin:0;padding:3px 5px;border-color:#70b0ac4d;color:#b6dfd6;font-size:9px}
.editor-hero h1{font-size:clamp(42px,4.1vw,72px);line-height:1.02;letter-spacing:-2.6px;font-weight:500;color:#f7f7ef;margin:0;text-wrap:balance}.editor-hero h1 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-2px;background:linear-gradient(100deg,#dff3c9,#94d9d4 64%,#b2c7ec);background-clip:text;-webkit-background-clip:text;color:transparent}.editor-hero p{font-size:13px;line-height:1.65;color:#b5c9cc;max-width:430px;margin:16px 0}.hero-footnote{display:flex;align-items:center;flex-wrap:wrap;gap:11px;font-size:8px;letter-spacing:.13em;color:#729ca5;margin-top:20px}.hero-footnote i{width:3px;height:3px;border-radius:50%;background:#8bb8b1}
.hero-art{position:absolute;right:5%;top:-12px;width:42%;max-width:590px;pointer-events:none}.hero-art svg{width:100%;height:auto;filter:drop-shadow(0 16px 14px #0005);animation:ribbon-float 9s ease-in-out infinite}.art-caption{position:absolute;right:-5px;top:55%;writing-mode:vertical-rl;letter-spacing:.26em;font-size:8px;color:#8ab2b7}.art-spark{position:absolute;right:3%;top:15%;font-size:30px;color:#daf0b4;font-weight:400;animation:spark-turn 32s linear infinite}
.editor-hero .project-actions{grid-column:2;align-self:end;justify-content:flex-end;z-index:2;margin-top:auto;padding-left:15px}.editor-hero .project-actions button{font-size:11px;padding:12px 14px;background:#102630b3;border-color:#91b8be40;color:#cadbdf;backdrop-filter:blur(12px);box-shadow:none}.editor-hero .project-actions #saveDraft{background:#d9efc4;border-color:#d9efc4;color:#233e3e}.editor-hero .project-actions #saveDraft:hover{background:#ecffdb;box-shadow:0 0 25px #d2f1b921}.editor-hero .project-actions button:hover{border-color:#b5dbd59c;transform:translateY(-2px)}
.studio-guide{background:#ffffffae;border:1px solid #cfddde;border-radius:14px;box-shadow:0 6px 20px #26465203}.studio-guide>summary{padding:12px 18px}.guide-symbol{background:#183b45;color:#c2ead9}.guide-steps h3{font-weight:550}.guide-steps article>span{font-family:Georgia,serif;font-style:italic;font-size:20px;color:#478887}
.panel,.preview-panel{border-radius:19px;box-shadow:0 12px 35px #19353d08;border-color:#d6e2e3}.configuration{background:linear-gradient(150deg,#fff,#f7faf9);padding:18px}.product{background:#fff;border-color:#e0e9e8;transition:transform .18s,border-color .18s,box-shadow .18s}.product:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 12px #173a4110}.product.active{background:#173b45;border-color:#173b45;color:#d2eee4;box-shadow:0 5px 13px #153b4820!important}.product.active .product-thumb{background-color:#e4efed}.section-title span{background:#dceee7;color:#315c64}.segmented button.active{color:#164954}.studio-label{color:#305e68;letter-spacing:.19em}
.canvas-wrap[data-environment=ice]{background:radial-gradient(ellipse at 49% 37%,#fafdfb 0,#eaf4ef 35%,#d3e5e2 70%,#aebccf 120%);box-shadow:inset 0 0 80px #edf7f766}.model-label b{font-family:Georgia,serif;font-weight:400;font-style:italic;font-size:20px;color:#365761}.studio-watermark{font-family:Georgia,serif;font-size:38px;letter-spacing:-2px;opacity:.06;line-height:.9}.preview-toolbar{background:linear-gradient(90deg,#fff,#f7fbf9)}
.order-panel{background:radial-gradient(ellipse at 100% 0,#2c5960 0,transparent 65%),linear-gradient(155deg,#18373f,#102731);border-color:#31585f;box-shadow:0 18px 35px #14323b1a}.order-panel .quote-head h2{font-family:Georgia,serif;font-weight:400;font-size:21px;font-style:italic}.order-panel .total strong{color:#e2f4d3;font-size:32px;font-weight:500}.order-panel .primary{background:#c9e7b8;color:#23433c;border-color:#c9e7b8;font-size:12px}.order-panel .primary:hover:not(:disabled){background:#e1f4cf;color:#183c32;border-color:#e1f4cf}.order-panel .inventory-status{background:#ffffff0b;border-color:#ffffff25;color:#bed2d7;font-size:11px}.order-panel .inventory-status[data-state=available]{background:#b7dfb81c;border-color:#b7dfb847;color:#d2ecc7}.order-panel .inventory-status[data-state=unavailable]{background:#c864331f;border-color:#e5a18366;color:#f6d4c3}
.studio-story{position:relative;overflow:hidden;background:linear-gradient(135deg,#f9fcf9,#e9f2ec);border-color:#d0e0d9;padding:38px;margin-top:28px;border-radius:24px}.story-heading{max-width:none;padding-right:170px}.story-heading h2{font-size:clamp(27px,2.6vw,44px);font-weight:500;letter-spacing:-1.4px;line-height:1.12}.story-heading h2 em{font-family:Georgia,serif;font-weight:400;color:#447a75;letter-spacing:-1px}.studio-story::before{content:'✳';position:absolute;top:27px;right:45px;font-size:110px;line-height:1;color:#507d7652;pointer-events:none}.story-heading p{max-width:660px;color:#72877d}.story-grid{gap:16px;margin-top:28px}.story-grid article{position:relative;overflow:hidden;border:1px solid #dbe8e0;padding:24px;border-radius:15px;background:#ffffffa6;min-height:175px;transition:transform .25s,box-shadow .25s}.story-grid article:hover{transform:translateY(-4px);box-shadow:0 12px 20px #244c3710}.story-grid article:nth-child(2){background:#173b43;border-color:#173b43;color:#e7f3ec}.story-grid article:nth-child(2) .story-tag{color:#a8d5bf}.story-grid article:nth-child(2) p{color:#a8c8c8}.story-grid article:nth-child(3){background:#e1e6f2;border-color:#d6dfe9}.story-grid h3{font-family:Georgia,serif;font-size:22px;font-weight:400;letter-spacing:-.4px}.story-grid p{color:#61796e}.story-tag{font-size:8px;letter-spacing:.15em;color:#47857d}.studio-faq{border-top-color:#cadbd0}.studio-faq summary{color:#365749}.studio-faq details{border-bottom-color:#d8e5dc}.studio-faq details p{color:#6a7e73}
@keyframes ribbon-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-9px) rotate(1deg)}}@keyframes spark-turn{to{transform:rotate(360deg)}}
@media(max-width:1280px){.editor-hero{padding:30px;min-height:290px}.editor-hero h1{font-size:54px}.hero-art{right:2%;width:43%;top:3px}.editor-hero .project-actions{padding-left:0}.editor-hero .project-actions button{font-size:10px;padding:10px}.hero-footnote{font-size:7px}.studio-story{padding:30px}.story-grid article{padding:20px}.story-grid h3{font-size:20px}}
@media(max-width:1050px){.editor-hero{grid-template-columns:1fr 1fr;padding:28px;min-height:295px}.editor-hero h1{font-size:48px}.hero-art{width:47%;right:0;top:28px}.editor-hero p{max-width:320px;font-size:12px}.hero-footnote{max-width:310px;line-height:1.6}.editor-hero .project-actions{gap:5px;flex-wrap:wrap}.editor-hero .project-actions button{padding:10px;font-size:10px}.story-grid article{padding:18px}.story-grid h3{font-size:19px}}
@media(max-width:750px){#editorView{padding:16px 12px 30px}.editor-hero{display:block;min-height:0;padding:24px 20px 20px;border-radius:18px}.editor-hero .eyebrow{font-size:7px;gap:6px;letter-spacing:.12em;margin-bottom:18px}.editor-hero h1{font-size:clamp(38px,9vw,56px);letter-spacing:-1.5px;max-width:90%}.editor-hero h1 em{letter-spacing:-1.7px}.editor-hero p{font-size:12px;max-width:70%;line-height:1.65;margin:14px 0}.hero-art{width:62%;right:-18%;top:80px;opacity:.42;z-index:0}.hero-copy{z-index:1}.art-caption,.art-spark{display:none}.hero-footnote{font-size:6px;max-width:100%;gap:7px;margin-top:17px;position:relative;z-index:1}.editor-hero .project-actions{position:relative;display:flex;margin-top:22px;width:100%;padding:0;gap:6px;flex-wrap:wrap}.editor-hero .project-actions button{font-size:9px;padding:11px 7px;white-space:nowrap}.studio-guide>summary{font-size:11px;padding:12px;gap:7px}.studio-guide summary small{font-size:9px}.story-heading{padding-right:35px}.story-heading h2{font-size:29px;line-height:1.1;letter-spacing:-.7px}.studio-story{padding:24px 18px;border-radius:18px}.studio-story::before{font-size:58px;right:13px;top:25px;opacity:.6}.story-grid article{min-height:0;padding:22px}.story-grid h3{font-size:23px}.model-label b{font-size:18px}.studio-watermark{font-size:30px}.order-panel .total strong{font-size:32px}}
@media(prefers-reduced-motion:reduce){.hero-art svg,.art-spark{animation:none}.product,.story-grid article,.editor-hero .project-actions button{transition:none;transform:none!important}}

/* The original brand mark on a floating illuminated enamel emblem. */
.hero-art.hero-logo{right:5%;top:20px;width:38%;height:230px;max-width:500px;display:flex;align-items:center;justify-content:center;perspective:900px;opacity:1}.logo-aura{position:absolute;inset:0;background:radial-gradient(ellipse,#71e6df38 0,#8cbdca13 46%,transparent 70%);filter:blur(15px);animation:logo-breathe 7s ease-in-out infinite}.logo-emblem{position:relative;width:85%;max-width:385px;aspect-ratio:420/220;background:linear-gradient(130deg,#fff,#eaf3ef 70%,#d4e8e6);border:1px solid #e3fbf3c9;border-radius:19px;box-shadow:0 24px 40px #0005,0 0 45px #84e8d91a,inset 0 0 0 5px #fff8;overflow:hidden;transform-style:preserve-3d;animation:logo-hover 8s ease-in-out infinite}.logo-emblem img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;position:relative;z-index:1;padding:5px}.logo-shine{position:absolute;inset:-60%;z-index:2;pointer-events:none;background:linear-gradient(110deg,transparent 43%,#fff0 46%,#ffffffa8 50%,#fff2 54%,transparent 58%);transform:translateX(-60%);animation:logo-polish 7s ease-in-out infinite;mix-blend-mode:screen}.logo-signature{position:absolute;bottom:0;left:0;width:100%;text-align:center;font-size:8px;letter-spacing:.32em;color:#9fc5c8}.hero-logo::after{content:'';position:absolute;bottom:17px;width:58%;height:13px;background:#020e1880;filter:blur(9px);border-radius:50%;animation:logo-shadow 8s ease-in-out infinite;z-index:-1}
@keyframes logo-hover{0%,100%{transform:translateY(3px) rotateX(5deg) rotateY(-8deg) rotateZ(-2deg)}50%{transform:translateY(-10px) rotateX(-3deg) rotateY(7deg) rotateZ(1deg)}}
@keyframes logo-polish{0%,20%{transform:translateX(-65%);opacity:0}28%{opacity:.65}58%{transform:translateX(65%);opacity:.65}65%,100%{transform:translateX(65%);opacity:0}}
@keyframes logo-breathe{0%,100%{opacity:.5;transform:scale(.94)}50%{opacity:1;transform:scale(1.12)}}
@keyframes logo-shadow{0%,100%{opacity:.65;transform:scaleX(1)}50%{opacity:.35;transform:scaleX(.85)}}
@media(max-width:1280px){.hero-art.hero-logo{right:3%;top:15px;width:39%;height:210px}.logo-emblem{width:90%;max-width:330px}}
@media(max-width:1050px){.hero-art.hero-logo{right:2%;top:28px;width:40%;height:180px}.logo-signature{bottom:-4px;font-size:7px}}
@media(max-width:750px){.editor-hero{display:flex;flex-direction:column;align-items:stretch;gap:0}.editor-hero .hero-copy{order:0}.editor-hero p{max-width:100%}.hero-art.hero-logo{position:relative;order:1;right:auto;top:auto;width:100%;height:180px;max-width:none;margin:12px 0 2px;opacity:1;z-index:1}.logo-emblem{width:83%;max-width:290px;border-radius:14px}.logo-aura{inset:-8px 0}.logo-signature{bottom:0;font-size:7px}.editor-hero .project-actions{order:2;margin-top:18px}.hero-logo::after{bottom:12px}}
@media(prefers-reduced-motion:reduce){.logo-emblem,.logo-aura,.logo-shine,.hero-logo::after{animation:none}.logo-emblem{transform:none}.logo-shine{display:none}}
/* Frameless silver brand mark: the white source background disappears through screen blending. */
.hero-art.hero-logo{top:18px;height:235px;isolation:auto}.logo-aura{background:radial-gradient(ellipse,#98cfd71b,transparent 65%);filter:blur(22px);animation:none;opacity:.7}.logo-emblem{width:90%;max-width:405px;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:hidden;transform:none;animation:none;mix-blend-mode:screen}.logo-emblem img{padding:0;mix-blend-mode:normal;filter:invert(1) grayscale(1) brightness(1.12);opacity:.92}.logo-shine{inset:0;background:linear-gradient(115deg,transparent 30%,#b8dbea08 42%,#e8fcff16 50%,transparent 60%);mix-blend-mode:screen;animation:logo-polish 10s ease-in-out infinite}.hero-logo::after{display:none}.logo-signature{color:#a1bbc2;font-size:7px;letter-spacing:.4em;bottom:5px}
@media(max-width:1280px){.hero-art.hero-logo{height:220px;top:12px}.logo-emblem{width:95%;max-width:345px}}
@media(max-width:1050px){.hero-art.hero-logo{height:190px;top:23px}}
@media(max-width:750px){.hero-art.hero-logo{top:auto;height:170px;margin:6px 0 0}.logo-emblem{width:88%;max-width:290px}.logo-signature{bottom:0}}
@media(prefers-reduced-motion:reduce){.logo-shine{animation:none;display:none}}
.hero-art.hero-logo{mix-blend-mode:screen;perspective:none}.logo-emblem{mix-blend-mode:normal}
.header-tools{display:flex;align-items:center;gap:16px}.language-picker{display:flex;align-items:center;gap:7px;color:#96b8c2;font-size:10px}.language-picker select{width:auto;max-width:135px;font-size:11px;background:#1b333d;color:#d5e6e9;border:1px solid #36545f;padding:8px 10px;border-radius:8px}.language-picker option{background:#17313b;color:white}.language-picker select:focus{border-color:#afd9c5}.editor-hero h1{overflow-wrap:normal}.editor-hero .eyebrow{flex-wrap:wrap}.hero-footnote{line-height:1.7}.project-actions button{white-space:normal}
@media(max-width:1050px){header{gap:10px}.header-tools{gap:8px}.language-picker>span{display:none}.language-picker select{max-width:119px;font-size:10px}}
@media(max-width:750px){header{flex-wrap:wrap;height:auto;min-height:66px;row-gap:8px}.header-tools{margin-left:auto}.language-picker select{max-width:116px;font-size:10px;padding:7px}.hero-footnote{letter-spacing:.08em}.editor-hero .project-actions button{white-space:normal}.editor-hero h1{font-size:clamp(34px,8.5vw,48px)}.editor-hero h1 em{letter-spacing:-1px}}