*{box-sizing:border-box} :root{font-family:Arial,Helvetica,sans-serif;color:#292c29;background:#f4f3ef;font-synthesis:none}body{margin:0}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible,#viewport:focus-visible{outline:2px solid #7a876a;outline-offset:4px}header{height:88px;padding:0 4%;display:flex;align-items:center;border-bottom:1px solid #deded6;gap:30px}.brand{font-family:Georgia,serif;font-size:33px;letter-spacing:-1px;text-decoration:none;color:#292c29;display:flex;align-items:center;gap:12px}.brand-mark{display:grid;place-items:center;border:1px solid #8d9386;border-radius:50%;height:36px;width:36px;font-size:25px;letter-spacing:-3px;padding-right:3px}.brand-dot{font:10px Arial;align-self:flex-start;margin:10px 0 0 -8px}.header-note{font-size:12px;color:#8a8d82;border-left:1px solid #d7d9cf;padding-left:28px}.header-tag{margin-left:auto;font-size:11px;text-transform:uppercase;letter-spacing:1.6px}main{max-width:1800px;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 382px;min-height:calc(100vh - 139px)}.studio{position:relative;min-height:800px;background:radial-gradient(ellipse at 45% 42%,#fff 0%,#eeeee7 72%);overflow:hidden}.studio-heading{position:absolute;top:34px;left:5.4%;z-index:1;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:2px;color:#7b806f;font-weight:600}h1{font:normal clamp(28px,2.6vw,44px)/1.12 Georgia,serif;letter-spacing:-1px;margin:13px 0}h1+p{font-size:12px;color:#84877c;margin:0}#viewport{position:absolute;inset:100px 0 74px;touch-action:none;cursor:grab}#viewport:active{cursor:grabbing}canvas{display:block;width:100%;height:100%}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;font-size:13px;color:#747b6b;background:#efefe8;z-index:3}#loading[hidden]{display:none}.load-line{width:100px;height:2px;background:#cdd1c4;overflow:hidden}.load-line:after{content:'';display:block;width:40px;height:2px;background:#6e795e;animation:load 1s infinite alternate}@keyframes load{to{transform:translateX(60px)}}.view-tools{position:absolute;bottom:76px;left:50%;transform:translateX(-50%);display:flex;align-items:center;padding:5px;border-radius:9px;box-shadow:0 2px 18px #313c3010;border:1px solid #dedfd5;background:#fffffff2;white-space:nowrap;gap:3px}.view-tools button{border:0;background:transparent;padding:9px 12px;border-radius:5px;font-size:11px;color:#777d6f}.view-tools .active{background:#e9ece2;color:#394630}.studio-footer{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;gap:10px;border-top:1px solid #d9dcd0;padding:23px 5.4%;font-size:10px;color:#777e6c}.studio-footer b{font-weight:400;color:#434b3b;margin-left:6px}.live-dot{display:inline-block;width:5px;height:5px;border-radius:100%;background:#808e6f;margin:0 7px 1px 0}.settings{background:#fbfbf8;padding:33px 28px 16px;border-left:1px solid #dddfd5}.settings-heading{padding-bottom:22px}h2{font:normal 23px Georgia,serif;margin:11px 0 0;letter-spacing:-.4px}fieldset{margin:0;padding:0 0 21px;border:0;min-width:0}legend{width:100%;font-size:12px;font-weight:600;padding:0;margin-bottom:12px;display:flex;align-items:center;gap:9px}.step{font-size:9px;color:#8c927e;font-weight:400}output{margin-left:auto;font-size:10px;color:#838876;font-weight:400}.swatches{display:flex;gap:7px}.swatches button{background:#fff;border:1px solid #dddfd4;border-radius:6px;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 9px;flex:1;font-size:10px;transition:border-color .2s,background .2s}.swatches button[aria-pressed=true]{border-color:#7e8a6d;background:#f0f2e9;box-shadow:inset 0 0 0 .5px #7e8a6d}.swatch{height:17px;width:17px;display:inline-block;border-radius:50%;border:1px solid #00000014;box-shadow:inset 0 1px 3px #ffffff30}.white{background:#f7f6f1}.black{background:#30312f}.red{background:#992f37}.decor-field{border-top:1px solid #e6e7df;padding-top:19px}.decor-field legend{float:left;margin-bottom:13px}.decor-options{clear:both;display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.decor-options button{border:1px solid #e0e2d8;border-radius:6px;background:#f6f7f1;padding:7px 4px 11px;display:flex;flex-direction:column;align-items:center;font-size:11px;gap:4px}.decor-options button[aria-pressed=true]{border-color:#7e8a6d;box-shadow:inset 0 0 0 .5px #7e8a6d;background:#eef1e5}.decor-options img{width:75px;height:66px;object-fit:contain}.decor-options small{font-size:9px;color:#8a8f7f}.color-label{display:flex;font-size:11px;margin:16px 0 10px}.placement{border-top:1px solid #e6e7df;padding:17px 0;display:flex;align-items:center;justify-content:space-between;font-size:11px}.segmented{display:flex;border:1px solid #dfe2d5;border-radius:5px;padding:3px;gap:3px}.segmented button{padding:6px 9px;font-size:9px;border:0;background:none;border-radius:3px}.segmented button[aria-pressed=true]{background:#e5e9dc;color:#4e5b42}.photo-settings{border-top:1px solid #e6e7df;border-bottom:1px solid #e6e7df;padding:16px 0;font-size:11px}.photo-settings summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between}.photo-settings summary span{font-size:10px;color:#858e77}.photo-settings p{font-size:10px;line-height:1.6;color:#848879}.upload{display:inline-block;padding:9px;border:1px solid #cdd3bf;border-radius:5px;cursor:pointer}.upload input{display:none}.text-button{background:none;border:0;color:#7f8871;font-size:10px;padding:8px}.check{display:flex;align-items:center;margin-top:12px;font-size:10px;gap:6px}input[type=checkbox]{accent-color:#6b7859}.included{display:flex;gap:9px;align-items:center;padding:14px 0}.included-icon{border:1px solid #c6cfb5;color:#7d896a;border-radius:50%;width:18px;height:18px;text-align:center;font-size:11px;line-height:16px}.included p{font-size:10px;margin:0;line-height:1.6}.included small{display:block;color:#959a8a;font-size:9px}.save{width:100%;border:0;border-radius:5px;background:#536047;color:white;padding:14px 15px;text-align:left;font-size:11px;display:flex;justify-content:space-between}.save:hover{background:#414e35}.share{width:100%;padding:13px 0 3px;background:none;border:0;font-size:10px;color:#7f8873}#notice{font-size:10px;text-align:center;color:#64734f;min-height:12px;margin:8px 0 0}footer{display:flex;justify-content:space-between;border-top:1px solid #deded6;padding:18px 4%;font-size:9px;color:#909483;gap:15px}[hidden]{display:none!important}button:disabled{opacity:.5;cursor:wait}@media(min-width:1500px){main{grid-template-columns:minmax(0,1fr) 420px}.settings{padding:40px}.studio{min-height:850px}}@media(max-width:900px){header{height:70px;padding:0 22px}.header-note{display:none}.header-tag{font-size:9px;letter-spacing:1px}main{grid-template-columns:minmax(0,1fr) 320px}.settings{padding:25px 18px}.studio{min-height:810px}.rotate-hint{display:none}h1{font-size:30px}}@media(max-width:680px){header{height:65px;padding:0 20px}.brand{font-size:29px}.brand-mark{width:31px;height:31px;font-size:23px}.header-tag{font-size:8px;letter-spacing:.9px}main{display:block}.studio{min-height:570px;height:72vh;max-height:720px}.studio-heading{top:25px;left:23px}h1{font-size:32px;margin:10px 0}.studio-heading p{font-size:11px}#viewport{inset:92px 0 66px}.studio-footer{padding:19px 23px;font-size:9px}.rotate-hint{display:inline;font-size:8px}.view-tools{bottom:66px}.view-tools button{padding:8px 11px;font-size:10px}.settings{border-left:0;border-top:1px solid #dddfd5;padding:28px 23px 20px}.settings-heading{padding-bottom:24px}.swatches button{padding:12px;font-size:12px}.decor-options img{height:82px;width:105px}.decor-options span{font-size:12px}.decor-options small{font-size:10px}.decor-options button{padding:7px 4px 13px}legend{font-size:13px}.placement,.photo-settings{font-size:12px}.segmented button{font-size:11px;padding:8px 13px}.save{padding:16px;font-size:12px}.share{padding-top:17px;font-size:11px}footer{padding:17px 23px;flex-direction:column;gap:7px}.included{padding:18px 0}.included p{font-size:11px}}

/* Functional layout without invented branding or promotional copy. */
main{min-height:calc(100svh - 48px)}
.studio{min-height:720px}
.studio-heading{top:26px}
h1{font-family:Arial,Helvetica,sans-serif;font-size:24px;font-weight:400;letter-spacing:-.5px;margin:0}
#viewport{inset:64px 0 74px}
.settings-heading{padding-bottom:25px}
.settings-heading h2{margin-top:0}
.save{margin-top:18px}
.swatches button,.segmented button,.share,.view-tools button{min-height:44px}
.photo-settings summary{min-height:32px;align-items:center}
@media(max-width:900px){.studio{min-height:760px}.studio-heading{left:22px}h1{font-size:21px}.view-tools button{padding:8px 10px}}
@media(max-width:680px){
 main{display:block;min-height:0}
 .studio{height:62svh;min-height:420px;max-height:620px}
 .studio-heading{top:21px;left:20px}
 h1{font-size:21px}
 #viewport{inset:58px 0 106px}
 .view-tools{bottom:57px}
 .view-tools button{padding:9px 11px;min-width:40px}
 .studio-footer{padding:17px 20px;min-height:46px}
 .rotate-hint{display:none}
 .settings{padding:25px 20px 18px}
 .settings-heading h2{font-size:22px}
 .swatches button{min-height:46px}
 .segmented button{min-height:40px}
 .photo-settings summary{min-height:40px}
 .photo-settings p,.check,.text-button{font-size:12px}
 .upload,.text-button{min-height:44px;display:inline-flex;align-items:center}
 .check{min-height:44px}
 .check input{width:18px;height:18px}
 .save{min-height:48px}
 .share{min-height:48px}
 footer{padding-bottom:max(18px,env(safe-area-inset-bottom))}
}
@media(max-width:360px){.settings{padding-left:14px;padding-right:14px}.decor-options img{width:80px}.swatches button{padding:10px 5px;font-size:11px}.placement{font-size:11px}}
@media(max-height:500px) and (orientation:landscape) and (max-width:950px){main{display:block}.studio{height:90svh;min-height:350px}.settings{border-left:0}.studio-heading{top:16px}#viewport{inset:48px 0 100px}}
