.studio-page{font-size:16px}.studio-page header{height:84px}.back-link{font-size:14px}.studio-badge{background:#eae2f6;padding:10px 18px;border-radius:30px;font-size:14px}.studio-main{max-width:1600px;margin:auto;padding:48px 4% 80px}.studio-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;gap:20px}.studio-kicker{font-size:12px;font-weight:700;letter-spacing:1.8px}.studio-heading h1{font-size:clamp(36px,4.2vw,65px);line-height:1.06;margin:13px 0 16px}.studio-heading em,.upload-advice em{color:#8068b0}.studio-heading p{line-height:1.6;color:#5d5e77}.pencil-tag{background:var(--yellow);padding:18px 24px;transform:rotate(5deg);border-radius:10px;font-family:Outfit;white-space:nowrap}.creation-tabs{display:flex;gap:8px;margin-bottom:18px}.creation-tabs button{padding:15px 24px;border:1px solid #22265120;border-radius:40px;background:transparent;color:var(--ink);font-weight:600}.creation-tabs button[aria-selected=true]{background:var(--ink);color:white}.atelier{background:white;border:1px solid #22265122;border-radius:24px;overflow:hidden;box-shadow:0 15px 45px #22265109}.atelier-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:20px 24px;border-bottom:1px solid #22265115}.atelier-top strong{display:block;font-family:Outfit;font-size:21px}.atelier-top span{display:block;font-size:12px;color:#686a80;margin-top:4px}.top-actions{display:flex;gap:5px;flex-wrap:wrap}.studio-page button:not(.button){color:var(--ink)}.top-actions button,.canvas-bottom button,.layer-actions button,.layers-heading button,#upload-preview button,#back-to-art{background:#f4f1f9;border:0;border-radius:9px;min-height:40px;padding:8px 12px;font-size:14px}.top-actions button:first-child,.top-actions button:nth-child(2){font-size:24px;padding:2px 12px}.studio-page button:disabled{opacity:.35;cursor:not-allowed;transform:none}.atelier-body{display:grid;grid-template-columns:86px minmax(0,1fr) 200px;min-height:490px}.toolbox{display:flex;flex-direction:column;gap:4px;padding:12px 8px;border-right:1px solid #22265115}.toolbox button{background:none;border:1px solid transparent;border-radius:10px;font-size:12px;padding:6px 3px;min-height:49px;display:grid;justify-items:center;gap:1px}.toolbox button span{font-size:24px;line-height:1}.toolbox button[aria-pressed=true]{background:#eae2f6;border-color:#b9a6e8;color:#5b448e}.canvas-column{min-width:0;display:flex;flex-direction:column;background:#f0eef5}.canvas-settings{display:flex;flex-wrap:wrap;gap:18px;padding:13px 18px;background:#fbfafd;border-bottom:1px solid #22265110;min-height:60px;font-size:13px}.canvas-settings label{display:flex;align-items:center;gap:8px}.canvas-settings input[type=range]{width:75px;accent-color:#8068b0}.canvas-settings output{width:29px}.fill-setting{white-space:nowrap}.canvas-viewport{height:490px;overflow:auto;display:flex;align-items:safe center;justify-content:safe center;padding:24px;background-image:radial-gradient(#d0ccd9 .7px,transparent .7px);background-size:14px 14px}.canvas-frame{width:100%;flex-shrink:0;max-width:800px;box-shadow:0 5px 24px #22265112;line-height:0;background:white}#drawing{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair}.canvas-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 15px;font-size:12px;border-top:1px solid #22265110}.canvas-bottom button{background:white;padding:3px 9px;min-height:32px}.studio-properties{padding:22px 15px;border-left:1px solid #22265115}.property-heading{font-weight:600;font-size:14px;margin-bottom:14px}.palette{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.palette button{border:2px solid #00000012;aspect-ratio:1;border-radius:50%;min-width:22px;position:relative}.palette button[aria-pressed=true]:after{content:'';position:absolute;inset:-5px;border:2px solid #8068b0;border-radius:50%}.custom-color,.paper-color{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;margin-top:16px}.custom-color input,.paper-color input{width:28px;height:28px;padding:0;border:0;background:none;cursor:pointer}.layers-heading{display:flex;align-items:center;justify-content:space-between;margin-top:24px;border-top:1px solid #22265118;padding-top:18px;font-size:14px}.layers-heading button{font-size:22px;min-height:28px;line-height:1;padding:3px 9px}.layers{margin-top:12px;display:grid;gap:5px;max-height:175px;overflow:auto}.layer{display:flex;align-items:center;gap:5px;background:#f8f6fc;padding:4px;border:1px solid transparent;border-radius:8px}.layer.active{border-color:#b9a6e8;background:#ede7f7}.layer button{border:0;background:none;min-height:32px;font-size:12px;padding:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer .layer-select{flex:1;text-align:left}.layer-actions{display:flex;gap:3px;margin-top:8px}.layer-actions button{padding:5px 7px;min-height:30px;font-size:12px}.layer-opacity{font-size:12px;display:grid;gap:5px;margin-top:12px}.layer-opacity input{width:100%;accent-color:#8068b0}.clear-button{display:block;margin-top:18px;background:none;border:1px solid #22265120;border-radius:10px;width:100%;padding:10px;font-size:12px}.studio-tip{font-size:12px;line-height:1.6;margin-top:16px;color:#6c6a80}.studio-next{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:26px 0}.studio-next strong{font-family:Outfit;font-size:21px;font-weight:500}.studio-next p{font-size:14px;margin-top:7px;color:#66667c;line-height:1.6}.studio-next .button{background:#6b58ad;border-color:#6b58ad;flex-shrink:0}.studio-status{min-height:24px;font-size:14px;color:#705790}.upload-layout{display:grid;grid-template-columns:1.6fr 1fr;background:white;border-radius:24px;overflow:hidden;border:1px solid #22265118}.upload-zone{margin:25px;border:2px dashed #c8b7df;border-radius:18px;min-height:480px;display:grid;place-items:center;text-align:center;padding:25px;background:#f9f7fc}.upload-zone.dragging{background:#eee4ff;border-color:#6b58ad}.upload-symbol{display:inline-grid;place-items:center;width:70px;height:70px;border-radius:24px;background:#eae2f6;font-size:38px;margin-bottom:23px}.upload-zone h2{font-size:45px;line-height:1.05}.upload-zone p{font-size:15px;line-height:1.6;margin:20px 0}.upload-zone small{display:block;font-size:12px;margin:18px 0;color:#79758b}.upload-advice{background:#eae2f6;padding:42px}.upload-advice h2{font-size:43px;line-height:1.1;margin:18px 0}.upload-advice p{font-size:15px;line-height:1.8}.upload-advice img{width:180px;height:auto;object-fit:contain;padding:8px;background:#fff;transform:rotate(5deg);margin:30px auto;border-radius:5px}.upload-advice .small-note{font-size:13px}#upload-preview{width:100%}#uploaded-image{max-height:400px;margin:auto;object-fit:contain}#upload-preview>div{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:22px}.order-panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;background:#eee8f7;border-radius:26px;padding:45px;margin-top:25px;scroll-margin-top:30px}.order-preview img{background:white;width:100%;max-height:430px;object-fit:contain;box-shadow:0 15px 30px #22265112;border:12px solid white;transform:rotate(-3deg);margin:30px 0}.order-panel h2{font-size:40px;line-height:1.1;margin:14px 0}.order-intro{font-size:14px;line-height:1.7;margin-bottom:22px}.order-panel form>label,.field-row label{display:grid;gap:8px;font-size:14px;margin-bottom:18px}.order-panel input:not([type=checkbox]):not([type=radio]),.order-panel textarea,#modal-input{width:100%;padding:13px 14px;border:1px solid #22265125;background:white;border-radius:10px;color:var(--ink);font:inherit;min-width:0}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.order-panel textarea{resize:vertical}.order-panel .adult-consent{display:flex;align-items:flex-start;line-height:1.6;font-size:13px;margin:18px 0}.adult-consent input{margin-top:4px;flex-shrink:0;width:18px;height:18px;accent-color:#6b58ad}.order-total{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #22265120;padding:22px 0 12px;font-size:14px}.order-total strong{font-size:22px}.payment-note{font-size:13px;line-height:1.7}.order-panel form>small{display:block;font-size:12px;line-height:1.6;margin-top:13px}#order-status{font-size:14px;line-height:1.7;margin-top:12px}.product-option{display:flex;gap:10px;background:white;border-radius:12px;padding:15px;margin-bottom:10px}.return-panel{text-align:center;padding:55px;border-radius:24px;background:#d5eadc;margin-top:25px}.return-panel h2{font-size:38px}.return-panel p{margin:20px 0;line-height:1.8}.studio-page [hidden]{display:none!important}#studio-dialog{border:0;border-radius:22px;padding:32px;max-width:460px;width:calc(100% - 35px);color:var(--ink);background:var(--paper)}#studio-dialog::backdrop{background:#22265180;backdrop-filter:blur(5px)}#studio-dialog h2{font-size:30px}#studio-dialog p{margin:15px 0;line-height:1.6}.modal-actions{display:flex;gap:15px;justify-content:flex-end;margin-top:24px}.modal-actions button{border:0;background:none;font:inherit}.modal-actions .button{background:var(--ink);color:white}.atelier:fullscreen{border-radius:0}.atelier:fullscreen .canvas-viewport{height:calc(100vh - 200px)}.studio-page input:focus-visible,.studio-page textarea:focus-visible,.studio-page button:focus-visible{outline:3px solid #8068b0;outline-offset:3px}
@media(min-width:1500px){.canvas-viewport{height:590px}}@media(max-width:1050px){.pencil-tag{display:none}.atelier-body{grid-template-columns:74px minmax(0,1fr) 170px}.canvas-viewport{height:430px;padding:16px}.studio-properties{padding:15px 10px}.studio-next{align-items:flex-start;flex-direction:column}.atelier-top{padding:15px}.order-panel{gap:30px;padding:30px}.top-actions button{font-size:12px}.studio-heading h1{font-size:46px}}@media(max-width:720px){.studio-main{padding:30px 4% 50px}.studio-heading h1{font-size:36px}.studio-heading p{font-size:14px}.studio-badge{display:none}.studio-page header{height:72px}.back-link{font-size:12px}.atelier-top{display:block}.top-actions{margin-top:12px}.atelier-body{display:flex;flex-direction:column}.toolbox{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid #22265115;padding:8px}.toolbox button{min-width:59px;flex-shrink:0}.canvas-settings{padding:10px;gap:10px;font-size:12px}.canvas-settings input[type=range]{width:60px}.canvas-viewport{height:auto;min-height:260px;max-height:65vh;padding:14px}.canvas-frame{width:100%}.canvas-bottom{font-size:11px;padding:8px}.studio-properties{border-left:0;border-top:1px solid #22265115;display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;padding:18px}.property-heading{grid-column:1;margin:0}.palette{grid-column:1;grid-row:2/5;align-content:start;gap:10px}.palette button{max-width:28px}.custom-color{grid-column:1;grid-row:5;margin:0;justify-content:flex-start}.paper-color{grid-column:1;grid-row:6;margin:0;justify-content:flex-start}.layers-heading{grid-column:2;grid-row:1;margin:0;padding:0;border:0}.layers{grid-column:2;grid-row:2/4;margin:0;max-height:90px}.layer-actions{grid-column:2;grid-row:4;margin:0}.layer-opacity{grid-column:2;grid-row:5;margin:0}.clear-button{grid-column:2;grid-row:6;margin:0}.studio-tip{display:none}.studio-next .button{width:100%;font-size:13px;gap:12px}.studio-next strong{font-size:20px}.creation-tabs button{padding:12px 18px;font-size:14px}.upload-layout,.order-panel{grid-template-columns:1fr}.upload-zone{margin:16px;padding:20px;min-height:400px}.upload-zone h2{font-size:36px}.upload-advice{padding:25px}.upload-advice img{float:right;width:100px;height:auto;margin:12px}.upload-advice h2{font-size:32px}.order-panel{padding:24px;gap:20px}.order-preview img{max-height:230px;margin:20px 0}.order-panel h2{font-size:33px}.field-row{grid-template-columns:1fr;gap:0}.order-total{flex-direction:column}.return-panel{padding:30px}.studio-page footer{gap:20px}.atelier:fullscreen .canvas-viewport{height:auto}}
.studio-page .creation-tabs button[aria-selected=true]{color:white}.studio-heading h1{letter-spacing:-.035em}.canvas-frame{max-width:589px}.atelier:fullscreen .canvas-frame{max-width:calc((100vh - 248px)*1.3333)}@media(min-width:1500px){.canvas-frame{max-width:722px}}@media(max-width:1050px) and (min-width:721px){.canvas-frame{max-width:530px}}@media(max-width:720px){.canvas-frame{max-width:100%}}