/* Use installed fonts only: page startup must never wait for a font network. */
:root{--bg:#f6f6f4;--paper:#fff;--ink:#252623;--muted:#82837e;--line:#e9e9e5;--accent:#bc705c;--accent-dark:#9e5543;--accent-pale:#fbf2ee;--round:20px;font-family:'DM Sans',Arial,sans-serif;color:var(--ink);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg)}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button{border:0;background:none}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:4px}a{color:inherit;text-decoration:none}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}[data-icon]{display:inline-flex;align-items:center;justify-content:center}[hidden]{display:none!important}.studio-header{height:96px;padding:0 3.1%;display:flex;align-items:center;justify-content:space-between;gap:25px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.8)}.header-start,.header-end{display:flex;align-items:center;gap:18px}.brand{font-family:'Nunito',sans-serif;font-size:22px;font-weight:1000;letter-spacing:-1px;white-space:nowrap}.brand>span:first-child{font-weight:700}.brand-dot{font-size:10px;vertical-align:top;margin-left:3px;letter-spacing:0}.header-divider{height:23px;width:1px;background:var(--line)}.header-subtitle{font-size:12px;color:var(--muted);white-space:nowrap}.studio-header h1{font-family:'Nunito',sans-serif;font-size:19px;font-weight:900;margin:0;letter-spacing:.15px;white-space:nowrap}.icon-button{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0}.icon-button:hover{background:#f0efeb}.close-studio{border:1px solid var(--line);background:#fff}.saved-indicator{font-size:11px;color:#777d70;display:flex;align-items:center;gap:7px;white-space:nowrap;padding:8px 0}.saved-indicator>span{width:5px;height:5px;background:#93a180;border-radius:50%}.primary{background:var(--accent);color:#fff;border:1px solid var(--accent);border-radius:30px;min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:14px;padding:12px 22px;transition:background .15s,transform .15s}.primary:hover{background:var(--accent-dark);border-color:var(--accent-dark)}.primary:active{transform:translateY(1px)}.add-button{min-width:170px}.add-button svg{width:18px}.add-price{font-size:12px;font-weight:500}.workspace{width:min(1280px,94%);margin:34px auto 26px;display:grid;grid-template-columns:minmax(0,1fr) 388px;gap:58px;align-items:start}.preview-column{min-width:0}.preview-heading{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#6e706a;margin:0 4px 16px}.live-label{display:flex;align-items:center;gap:6px;font-size:10px}.live-label i{width:5px;height:5px;background:#90a47b;border-radius:50%}.preview-card{width:100%;max-width:700px;margin:0 auto;background:#fff;border:1px solid #efefeb;border-radius:16px;position:relative;aspect-ratio:1/1;box-shadow:0 10px 35px #22221104;overflow:hidden;isolation:isolate}.preview-card>canvas{position:absolute;inset:2%;width:96%;height:96%;touch-action:none;cursor:grab;transition:transform .18s}.preview-card>canvas:active{cursor:grabbing}.preview-card.zoomed>#design-canvas{transform:scale(1.25)}.preview-card.scene-mode{background:#302f2b}.preview-card.scene-mode>canvas{inset:0;width:100%;height:100%}.canvas-float{position:absolute;z-index:4;width:42px;height:42px;background:#fff;border:1px solid #f1f1ee;box-shadow:0 3px 10px #0000000c;border-radius:50%;display:flex;align-items:center;justify-content:center}.export-button{top:17px;left:17px}.zoom-button{left:17px;bottom:17px}.mode-button{right:17px;bottom:17px;background:var(--accent);color:white;flex-direction:column;gap:0;font-family:'Nunito',sans-serif;font-size:13px;font-weight:800;line-height:13px;padding-top:4px;border:0}.mode-button svg{height:11px;width:25px;stroke-width:1.3}.scene-mode .mode-button{background:#fff;color:var(--accent)}.canvas-hint{position:absolute;z-index:4;top:23px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:650;color:#655f54;white-space:nowrap;padding:9px 14px;border-radius:22px;background:#ffffffe6;box-shadow:0 2px 15px #00000008;display:flex;align-items:center;gap:6px;pointer-events:none}.canvas-hint svg{width:15px;height:15px;color:var(--accent)}.canvas-hint.dismissed{opacity:0;transition:opacity .25s}.selection-box{position:absolute;border:1px dashed #ffffffdc;z-index:3;pointer-events:none;filter:drop-shadow(0 0 1px #46413666)}.element-handle{width:30px;height:30px;border-radius:50%;background:#fff;display:flex;justify-content:center;align-items:center;position:absolute;pointer-events:auto;box-shadow:0 2px 6px #0001;border:1px solid #eee}.element-handle svg{width:17px;height:17px}.handle-flip{right:-15px;top:-15px}.handle-delete{left:-15px;bottom:-15px}.handle-transform{right:-15px;bottom:-15px;cursor:nwse-resize}.zoomed .selection-box{display:none}.scene-tabs{position:absolute;top:20px;left:50%;transform:translateX(-50%);display:flex;background:#171716d9;border-radius:24px;padding:5px;gap:4px;white-space:nowrap;z-index:6}.scene-tabs button{font-size:11px;color:#eeeee7;border-radius:18px;display:flex;align-items:center;gap:6px;padding:8px 13px;font-weight:650}.scene-tabs button svg{width:14px;height:14px}.scene-tabs button.active{color:#222;background:#fff}.zoom-badge{position:absolute;bottom:25px;left:70px;font-size:10px;background:#fff;padding:5px 8px;border-radius:12px}.preview-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0}.history-controls{display:flex;align-items:center;gap:2px}.history-controls .icon-button{width:34px;height:34px;color:#74776e}.history-controls .icon-button svg{width:16px;height:16px}.tool-divider{width:1px;height:13px;background:#ddd;margin:0 9px}.reset-button,.download-link{display:flex;align-items:center;gap:6px;font-size:10px;color:#777b70;padding:10px 0}.reset-button svg,.download-link svg{width:13px;height:13px}.preview-caption{font-size:10px;color:#92948c}.lens-tray{display:flex;align-items:center;gap:12px;padding:17px 20px;background:#edeee9;border:1px solid #e7e8e1;border-radius:12px;margin-top:8px}.lens-thumb{width:46px;height:46px;position:relative;flex-shrink:0}.lens-thumb canvas{width:100%;height:100%;border-radius:50%;border:2px solid #fff;box-shadow:0 2px 5px #0001}.lens-check{position:absolute;bottom:-1px;right:-3px;width:15px;height:15px;background:#79836f;color:#fff;border:2px solid #edeee9;border-radius:50%}.lens-check svg{width:9px;height:9px;stroke-width:2.5}.lens-tray strong{display:block;font-size:12px;font-weight:650}.lens-tray>div>span:not(.lens-check){display:block;font-size:10px;color:#85877b;margin-top:4px}.lens-count{margin-left:auto;color:#878b7e;font-size:10px;letter-spacing:1px}.editor-column{padding-top:0;min-width:0}.editor-intro{margin:0 0 27px}.editor-intro h2{font-family:'Nunito',sans-serif;font-size:27px;font-weight:900;letter-spacing:-.8px;margin:0 0 5px}.editor-intro p{font-size:12px;color:var(--muted);margin:0;line-height:1.6}.editor-sections{border-top:1px solid var(--line)}.editor-step{border-bottom:1px solid var(--line)}.step-heading{width:100%;display:flex;align-items:center;gap:10px;min-height:64px;padding:15px 0;text-align:left;font-family:'Nunito',sans-serif;font-size:15px;font-weight:900;letter-spacing:.15px}.step-number{color:var(--accent);font-size:13px}.step-symbol{margin-left:auto;font-family:Arial,sans-serif;font-size:22px;font-weight:400;color:#767870}.step-body{padding:1px 0 23px}.upload-button{width:100%;border:1.5px solid var(--accent);color:var(--accent-dark);border-radius:10px;min-height:54px;font-size:14px;font-weight:600;display:flex;gap:10px;align-items:center;justify-content:center;background:#fff;transition:background .15s}.upload-button:hover{background:var(--accent-pale)}.upload-button svg{width:19px;height:19px}.gallery-heading{margin-top:23px;margin-bottom:13px;display:flex;flex-direction:column;gap:5px}.gallery-heading strong{font-size:12px;font-weight:600}.gallery-heading>span{font-size:10px;color:#8f9288}.portrait-gallery{display:flex;align-items:center;gap:11px;flex-wrap:wrap}.portrait-tile{height:79px;width:79px;border-radius:12px;position:relative;border:1px solid var(--line);background:#f6f5f1;padding:7px}.portrait-tile img{width:100%;height:100%;object-fit:contain}.portrait-tile.active{border:1.5px solid var(--accent);background:var(--accent-pale)}.portrait-tile.active::after{content:'✓';position:absolute;right:-4px;bottom:-3px;background:var(--accent);color:#fff;width:17px;height:17px;font-size:11px;line-height:17px;border-radius:50%;border:2px solid white}.portrait-add{height:79px;width:65px;border:1px dashed #d7d9d1;border-radius:12px;color:#9ba08e;display:grid;place-items:center}.tip{margin:22px 0 0;background:#f0f1ec;border-radius:9px;padding:13px;display:flex;align-items:flex-start;gap:9px;color:#858a7b}.tip svg{width:17px;height:17px}.tip p{font-size:10px;line-height:1.7;margin:0}.template-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px 12px}.template-tile{padding:0;text-align:center;min-width:0}.template-tile canvas{width:100%;aspect-ratio:1;border-radius:50%;border:3px solid transparent;padding:3px}.template-tile.active canvas{border-color:var(--accent)}.template-tile>span{font-size:9px;display:block;color:#7d8175;line-height:1.3;margin-top:3px}.control-note{font-size:10px;color:#8a8f80;line-height:1.7;margin:16px 0 0}.text-tabs{display:flex;gap:8px;margin:0 0 18px}.text-tabs button{font-size:11px;border:1px solid var(--line);border-radius:18px;padding:8px 13px;display:flex;align-items:center;gap:9px}.text-tabs button.active{background:var(--ink);color:white;border-color:var(--ink)}.text-tabs .remove-line{width:17px;height:17px;background:#0001;border-radius:50%;display:grid;place-items:center}.field-label{display:block;font-size:11px;font-weight:600;margin:0 0 9px}.text-input,select{width:100%;border:1px solid #dfe1da;border-radius:8px;background:white;color:#41463b;padding:12px 13px;font-size:13px;min-height:43px}.text-input:focus,select:focus{border-color:var(--accent)}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:20px 0}.color-control{display:flex;align-items:center;border:1px solid #dfe1da;border-radius:8px;background:#fff;min-height:43px;padding:7px 9px;gap:10px}.color-control input{width:24px;height:24px;border:0;padding:0;background:none;cursor:pointer}.color-control span{font-size:10px;color:#6b7064}.font-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.font-option{height:46px;background:white;border:1px solid var(--line);border-radius:7px;font-size:13px}.font-option.active{border-color:var(--accent);background:var(--accent-pale);color:var(--accent-dark)}.font-notebook{font-family:'Comic Sans MS',cursive}.font-classic{font-family:Georgia,serif}.font-poster{font-family:Impact,'Arial Black',sans-serif}.font-pixel{font-family:'Courier New',monospace;font-weight:800}.font-bubble{font-family:'Nunito',sans-serif;font-weight:1000}.font-spooky{font-family:Georgia,serif;font-weight:bold;font-style:italic}.range-label{display:flex;justify-content:space-between;align-items:center;font-size:10px;margin:18px 0 8px}.range-label output{color:#8e9385;font-size:10px}input[type=range]{width:100%;height:16px;margin:0;accent-color:var(--accent);cursor:pointer}.sticker-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.sticker-tile{aspect-ratio:1;background-color:#fff;background-image:linear-gradient(45deg,#f2f2ee 25%,transparent 25%),linear-gradient(-45deg,#f2f2ee 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f2f2ee 75%),linear-gradient(-45deg,transparent 75%,#f2f2ee 75%);background-size:12px 12px;background-position:0 0,0 6px,6px -6px,-6px 0;border:1px solid var(--line);border-radius:10px;padding:6px}.sticker-tile:hover{border-color:var(--accent)}.sticker-tile canvas{width:100%;height:100%}.element-controls{margin-top:23px;border:1px solid #e6e7e0;border-radius:10px;padding:14px 16px;background:#fafaf8}.element-controls-title{display:flex;justify-content:space-between;font-size:11px;font-weight:600}.element-controls-title>span:last-child{font-size:10px;font-weight:400;color:#94988c}.element-controls .range-label{margin-top:15px}.position-actions{display:flex;gap:5px;margin-top:12px}.position-actions button{font-size:13px;background:#fff;border:1px solid var(--line);border-radius:5px;height:28px;min-width:32px}.position-actions button:last-child{margin-left:auto;font-size:10px;padding:0 10px}.editor-footer{display:flex;align-items:center;justify-content:center;gap:7px;margin:25px 0 10px;font-size:9px;color:#989b91}.editor-footer svg{height:13px;width:13px;color:#b47d6c}.site-footer{border-top:1px solid var(--line);margin:0 3.1%;padding:19px 0;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#95998b}.site-footer>span:nth-child(2){display:flex;align-items:center;gap:5px}.site-footer svg{width:12px;height:12px}.site-footer button{font-size:10px;color:#7c8272}.footer-separator{margin:0 10px;color:#c1c4b8}.mobile-step-nav{display:none}
dialog{border:1px solid #ebece6;max-width:calc(100vw - 30px);border-radius:20px;padding:28px;background:#fff;color:var(--ink);box-shadow:0 25px 100px #0002}dialog::backdrop{background:#25282061;backdrop-filter:blur(5px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.dialog-heading h2{font-family:'Nunito',sans-serif;font-weight:900;font-size:24px;letter-spacing:-.5px;margin:4px 0 0}.dialog-heading .icon-button{background:#f5f5f1}.dialog-eyebrow{font-size:10px;color:#919783}.portrait-dialog{width:800px}.portrait-dialog-body{display:grid;grid-template-columns:1fr 1fr;gap:28px}.portrait-image-panel{position:relative;display:flex;flex-direction:column}.portrait-image-wrap{aspect-ratio:1;background:#f2f1eb;border-radius:15px;display:grid;place-items:center;overflow:hidden}.portrait-image-wrap img{width:90%;height:90%;object-fit:contain}.replace-photo{font-size:11px;color:var(--accent-dark);display:flex;align-items:center;justify-content:center;gap:7px;padding:15px 0}.replace-photo svg{width:15px;height:15px}.look-label{margin-top:20px}.look-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.look-option{font-size:9px;border:1px solid var(--line);border-radius:7px;padding:5px 3px 6px;min-width:0}.look-option img{width:100%;aspect-ratio:1;object-fit:contain;display:block;background:#f3f3ef;border-radius:4px;margin-bottom:4px}.look-option.active{border-color:var(--accent);color:var(--accent-dark);background:var(--accent-pale)}.fine-tune-button{display:flex;align-items:center;gap:7px;width:100%;font-size:10px;text-align:left;color:var(--accent-dark);padding:17px 0 8px}.fine-tune-button>span:last-child{margin-left:auto}.fine-tune-button svg{height:14px;width:14px}.portrait-note{font-size:9px;color:#999e8f;line-height:1.6;margin:14px 0 0}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:23px;border-top:1px solid var(--line);margin-top:18px}.secondary{border:1px solid #dcded5;border-radius:24px;min-height:44px;padding:10px 22px;font-size:12px}.dialog-actions .primary{font-size:12px}.dialog-actions svg{width:15px;height:15px}.checkbox-label{font-size:10px;display:flex;align-items:center;gap:6px;margin-top:15px}.checkbox-label input{accent-color:var(--accent)}.portrait-processing{position:absolute;inset:0;background:#ffffffd9;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;border-radius:15px;font-size:13px}.spinner{width:30px;height:30px;border-radius:50%;border:2px solid #e7d9d1;border-top-color:var(--accent);animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.cart-dialog{width:450px}.cart-item{display:flex;align-items:center;gap:15px;padding:15px 0;border-bottom:1px solid var(--line)}.cart-item img{width:76px;height:76px;border-radius:50%}.cart-item>div{flex:1}.cart-item strong{font-size:12px;display:block}.cart-item p{font-size:10px;color:var(--muted);margin:7px 0}.cart-item button{font-size:10px;color:var(--accent);padding:0}.cart-item>span{font-size:12px}.cart-total{display:flex;justify-content:space-between;font-size:14px;padding:24px 0 5px}.cart-note{font-size:11px;line-height:1.8;color:#8d9382;margin-bottom:22px}.wide{width:100%}.text-button{font-size:12px;min-height:44px;margin-top:5px}.help-dialog{width:480px}.help-dialog p{font-size:13px;line-height:1.7;color:#686e5e}.help-dialog small{font-size:11px;line-height:1.8;color:#989d8f;display:block;border-top:1px solid var(--line);padding-top:15px;margin-top:20px}.toast{position:fixed;z-index:20;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#303629;color:#fff;padding:12px 21px;font-size:12px;border-radius:24px;box-shadow:0 5px 25px #0002;transition:opacity .2s,transform .2s;max-width:90vw;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.closed-overlay{position:fixed;inset:0;background:#f2f2ed;z-index:15;display:grid;place-items:center}.closed-content{text-align:center}.closed-content>[data-icon]>svg{width:52px;height:52px;color:var(--accent)}.closed-content h2{font-family:'Nunito',sans-serif;font-size:54px;line-height:1.12;letter-spacing:-2px;margin:22px 0 15px;font-weight:1000}.closed-content p{font-size:14px;color:#8c927f}.closed-content .primary{margin-top:20px}
@media(min-width:1500px){.workspace{margin-top:40px;gap:70px;grid-template-columns:minmax(0,1fr) 400px}.preview-card{max-width:700px}.preview-heading{margin-bottom:20px}}
@media(max-width:1200px){.header-subtitle,.header-divider{display:none}.workspace{gap:35px;grid-template-columns:minmax(0,1fr) 350px}.saved-indicator{display:none}.preview-caption{display:none}.studio-header{height:80px}.workspace{margin-top:26px}.editor-intro{margin-bottom:20px}}
@media(max-width:900px){.brand{font-size:19px}.studio-header h1{font-size:16px}.workspace{gap:25px;grid-template-columns:minmax(0,1fr) 310px}.template-grid{gap:10px 6px}.sticker-grid{gap:7px}.editor-intro h2{font-size:24px}.portrait-tile{height:65px;width:65px}.portrait-add{height:65px;width:55px}.preview-heading{font-size:10px}.live-label{font-size:9px}.header-start{gap:10px}.add-button{min-width:130px;padding-left:16px;padding-right:16px}.add-price{font-size:10px}.editor-footer{font-size:8px}}
@media(max-width:720px){body{height:100dvh;overflow:hidden}.studio-header{height:64px;padding:8px 14px;margin:10px 12px 0;width:calc(100% - 24px);border-radius:36px;border:0;background:#fff;box-shadow:0 3px 16px #00000009;gap:5px;position:relative;z-index:5}.header-start{display:contents}.brand{display:none}.close-studio{width:38px;height:38px;background:#fafafa}.studio-header h1{font-size:15px;position:absolute;left:50%;transform:translateX(-50%);pointer-events:none}.header-end{margin-left:auto}.add-button{min-width:78px;min-height:38px;padding:7px 14px;font-size:12px}.add-price{display:none}.workspace{width:100%;margin:12px 0 0;display:flex;flex-direction:column;gap:10px;height:calc(100dvh - 86px);overflow:hidden}.preview-column{width:100%;flex-shrink:0;padding:0 20px}.preview-heading,.preview-bottom,.lens-tray{display:none}.preview-card{width:min(100%,calc(100dvh - 260px));max-width:500px;border-radius:10px;min-width:240px}.canvas-float{width:36px;height:36px}.export-button{top:12px;left:12px}.zoom-button{bottom:12px;left:12px}.mode-button{bottom:12px;right:12px;font-size:12px}.canvas-hint{top:23px;padding:8px 11px;font-size:10px}.editor-column{width:100%;display:flex;flex-direction:column;min-height:0;flex:1}.editor-intro,.editor-footer{display:none}.mobile-step-nav{display:flex;justify-content:space-between;align-items:center;min-height:48px;background:#fff;padding:0 10px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);flex-shrink:0}.mobile-step-nav strong{font-family:'Nunito',sans-serif;font-weight:900;font-size:16px;letter-spacing:.1px}.mobile-step-nav .icon-button{width:40px;height:40px}.editor-sections{border:0;overflow:auto;min-height:0;background:#fff;flex:1}.editor-step{border:0;display:none}.editor-step.open{display:block}.step-heading{display:none}.step-body{padding:17px 22px 22px!important;max-width:600px;margin:auto}.upload-button{width:min(100%,300px);margin:auto}.gallery-heading{margin-top:19px}.portrait-tile{height:67px;width:67px}.portrait-add{height:67px;width:60px}.tip{display:none}.element-controls{display:none}.site-footer{display:none}.template-grid{grid-template-columns:repeat(5,1fr);gap:10px}.sticker-grid{grid-template-columns:repeat(6,1fr)}.sticker-tile{min-width:0}.control-note{margin-top:10px}.font-grid{grid-template-columns:repeat(3,1fr)}.scene-tabs{top:16px;padding:4px}.scene-tabs button{padding:7px 10px;font-size:10px}.selection-box .element-handle{width:28px;height:28px}.portrait-dialog{padding:21px;max-height:calc(100dvh - 26px);overflow:auto}.dialog-heading{margin-bottom:18px}.dialog-heading h2{font-size:22px}.portrait-dialog-body{gap:18px;grid-template-columns:1fr}.portrait-image-wrap{aspect-ratio:1;max-height:27dvh}.portrait-image-wrap img{height:25dvh;max-width:100%}.replace-photo{padding:9px 0}.look-grid{grid-template-columns:repeat(7,1fr);gap:5px}.look-option{font-size:8px;padding:3px 2px}.look-label{margin-top:13px}.portrait-settings .text-input{min-height:39px;padding:9px 12px}.fine-tune-button{padding-top:14px}.portrait-note{margin:8px 0 0;font-size:8px}.dialog-actions{margin-top:12px;padding-top:16px}.dialog-actions button{flex:1}.dialog-eyebrow{font-size:9px}.portrait-processing{inset:0}.cart-dialog{padding:23px}.toast{bottom:18px;font-size:11px}.closed-content h2{font-size:45px}.help-dialog{padding:22px}}
@media(max-width:380px){.studio-header h1{font-size:13px}.preview-column{padding:0 15px}.mobile-step-nav strong{font-size:14px}.sticker-grid{grid-template-columns:repeat(5,1fr)}.template-grid{grid-template-columns:repeat(4,1fr)}.look-grid{grid-template-columns:repeat(4,1fr)}.portrait-dialog-body{gap:12px}.canvas-hint{font-size:9px}.scene-tabs button{padding:6px 8px}}
@media(min-width:721px){.workspace{margin-top:24px;margin-bottom:18px}.preview-card{width:min(100%,calc(100dvh - 255px))}.editor-column{max-height:calc(100dvh - 180px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#d8dbd1 transparent;padding-right:5px}.editor-intro h2{margin-top:0}.portrait-edit-link svg{width:13px;height:13px}}
@media(min-width:721px) and (max-height:850px){.studio-header{height:80px}.lens-tray{display:none}.preview-card{width:min(100%,calc(100dvh - 215px))}.editor-column{max-height:calc(100dvh - 160px)}.workspace{margin-top:20px;margin-bottom:12px}.site-footer{padding:15px 0}}
.mobile-canvas-tools,.mobile-reset{display:none}.element-handle{touch-action:none}.portrait-edit-link svg{width:13px;height:13px}.editor-column{overflow-x:hidden}.sticker-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.sticker-tile{min-width:0}.sticker-tile canvas{display:block}.template-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(min-width:721px){.portrait-gallery{gap:10px}.portrait-tile{width:69px;height:69px}.portrait-add{width:54px;height:69px}}
@media(max-width:720px){.mobile-canvas-tools{display:flex;position:absolute;right:10px;top:12px;gap:2px;z-index:5}.mobile-canvas-tools .icon-button{width:29px;height:29px;background:#ffffffeb;box-shadow:0 2px 6px #00000008}.mobile-canvas-tools svg{width:14px;height:14px}.mobile-reset{display:block;position:absolute;bottom:12px;left:50%;transform:translateX(-50%);padding:6px 12px;border-radius:20px;background:#ffffffe0;color:#7b806f;font-size:9px;z-index:5}.canvas-hint{top:17px;padding:7px 9px;font-size:9px}.canvas-hint svg{width:12px;height:12px}.scene-mode .mobile-canvas-tools{top:57px}.scene-mode .mobile-reset{display:none}}
@media(max-width:720px) and (max-height:500px){body{height:auto;min-height:100dvh;overflow:auto}.workspace{height:auto;overflow:visible}.preview-card{width:240px;min-width:0}.editor-column{min-height:270px;overflow:visible}.editor-sections{overflow:visible}.portrait-dialog{max-height:calc(100dvh - 20px)}.portrait-dialog-body{grid-template-columns:1fr 1fr}.portrait-image-wrap{max-height:none}.portrait-image-wrap img{height:150px}.look-grid{grid-template-columns:repeat(4,1fr)}}
.editor-step .step-heading{position:relative;border-radius:7px;outline-offset:-4px;padding-inline:12px}
.editor-step .step-heading:focus-visible{outline:2px solid var(--accent);outline-offset:-4px}
.editor-step .step-body{padding-top:8px}
.startup-status{position:fixed;z-index:40;left:50%;bottom:22px;transform:translateX(-50%);max-width:calc(100vw - 32px);background:#303629;color:white;border-radius:12px;padding:13px 20px;font:13px/1.6 'Segoe UI','Microsoft YaHei',Arial,sans-serif;box-shadow:0 3px 20px #0002}body[data-startup=error] .startup-status{background:#8d3e30}
.preview-stage{min-width:0}
.preview-card.scene-mode{width:100%;max-width:none;aspect-ratio:1.3;border-color:#343a34;background:#131a17}
.scene-mode .export-button,.scene-mode .mobile-canvas-tools,.scene-mode .mobile-reset,.scene-mode .zoom-badge{display:none!important}
.scene-mode .mode-button{background:#ffffffed;color:#5c6258}
.projection-overlay{position:absolute;inset:0;z-index:5;pointer-events:none}
.projection-overlay button{pointer-events:auto}
.projection-expand{top:14px;right:14px;width:36px;height:36px;background:#ffffffef;color:#4e5549}
.projection-expand svg{width:17px;height:17px}
.projection-viewbar{position:absolute;left:16px;bottom:43px;display:flex;gap:3px;padding:4px;border:1px solid #ffffff19;background:#172018d9;border-radius:22px;backdrop-filter:blur(12px);color:#f1f4ed}
.projection-viewbar button{border-radius:18px;min-height:30px;padding:5px 12px;font-size:10px;font-weight:600;transition:background .15s}
.projection-viewbar button.active{background:#edf1e8;color:#263123}
.projection-viewbar button:last-child{padding:5px 8px;border-left:1px solid #ffffff1c;border-radius:0 16px 16px 0}
.projection-viewbar svg{width:14px;height:14px}
.projection-gesture-hint{position:absolute;left:18px;bottom:17px;display:flex;align-items:center;gap:6px;font-size:9px;color:#e2e7dacf;text-shadow:0 1px 3px #000}
.projection-gesture-hint svg{width:13px;height:13px}.touch-gesture{display:none}
.projection-light-badge{position:absolute;top:65px;left:16px;border-radius:12px;padding:5px 10px;background:#172018d9;color:#f0e5d1;font-size:10px}
.projection-error{position:absolute;left:12%;right:12%;top:38%;font-size:12px;line-height:1.8;padding:20px;background:#152019e8;color:#f5f4ed;border:1px solid #ffffff30;border-radius:12px}
.projection-controls{margin-top:12px;border:1px solid #e5e7de;background:#fff;border-radius:12px;padding:19px 21px 13px}
.projection-panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.projection-panel-heading h3{font-family:'Nunito','Trebuchet MS',sans-serif;font-size:18px;font-weight:900;letter-spacing:-.4px;margin:0 0 4px}.projection-panel-heading p{font-size:10px;color:#8a9080;margin:0;line-height:1.5;max-width:320px}
.light-toggle{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:600;white-space:nowrap;cursor:pointer;position:relative}.light-toggle input{position:absolute;left:0;top:0;width:30px;height:20px;opacity:0;cursor:pointer}.toggle-track{display:block;width:30px;height:18px;border-radius:14px;background:#c7ccbf;transition:background .2s;position:relative}.toggle-track:after{content:'';width:12px;height:12px;border-radius:50%;background:white;position:absolute;left:3px;top:3px;transition:transform .2s}.light-toggle input:checked+.toggle-track{background:#748165}.light-toggle input:checked+.toggle-track:after{transform:translateX(12px)}.light-toggle input:focus-visible+.toggle-track{outline:2px solid var(--accent);outline-offset:3px}
.projection-metrics{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px;border-top:1px solid #eceee7;border-bottom:1px solid #eceee7;margin:15px 0;padding:12px 0}.projection-metrics>div{min-width:0}.projection-metrics span{display:block;font-size:9px;color:#909683;line-height:1.5}.projection-metrics strong{display:block;font-size:14px;font-weight:650;margin-top:4px;color:#38432f}.projection-metrics strong[data-level=low]{color:#a27a50}.projection-metrics strong[data-level=moderate]{color:#94845a}
.projection-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px 26px}.projection-setting{min-width:0}.projection-setting>label{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:600;margin-bottom:5px;gap:10px}.projection-setting output{font-size:10px;font-weight:400;color:#8a927d;white-space:nowrap}.projection-setting input[type=range]{height:20px}.projection-setting small{display:block;font-size:9px;color:#9ca28f;margin-top:5px}.height-presets,.environment-presets{display:flex;gap:4px;margin-top:4px}.height-presets button,.environment-presets button{font-size:9px;color:#868f79;min-height:24px;padding:4px 9px;border-radius:14px;border:1px solid transparent;white-space:nowrap}.height-presets button.active,.environment-presets button.active{background:#eef1e8;border-color:#e4e9d9;color:#4d5e3c}.height-presets button:hover,.environment-presets button:hover{background:#f4f6ef}
.projection-options{display:grid;grid-template-columns:1fr;gap:8px;align-content:start;padding-top:0}.projection-options>label{font-size:10px;color:#747f66;display:flex;align-items:center;gap:6px;cursor:pointer}.projection-options input{margin:0;width:13px;height:13px;accent-color:#7e8f69}.projection-options>button{font-size:10px;color:#7f8b6f;display:flex;align-items:center;justify-content:flex-start;gap:6px;padding:2px 0;width:max-content}.projection-options svg{width:13px;height:13px}
.projection-accuracy-note{font-size:9px;line-height:1.7;color:#9a9f91;margin:15px 0 0;display:flex;align-items:flex-start;gap:6px;border-top:1px solid #eceee7;padding-top:11px}.projection-accuracy-note svg{width:12px;height:12px;margin-top:2px}
body[data-preview-mode=projection] .preview-bottom,body[data-preview-mode=projection] .lens-tray{display:none}
.projection-dialog{width:min(1440px,calc(100vw - 24px));max-width:calc(100vw - 24px);height:min(900px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);padding:18px;background:#f4f5f0;border-radius:18px;overflow:hidden}.projection-dialog::backdrop{background:#10170fc9;backdrop-filter:blur(8px)}.projection-dialog-header{height:42px;display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.projection-dialog-header strong{display:block;font-size:16px;font-family:'Nunito','Trebuchet MS',sans-serif;font-weight:900}.projection-dialog-header span{display:block;font-size:10px;color:#8a927d;margin-top:4px}.projection-dialog-header .icon-button{background:#fff;width:36px;height:36px}#projection-fullscreen-host{height:calc(100% - 56px)}.projection-dialog .preview-stage{height:100%;display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:17px;align-items:stretch}.projection-dialog .preview-card{height:100%;min-height:280px;max-height:none;width:100%;max-width:none;aspect-ratio:auto}.projection-dialog .projection-controls{margin:0;padding:18px;overflow:auto;scrollbar-width:thin}.projection-dialog .projection-settings-grid{grid-template-columns:1fr;gap:24px}.projection-dialog .projection-panel-heading{align-items:flex-start}.projection-dialog .projection-panel-heading h3{font-size:17px;max-width:145px}.projection-dialog .projection-panel-heading p{max-width:160px;font-size:9px}.projection-dialog .projection-metrics{grid-template-columns:1fr 1fr}.projection-dialog .projection-metrics>div:last-child{grid-column:1/-1}.projection-dialog .projection-metrics strong{font-size:13px}.projection-dialog .light-toggle{font-size:9px;flex-direction:column}.projection-dialog .projection-options{gap:13px}.projection-dialog .projection-accuracy-note{margin-top:24px}
@media(max-width:900px){.projection-controls{padding:16px}.projection-settings-grid{gap:17px 15px}.projection-panel-heading h3{font-size:16px}.projection-panel-heading p{font-size:9px}.projection-metrics strong{font-size:12px}.height-presets button,.environment-presets button{padding:4px 6px}}
@media(max-width:800px){.projection-dialog .preview-stage{display:flex;flex-direction:column;height:auto;gap:12px}#projection-fullscreen-host{overflow-y:auto;overscroll-behavior:contain}.projection-dialog .preview-card{height:52dvh;min-height:240px;flex-shrink:0;aspect-ratio:auto}.projection-dialog .projection-settings-grid{grid-template-columns:1fr 1fr;gap:18px}.projection-dialog .projection-metrics{grid-template-columns:1.2fr 1fr 1fr}.projection-dialog .projection-metrics>div:last-child{grid-column:auto}.projection-dialog .projection-panel-heading h3,.projection-dialog .projection-panel-heading p{max-width:none}.projection-dialog .light-toggle{flex-direction:row}.projection-dialog .projection-controls{overflow:visible}.projection-dialog .projection-accuracy-note{margin-top:15px}}
@media(max-width:720px){body[data-preview-mode=projection] .workspace{overflow-y:auto;overscroll-behavior:contain;display:block}body[data-preview-mode=projection] .editor-column{display:none}body[data-preview-mode=projection] .preview-column{padding:0 13px 20px}.preview-card.scene-mode{aspect-ratio:1.12;max-width:none;width:100%;min-width:0;border-radius:12px}.projection-controls{margin-top:10px;padding:15px 14px 12px}.projection-panel-heading p{font-size:9px;max-width:235px}.projection-metrics{margin:12px 0;padding:10px 0;gap:8px}.projection-settings-grid{gap:16px 18px}.projection-setting>label{font-size:10px}.projection-setting input[type=range]{height:24px}.projection-viewbar{left:12px;bottom:42px}.projection-viewbar button{font-size:9px;padding:5px 10px;min-height:29px}.projection-gesture-hint{left:15px;font-size:8px;bottom:17px;max-width:calc(100% - 72px);line-height:1.4}.desktop-gesture{display:none}.touch-gesture{display:inline}.projection-expand{width:31px;height:31px;top:14px;right:12px}.scene-tabs{top:12px;left:12px;transform:none;gap:2px;padding:4px}.scene-tabs button{font-size:10px;padding:7px 10px;gap:5px}.projection-light-badge{top:59px;left:13px}.projection-options>label{font-size:9px}.projection-accuracy-note{font-size:8px}.projection-dialog{padding:13px;width:calc(100vw - 14px);max-width:calc(100vw - 14px);height:calc(100dvh - 14px);max-height:calc(100dvh - 14px);border-radius:14px}.projection-dialog-header strong{font-size:14px}.projection-dialog-header span{font-size:9px}.projection-dialog .projection-controls{padding:13px}.projection-dialog .projection-panel-heading h3{font-size:15px}.projection-dialog .projection-settings-grid{gap:16px}.projection-dialog .projection-metrics strong{font-size:12px}}
@media(max-width:720px){body[data-preview-mode=projection] .preview-card{position:sticky;top:0;z-index:8}.projection-dialog .preview-card{position:sticky;top:0;z-index:8}}
@media(max-width:720px) and (max-height:700px){body[data-preview-mode=projection] .preview-card.scene-mode{height:40dvh;min-height:220px;aspect-ratio:auto}.projection-dialog .preview-card{height:45dvh;min-height:220px}}
.projection-navigation{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 4px 0;min-width:0}
.projection-navigation .projection-viewbar{position:static;border:1px solid #e5e8df;background:#edf0e7;color:#69745c;backdrop-filter:none;flex-shrink:0}
.projection-navigation .projection-viewbar button.active{background:#fff;color:#3a4930;box-shadow:0 1px 3px #00000008}
.projection-navigation .projection-viewbar button:last-child{border-left-color:#d9dfd0}
.projection-navigation .projection-gesture-hint{position:static;color:#8a947e;text-shadow:none;max-width:230px;line-height:1.7;font-size:9px}
.projection-dialog .preview-stage{grid-template-areas:"canvas controls" "navigation controls";grid-template-rows:minmax(0,1fr) auto}
.projection-dialog .preview-card{grid-area:canvas}
.projection-dialog .projection-navigation{grid-area:navigation;padding:0 3px;min-height:38px}
.projection-dialog .projection-controls{grid-area:controls}
@media(max-width:1100px){.projection-navigation{flex-wrap:wrap;justify-content:center}.projection-navigation .projection-gesture-hint{max-width:none;text-align:center;font-size:8px}.projection-dialog .projection-navigation{justify-content:space-between;flex-wrap:nowrap}.projection-dialog .projection-gesture-hint{max-width:220px;text-align:left}}
@media(max-width:800px){.projection-dialog .preview-stage{gap:10px}.projection-dialog .projection-navigation{flex-wrap:wrap;justify-content:center}.projection-dialog .projection-gesture-hint{max-width:none;text-align:center}}
@media(max-width:720px){.projection-navigation{gap:4px;padding-top:7px;padding-bottom:0}.projection-navigation .projection-viewbar{padding:3px}.projection-navigation .projection-gesture-hint{line-height:1.4;font-size:8px}.projection-controls{margin-top:9px}.projection-dialog .projection-navigation{padding:0;min-height:45px;gap:3px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Automatic portrait generation: one scrollable work area and a persistent action bar. */
.portrait-dialog{width:min(760px,calc(100vw - 32px));max-width:760px;height:min(940px,calc(100dvh - 40px));max-height:calc(100dvh - 40px);padding:0;border:0;border-radius:28px;overflow:hidden;background:#fff;color:var(--ink,#292b27);box-shadow:0 28px 100px #0003}
.portrait-dialog[open]{display:flex;flex-direction:column}
.portrait-dialog::backdrop{background:#252725b0;backdrop-filter:blur(3px)}
.portrait-dialog>.dialog-heading{flex-shrink:0;margin:0;padding:22px 26px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}
.portrait-dialog .dialog-heading h2{font-size:26px;margin:3px 0 0;letter-spacing:-.5px}
.portrait-dialog .dialog-heading .icon-button{width:42px;height:42px;background:#f7f7f5;border-radius:50%}
.portrait-dialog-scroll{overflow-y:auto;min-height:0;flex:1;padding:24px 26px 18px;scrollbar-width:thin;scrollbar-color:#d6d7d1 transparent;overscroll-behavior:contain}
.portrait-preview-layout{display:grid;grid-template-columns:minmax(0,1fr) 76px;gap:16px;align-items:start}
.portrait-dialog .portrait-image-wrap{position:relative;aspect-ratio:1;max-height:none;overflow:hidden;border:1px solid #e2e3df;border-radius:20px;background:#f0f0ee;display:flex;align-items:center;justify-content:center}
.portrait-dialog .portrait-image-wrap img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;padding:12px;filter:none;image-rendering:auto}
.portrait-dialog .portrait-image-wrap.is-original img{padding:0}
@media(min-width:601px){.portrait-dialog .portrait-image-wrap{aspect-ratio:auto;height:min(52dvh,520px)}}
.portrait-results{display:flex;flex-direction:column;gap:12px;max-height:550px;overflow-y:auto;scrollbar-width:thin}
.portrait-result{position:relative;flex-shrink:0;width:100%;aspect-ratio:1;padding:3px;border:2px solid transparent;border-radius:12px;background:#f5f5f2;overflow:hidden}
.portrait-result img{display:block;width:100%;height:100%;object-fit:contain;border-radius:7px}
.portrait-result span{position:absolute;bottom:0;left:0;right:0;padding:3px 1px;font-size:10px;color:#fff;background:#30302fcc;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.portrait-result.active{border-color:var(--accent);box-shadow:0 4px 12px #b55c4420}
.portrait-result.active::after{content:'✓';position:absolute;top:3px;right:3px;border:2px solid #fff;border-radius:50%;width:23px;height:23px;background:var(--accent);color:#fff;font-weight:800;font-size:14px;line-height:20px;text-align:center}
.portrait-result-note{margin:14px 0 24px;font-size:12px;color:#787b72;line-height:1.6}
.portrait-error{padding:14px 16px;margin:0 0 22px;background:#fff2ec;border:1px solid #ebc4b7;border-radius:12px;color:#924e38;font-size:13px;line-height:1.6}
.portrait-dialog .portrait-processing{position:absolute;inset:0;z-index:2;background:#161916ba;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:24px;gap:18px}
.portrait-processing strong{font-size:clamp(17px,2.4vw,25px);line-height:1.35;max-width:360px}
.portrait-sparkle{font-size:42px;line-height:1;color:#f1d9bf}
.portrait-processing p{font-size:13px;line-height:1.6;max-width:300px;margin:0;color:#ffffffe0}
.portrait-processing small{font-size:11px;color:#ffffffad}
.portrait-progress{height:9px;width:85%;background:#ffffff40;border-radius:20px;overflow:hidden}
.portrait-progress span{display:block;width:35%;height:100%;border-radius:20px;background:#d17c62;animation:portrait-wait 2.4s ease-in-out infinite}
@keyframes portrait-wait{0%{transform:translateX(-105%)}100%{transform:translateX(390%)}}
.portrait-dialog .field-label{display:block;font-size:15px;font-weight:800;margin-bottom:10px}
.portrait-dialog .text-input{width:100%;min-height:50px;border:1px solid #dddeda;background:#fff;border-radius:12px;padding:13px 15px;font-size:16px;color:inherit}
.portrait-dialog textarea.text-input{font:inherit;font-size:14px;line-height:1.6;resize:vertical;min-height:90px;max-height:180px}
.portrait-dialog .look-label{margin-top:26px;margin-bottom:6px}
.portrait-style-note{font-size:11px;color:#8a8c82;line-height:1.6;margin:0 0 12px}
.portrait-dialog .look-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.portrait-dialog .look-option{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0;padding:9px 4px;border:2px solid #efefeb;border-radius:15px;background:#fff;font-size:11px}
.portrait-dialog .look-option.active{border-color:var(--accent);background:#fbf5f1}
.portrait-dialog .look-option img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:50%;background:#f6f6f3;padding:5px}
.portrait-dialog .look-option strong{font-size:11px}.portrait-dialog .look-option small{font-size:9px;color:#8a8c82;line-height:1.3}
.portrait-dialog .fine-tune-button{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin:16px 0 12px;padding:10px 0;color:#a07f73;text-decoration:underline;text-underline-offset:3px;font-size:12px}
.portrait-dialog #fine-tune-panel{padding:16px;background:#f8f8f5;border-radius:12px;margin-bottom:10px}
.portrait-dialog .replace-photo{display:flex;align-items:center;gap:7px;padding:12px 0;font-size:12px;color:#7a7e71}
.portrait-dialog .portrait-note{font-size:10px;color:#8b8f83;line-height:1.7;margin:10px 0 0}
.portrait-dialog>.dialog-actions{flex-shrink:0;display:flex;gap:12px;margin:0;padding:18px 26px;border-top:1px solid var(--line);background:#fff;box-shadow:0 -6px 18px #00000003}
.portrait-dialog .dialog-actions button{flex:1;min-width:0;min-height:54px;border-radius:30px;font-size:16px;font-weight:800;padding:12px 16px}
.portrait-dialog .dialog-actions .secondary{background:#30332f;border:0;color:#fff}
.portrait-dialog button:disabled{opacity:.45}
.portrait-job-status{display:block;margin-top:12px;padding:10px 12px;width:100%;border-radius:9px;background:#f2eee7;color:var(--accent-dark);font-size:11px;text-align:left}
@media(max-width:600px){.portrait-dialog{width:calc(100vw - 16px);height:calc(100dvh - 20px);max-height:calc(100dvh - 20px);border-radius:22px}.portrait-dialog>.dialog-heading{padding:16px 18px}.portrait-dialog .dialog-heading h2{font-size:21px}.portrait-dialog-scroll{padding:18px 16px}.portrait-preview-layout{grid-template-columns:minmax(0,1fr) 57px;gap:10px}.portrait-dialog .portrait-image-wrap{border-radius:15px}.portrait-results{gap:9px;max-height:330px}.portrait-result span{font-size:8px}.portrait-result.active::after{width:20px;height:20px;font-size:12px;line-height:17px}.portrait-dialog>.dialog-actions{padding:14px 16px;gap:9px}.portrait-dialog .dialog-actions button{font-size:13px;min-height:49px;padding:10px}.portrait-dialog .look-grid{gap:5px}.portrait-dialog .look-option{padding:6px 2px;border-radius:11px}.portrait-dialog .look-option strong{font-size:9px}.portrait-dialog .look-option small{display:none}.portrait-dialog .portrait-processing{padding:16px;gap:12px}.portrait-sparkle{font-size:29px}.portrait-processing p{font-size:11px}.portrait-processing strong{font-size:17px}.portrait-dialog .look-label{margin-top:20px}.portrait-dialog .portrait-note{font-size:10px}}
@media(prefers-reduced-motion:reduce){.portrait-progress span{animation:none;width:100%;opacity:.65}}

.portrait-tile-caption{position:absolute;bottom:0;left:0;right:0;padding:3px 2px;border-radius:0 0 10px 10px;background:#fffdf5ed;font-size:8px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.portrait-library-tools{display:flex;flex-wrap:wrap;gap:14px;margin-top:12px}.portrait-library-tools button{padding:4px 0;color:var(--accent-dark);font-size:10px;text-decoration:underline;text-underline-offset:3px}

body:not(.session-ready)>.studio-header,body:not(.session-ready)>.workspace,body:not(.session-ready)>.site-footer{visibility:hidden}
.session-gate{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:20px;background:#f6f6f4}.session-card{max-width:440px;width:100%;padding:38px;border:1px solid #e9e9e5;border-radius:24px;background:white;box-shadow:0 18px 70px #29271f09}.session-card h1{font-size:25px;line-height:1.5;margin:12px 0}.session-card p{font-size:13px;line-height:1.8;color:#85877e}.session-card label{display:block;font-size:13px;margin:22px 0 8px}.session-card input{width:100%;padding:14px;border:1px solid #ddd;border-radius:10px;font-size:16px}.session-card button{width:100%;margin-top:12px}.session-card #session-error{color:#aa4e3d;min-height:20px}.header-end #session-status{font-size:10px;color:#8b8e82}.header-end #session-logout{font-size:11px;color:#a05d4b}

body:not(.session-ready)>#startup-status{display:none}

.portrait-library-empty{font-size:12px;color:#8b8e82;line-height:1.7;width:100%;margin:0 0 8px}

/* lulufun: warm blush, soft lavender and deep plum. Artwork keeps its own palette. */
:root{--bg:#fbe3e5;--paper:#fff8fa;--ink:#38224f;--muted:#806c88;--line:#e7cfdf;--accent:#775399;--accent-dark:#513366;--accent-pale:#f0e4fa;font-family:'DM Sans','Microsoft YaHei','PingFang SC',Arial,sans-serif}
body{background:var(--bg);color:var(--ink)}
button,input,select,textarea{font-family:inherit}
.studio-header{background:#fff4f6;border-bottom-color:var(--line)}
.brand,.session-brand,.footer-brand{font-family:'Arial Rounded MT Bold','Nunito',Arial,sans-serif;font-weight:1000;letter-spacing:-1.6px;color:var(--ink)}
.brand{font-size:32px}.brand-dot{font-size:10px;letter-spacing:0;vertical-align:top;margin-left:3px}
.header-subtitle,.header-end #session-status,.header-end #session-logout,.preview-heading,.live-label,.preview-caption,.step-symbol,.gallery-heading>span,.control-note,.template-tile>span,.range-label output,.element-controls-title>span:last-child,.editor-footer,.lens-count,.lens-tray>div>span:not(.lens-check){color:var(--muted)}
.header-end #session-logout{color:var(--accent-dark)}
.header-end{gap:15px}.studio-header h1{font-family:inherit;font-size:21px;letter-spacing:.2px}
.primary{background:var(--accent);border-color:var(--accent);color:#fff}.primary:hover{background:var(--accent-dark);border-color:var(--accent-dark)}
.icon-button,.element-handle,.position-actions button{color:var(--ink)}
.preview-card{background:#fffafd;border-color:#ecdbe7;box-shadow:0 12px 36px #633e7010}
.preview-card .icon-button,.element-handle{background:#fff9fc;border-color:var(--line)}
.preview-card .mode-button{background:var(--accent)}
.reset-button,.download-link,.history-controls .icon-button{color:var(--accent-dark)}
.lens-tray,.tip{background:#eddef5;border-color:#e2ccea;color:#756180}
.lens-check{background:var(--accent);border-color:#eddef5}.tip svg,.editor-footer svg{color:var(--accent)}
.upload-button{background:#fff7fa}.portrait-tile{background:#fff2f6}.portrait-tile.active{background:var(--accent-pale)}
.portrait-add{border-color:#bea5ce;color:var(--accent)}.portrait-tile-caption{background:#fff5faed;color:var(--ink)}
.category-tabs button.active,.text-tabs button.active{background:var(--ink);border-color:var(--ink)}
.text-input,select,.color-control,.session-card input{border-color:#dcc6df;background:#fffafd;color:var(--ink)}
.font-option,.position-actions button{background:#fff8fc}.element-controls{background:#fff1f7;border-color:var(--line)}
.sticker-tile{background-color:#fff8fc;background-image:linear-gradient(45deg,#f0e6f3 25%,transparent 25%),linear-gradient(-45deg,#f0e6f3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f0e6f3 75%),linear-gradient(-45deg,transparent 75%,#f0e6f3 75%)}
.site-footer{justify-content:flex-start;gap:0;color:var(--muted)}.footer-brand{font-size:17px;letter-spacing:-.7px}.footer-separator{color:#baa0c2}
.slogan-paw{display:inline-block;width:1em;height:1em;fill:currentColor;stroke:none;vertical-align:-.08em;margin:0 .08em}
.site-footer svg.slogan-paw{width:1em;height:1em}
.language-switch{display:inline-flex;align-items:center;gap:3px;padding:4px;border:1px solid #d7bfdc;border-radius:30px;background:#fff7facc;flex-shrink:0}
.language-switch button{min-width:43px;padding:7px 10px;border-radius:22px;font-size:12px;font-weight:650;line-height:1.3;color:#74567e;transition:background .15s,color .15s}
.language-switch button[aria-pressed=true]{background:var(--ink);color:#fff;box-shadow:0 2px 5px #38224f13}
.language-switch button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.session-gate{background:radial-gradient(ellipse at 15% 20%,#ede0fa 0,transparent 50%),var(--bg)}
.session-card{position:relative;background:#fff6f9;border-color:var(--line);box-shadow:0 20px 80px #38224f0d}
.session-brand{font-size:35px;margin-bottom:26px}.session-language{position:absolute;right:28px;top:30px}.session-card .session-language button{width:auto;margin:0}
.session-card p,.dialog-eyebrow{color:var(--muted)}.session-card #session-error{color:#a54567}
dialog{background:#fff8fb;border-color:var(--line);color:var(--ink)}dialog::backdrop{background:#2b173c73}
.dialog-heading .icon-button{background:#f1e4f6}.portrait-dialog>.dialog-heading,.portrait-dialog>.dialog-actions{background:#fff5f9;border-color:var(--line)}
.portrait-dialog .text-input{background:#fffafd;border-color:#dcc6df}
.portrait-dialog .look-option{background:#fff9fc;border-color:#e8dbe9}.portrait-dialog .look-option.active{background:#eee1f7;border-color:var(--accent)}
.portrait-dialog .look-option img{background:#f4eaf5}.portrait-dialog .look-option small,.portrait-style-note,.portrait-dialog .portrait-note,.portrait-result-note,.portrait-dialog .replace-photo{color:var(--muted)}
.portrait-dialog .fine-tune-button{color:var(--accent-dark)}.portrait-dialog #fine-tune-panel{background:#f0e4f7}
.portrait-dialog .dialog-actions .secondary{background:var(--ink)}.portrait-job-status{background:#eddef5}.portrait-progress span{background:#d59bc8}
.portrait-result.active{box-shadow:0 4px 12px #77539920}.portrait-error{background:#fff0f4;border-color:#e9bacc;color:#94445f}.toast{background:var(--ink)}
.closed-overlay{z-index:2100;overflow:auto;padding:50px 24px 65px;background:radial-gradient(ellipse at 18% 18%,#f9d2de 0,transparent 52%),radial-gradient(ellipse at 88% 80%,#e9d9f9 0,transparent 53%),#fbe3e5}
.closed-content{position:relative;z-index:1;width:min(100%,850px);display:flex;align-items:center;flex-direction:column}
.home-language{position:absolute;top:28px;right:32px;z-index:2}
.lulufun-motion{width:clamp(275px,39vw,460px);aspect-ratio:1;position:relative;margin:-45px 0 -52px;transform:scale(var(--logo-scale,1));isolation:isolate}
.lulufun-motion img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;will-change:transform}
.lulufun-motion img[data-layer=wordmark]{z-index:2}
.closed-content h2{font-family:inherit;font-weight:750;font-size:clamp(24px,3.25vw,40px);letter-spacing:1.5px;line-height:1.55;margin:0 0 12px;color:var(--ink)}
.closed-content h2 [data-lang=zh]{white-space:nowrap}.closed-content h2 [data-lang=en]{letter-spacing:-1px;font-size:.95em}
.closed-content p{font-size:14px;line-height:1.8;letter-spacing:.4px;color:var(--muted);margin:0 0 28px}
.closed-content .primary{margin:0;min-width:190px;min-height:53px;padding:14px 28px;font-size:15px;box-shadow:0 6px 18px #7753991a;gap:13px}
.home-footnote{position:absolute;bottom:24px;left:0;right:0;text-align:center;color:#8d7595;font-size:10px;letter-spacing:1.4px}
@media(max-width:1100px){.header-subtitle,.header-divider{display:none}.studio-header h1{font-size:18px}.saved-indicator{display:none}.header-end{gap:10px}}
@media(max-width:720px){.studio-header{background:#fff4f8}.studio-header h1{left:65px;transform:none;font-size:14px;max-width:calc(100% - 250px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-language{padding:3px;gap:1px}.header-language button{min-width:29px;font-size:10px;padding:6px}.header-end{gap:6px}.header-end #session-status{display:none}.header-end #session-logout{font-size:9px;max-width:70px;line-height:1.4}.mobile-step-nav,.editor-sections{background:#fff5f9}.close-studio{background:#f0e2f6}.mobile-step-nav strong{font-family:inherit;font-size:14px}.closed-overlay{padding:60px 20px 70px}.home-language{top:20px;right:20px}.lulufun-motion{width:min(85vw,370px);margin:-35px 0 -38px}.closed-content h2{font-size:clamp(21px,5.2vw,32px);letter-spacing:.3px}.closed-content p{font-size:12px}.closed-content .primary{font-size:14px}.session-card{padding:28px}.session-card h1{font-size:22px}.session-language{right:20px;top:26px}}
@media(prefers-reduced-motion:reduce){.lulufun-motion img{will-change:auto}.language-switch button{transition:none}}

/* A larger finished-design summary and visible export action. */
.download-link{min-height:46px;padding:12px 22px;border-radius:26px;background:var(--accent);color:#fff;font-size:14px;font-weight:750;gap:9px;box-shadow:0 4px 12px #77539922}
.download-link svg{width:18px;height:18px}.download-link:hover{background:var(--accent-dark)}
.download-link:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
.lens-tray{display:flex;padding:22px 24px;gap:18px}.lens-thumb{width:70px;height:70px}
.lens-tray strong{font-size:18px;color:var(--ink)}.lens-tray>div>span:not(.lens-check){font-size:13px;margin-top:7px}
.lens-check{width:21px;height:21px;display:grid;place-items:center}.lens-check svg{width:12px;height:12px}.lens-count{font-size:12px}
@media(max-width:720px){.preview-bottom{display:flex;justify-content:flex-end;padding:7px 0 0;min-height:49px}.preview-bottom .history-controls,.preview-bottom .preview-caption,.lens-tray{display:none}.download-link{min-height:42px;padding:10px 19px;font-size:13px}.preview-card{width:min(100%,calc(100dvh - 309px))}}

/* A running companion follows real generation phases; no invented percentage. */
.portrait-processing .portrait-progress-runway{position:relative;width:85%;height:53px;margin:0 0 -15px;flex-shrink:0}
.portrait-progress-dog{position:absolute;bottom:0;left:clamp(29px,var(--portrait-phase,8%),calc(100% - 29px));width:58px;height:46px;color:#513366;transform:translateX(-50%);transition:left 1s cubic-bezier(.3,.1,.25,1)}
.portrait-progress-dog svg{display:block;width:100%;height:100%;overflow:visible;fill:none;stroke:none}
.portrait-progress-dog .dog-coat{fill:#fff3e8;stroke:#513366;stroke-width:2.2;stroke-linejoin:round}
.portrait-progress-dog .dog-ear{fill:#d9a5c5;stroke:#513366;stroke-width:2;stroke-linejoin:round}
.portrait-progress-dog .dog-tail,.portrait-progress-dog .dog-leg path{fill:none;stroke:#513366;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.portrait-progress-dog .dog-collar{fill:none;stroke:#d59bc8;stroke-width:4;stroke-linecap:round}
.portrait-progress-dog .dog-eye,.portrait-progress-dog .dog-nose{fill:#38224f;stroke:none}
.portrait-progress-dog .dog-smile{fill:none;stroke:#513366;stroke-width:1.6;stroke-linecap:round}
.portrait-progress-dog .dog-shadow{fill:#2a163c;opacity:.18;stroke:none;transform-origin:center;animation:dog-shadow .45s ease-in-out infinite}
.portrait-progress-dog .dog-run-bob{animation:dog-bob .45s ease-in-out infinite}
.portrait-progress-dog .dog-leg{transform-box:fill-box;transform-origin:50% 0;animation:dog-stride .45s ease-in-out infinite alternate}
.portrait-progress-dog .dog-leg-front-alt,.portrait-progress-dog .dog-leg-back{animation-delay:-.45s}
.portrait-progress-dog .dog-tail{transform-box:fill-box;transform-origin:100% 100%;animation:dog-wag .3s ease-in-out infinite alternate}
.portrait-progress .portrait-progress-fill{width:var(--portrait-phase,8%);animation:none;transform:none;background:linear-gradient(90deg,#d59bc8,#e5c5ec);transition:width 1s cubic-bezier(.3,.1,.25,1)}
.portrait-processing[hidden] *{animation-play-state:paused!important}
.portrait-dialog [data-action="close-portrait"]:disabled{opacity:.3;cursor:wait}
@keyframes dog-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
@keyframes dog-stride{from{transform:rotate(-27deg)}to{transform:rotate(26deg)}}
@keyframes dog-wag{from{transform:rotate(-16deg)}to{transform:rotate(18deg)}}
@keyframes dog-shadow{0%,100%{transform:scaleX(1);opacity:.18}50%{transform:scaleX(.86);opacity:.12}}
@media(max-width:600px){.portrait-processing .portrait-progress-runway{height:42px;margin-bottom:-10px}.portrait-progress-dog{width:49px;height:39px;left:clamp(25px,var(--portrait-phase,8%),calc(100% - 25px))}}
@media(prefers-reduced-motion:reduce){.portrait-progress-dog,.portrait-progress .portrait-progress-fill{transition:none}.portrait-progress-dog *{animation:none!important}.portrait-progress .portrait-progress-fill{opacity:1}}
.template-decoration-editor{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.template-decoration-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px}
.template-decoration-heading button{color:var(--accent-dark);border:1px solid var(--line);border-radius:18px;min-height:36px;padding:6px 10px;font-size:10px;background:#fff8fc;flex-shrink:0}
.template-decoration-editor .control-note{line-height:1.7;margin:8px 0 12px}
.template-decoration-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-height:235px;overflow:auto;overscroll-behavior:contain;padding:3px 4px 4px 1px}
.template-decoration-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid var(--line);background:#fff8fc;border-radius:9px;padding:5px 3px;min-width:0;min-height:70px;gap:3px}
.template-decoration-tile.active{border:2px solid var(--accent);background:var(--accent-pale);padding:4px 2px}
.template-decoration-tile canvas{width:40px;height:40px;display:block;background:#ede5f2;border-radius:6px}
.template-decoration-tile>span{font-size:9px;line-height:1.25;text-align:center;overflow-wrap:anywhere}
.template-decoration-tile small{position:absolute;right:4px;top:3px;font-size:8px;color:var(--muted)}
.template-decoration-list>.control-note{grid-column:1/-1}
.template-decoration-delete{margin-top:12px;border:1px solid var(--accent);border-radius:20px;color:var(--accent-dark);background:#fff8fc;padding:8px 12px;min-height:40px;width:100%;font-size:11px}
@media(max-width:720px){.template-decoration-list{grid-template-columns:repeat(5,minmax(0,1fr));max-height:180px}.template-decoration-tile{min-height:68px}.template-decoration-heading button,.template-decoration-delete{min-height:44px}.template-decoration-editor{margin-top:18px}.template-decoration-tile>span{font-size:9px}}
@media(max-width:380px){.template-decoration-list{grid-template-columns:repeat(4,minmax(0,1fr))}}