@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;650;700;750&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--paper:#f6f5ed;--ink:#282329;--pink:#efb5cf;--lime:#d5f76b;--line:#dcdad1;--muted:#78757a}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px 'DM Sans',Arial,sans-serif}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{color:inherit}button{cursor:pointer}button{transition:transform .17s,background .17s,box-shadow .17s}button:hover{transform:translateY(-2px)}button:active{transform:translateY(0)}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #6a55df;outline-offset:4px}button:disabled{opacity:.28;cursor:default;transform:none}a{text-decoration:none}.topbar{max-width:1440px;margin:auto;padding:24px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;gap:10px;align-items:center;font-family:'Space Grotesk',Arial,sans-serif;font-size:19px;font-weight:700;letter-spacing:-.8px}.brand-light{font-weight:400;margin-left:2px}.brand small{display:block;font-size:9px;letter-spacing:2.2px;margin-top:3px}.brand-icon{font:bold 42px Arial;background:var(--lime);border:1.5px solid var(--ink);width:43px;height:43px;border-radius:13px 13px 13px 4px;position:relative;text-align:center;line-height:40px}.brand-icon span{position:absolute;font-size:22px;right:-6px;top:-10px}nav{display:flex;align-items:center;gap:30px}.status{font-size:9px;letter-spacing:1.3px;display:flex;align-items:center;gap:8px}.status i,.preview-top i{width:6px;height:6px;background:#8cae42;border-radius:50%;display:inline-block}.plain{border:0;background:none;display:flex;gap:8px;align-items:center;font-size:12px}.plain>span{font-size:21px}.plain b{background:#e8e6dd;border-radius:50%;padding:3px 6px;font-size:10px}.studio-link{font-size:11px;padding-left:25px;border-left:1px solid var(--line)}main{max-width:1220px;margin:auto;padding:47px 34px 0}.intro{display:flex;align-items:center;justify-content:space-between;padding:0 5px 34px}.eyebrow{font-size:9px;letter-spacing:1.5px;font-weight:700;margin:0 0 17px}.eyebrow>span{color:#9b5b88;font-size:15px;margin-right:7px}h1{font-family:'Space Grotesk',Arial,sans-serif;font-size:61px;line-height:1.08;letter-spacing:-4px;margin:0;font-weight:700;position:relative;display:flex;gap:18px;align-items:center}.handwritten{font-family:Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-3px;background:linear-gradient(transparent 65%,#efb5cf 65%,#efb5cf 93%,transparent 93%);transform:rotate(-3deg);padding:0 7px}.heading-star{font-size:55px;font-weight:400;margin-left:10px}.subtitle{color:#777078;font-size:12px;margin:20px 0 0}.intro-note{font-family:Georgia,serif;font-style:italic;text-align:center;font-size:17px;line-height:1.4;transform:rotate(7deg);margin-right:24px;position:relative}.intro-note b{font-weight:400}.intro-note svg{width:90px;height:45px;position:absolute;bottom:-35px;left:12px;transform:rotate(20deg);fill:none;stroke:var(--ink);stroke-width:1.5;stroke-linecap:round}.editor{display:grid;grid-template-columns:42% 58%;border:1.5px solid var(--ink);border-radius:18px;overflow:hidden;box-shadow:0 5px 0 #2823290b}.preview-panel{background:#eeede4;padding:22px 29px 20px;border-right:1.5px solid var(--ink);position:relative}.preview-top{display:flex;align-items:center;justify-content:space-between;font-size:8px;letter-spacing:1.3px}.preview-top>span:first-child{display:flex;align-items:center;gap:6px}.tiny{font-size:8px;letter-spacing:1px}.portrait-wrap{position:relative;margin:24px auto 19px;max-width:315px;padding:8px 9px 4px}.portrait-card{padding:10px 10px 0;background:#fffef9;box-shadow:2px 5px 0 #2823291f;border:1.5px solid var(--ink);transform:rotate(-3deg);border-radius:3px;transition:transform .25s}.portrait-card:hover{transform:rotate(-1deg)}.portrait{aspect-ratio:1;overflow:hidden;border:1px solid var(--ink);border-radius:2px}.portrait svg{display:block;width:100%;height:100%}.polaroid-caption{padding:13px 5px 12px;display:flex;justify-content:space-between;font-family:Georgia,serif;font-style:italic;font-size:16px}.polaroid-caption>span:last-child{font-size:23px;line-height:20px}.outside-spark{position:absolute;z-index:2;font-size:51px;font-family:Arial;pointer-events:none}.spark-a{top:10px;left:-18px;transform:rotate(-13deg)}.spark-b{bottom:32px;right:-17px;font-size:44px;color:#b486b0;-webkit-text-stroke:1px var(--ink)}.sticker{position:absolute;right:-21px;top:24px;background:var(--lime);border:1.5px solid var(--ink);border-radius:50%;width:70px;height:70px;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:10px;transform:rotate(14deg);box-shadow:2px 2px 0 #282329}.sticker b{font-size:15px}.preview-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;max-width:343px;margin:0 auto 19px}.secondary{background:transparent;border:1px solid #aaa59f;border-radius:8px;padding:10px 15px;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:9px}.secondary:hover{background:white}.history{display:flex;gap:6px}.history button{border:1px solid #bbb7b0;background:transparent;width:35px;height:34px;border-radius:8px;font-size:20px}.name-row{max-width:343px;margin:auto auto 12px;background:#f9f8f1;border:1px solid #d5d1c8;border-radius:8px;padding:7px 10px;display:flex;align-items:center;gap:9px}.name-row label{font-size:7px;letter-spacing:1px;white-space:nowrap;color:#777078}.name-row input{border:0;background:none;min-width:0;width:100%;padding:5px 0;font-size:12px;color:var(--ink)}.name-row button{border:0;background:none;font-size:23px;line-height:20px}.download-button{background:var(--ink);color:#f7f6ed;border:1px solid var(--ink);border-radius:8px;padding:15px 18px;width:100%;display:flex;align-items:center;justify-content:space-between;font-weight:600;font-size:12px;max-width:343px;margin:auto}.download-button>span{font-size:19px;line-height:10px;color:var(--lime)}.download-button:hover{background:#46384b;box-shadow:3px 3px 0 #b4bf94}.preview-footnote{text-align:center;font-size:9px;color:#8b8387;margin:11px 0 0}.customize-panel{background:#fcfbf5;display:flex;flex-direction:column;min-width:0;padding:27px 28px 0}.customize-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px}.step-label{font-size:8px;letter-spacing:1.7px;color:#8a8287}h2{font-family:'Space Grotesk',Arial,sans-serif;letter-spacing:-1px;font-size:26px;line-height:1.15;margin:8px 0 0}h2>span{color:#b48ca6;font-size:20px;margin-left:8px}.reset{border:none;background:none;font-size:10px;color:#7e747e}.tabs{display:flex;border-bottom:1px solid var(--line);gap:5px;flex-shrink:0}.tab{flex:1;min-width:0;background:none;border:0;border-bottom:2px solid transparent;display:flex;align-items:center;flex-direction:column;gap:8px;padding:6px 0 13px;font-size:9px;color:#837b83;border-radius:6px 6px 0 0}.tab svg{width:21px;height:21px}.tab.active{color:var(--ink);border-color:var(--ink);background:#efeddf}.options{padding:21px 0 22px;min-height:362px;flex:1}.section-label{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px;font-size:11px;font-weight:650}.section-label small{font-size:9px;color:#9a9199;font-weight:400}.filters{display:flex;gap:6px;margin-bottom:15px}.chip{padding:6px 13px;border:1px solid #ddd9d3;border-radius:20px;background:none;font-size:9px;color:#776f77}.chip.active{background:var(--ink);color:white;border-color:var(--ink)}.option-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.option-card{padding:0 0 7px;background:#f0eee7;border:1.5px solid transparent;border-radius:9px;position:relative;min-width:0;overflow:hidden}.option-card svg{display:block;width:100%;height:81px}.option-card span.label{display:block;font-size:8px;margin-top:2px;white-space:nowrap}.option-card:hover{background:#e9e4ee}.option-card.selected{border-color:var(--ink);background:#e9eddb}.option-card.selected:after{content:'✓';position:absolute;right:5px;top:5px;width:15px;height:15px;border-radius:50%;background:var(--ink);color:var(--lime);font-size:9px;line-height:15px}.color-section{margin-top:22px}.swatches{display:flex;gap:9px;flex-wrap:wrap}.swatch{background:var(--swatch);border-radius:50%;height:24px;width:24px;border:1px solid #2823292b;position:relative;padding:0}.swatch.selected:after{content:'';position:absolute;inset:-4px;border:1.5px solid var(--ink);border-radius:50%}.custom-color{width:24px;height:24px;border:1px solid #b8b2ba;border-radius:50%;padding:0;cursor:pointer;overflow:hidden;background:conic-gradient(#f88,#fa8,#ff8,#8d8,#8cf,#d9f,#f88)}.custom-color input{opacity:0;width:100%;height:100%;cursor:pointer;padding:0}.custom-color:focus-within{outline:2px solid #6a55df;outline-offset:3px}.editor-bottom{border-top:1px dashed #d8d1d7;padding:17px 0;display:flex;gap:9px;align-items:center;color:#a198a1}.editor-bottom>span:first-child{font-size:18px;color:#aa8aa2}.editor-bottom p{margin:0;font-size:10px}.editor-bottom .tiny{margin-left:auto;font-size:7px}.below{display:flex;align-items:center;gap:16px;padding:28px 7px 25px}.mini-faces{display:flex;padding-left:5px}.mini-faces svg{width:46px;height:46px;border:2px solid var(--paper);border-radius:50%;margin-left:-8px;background:#e8d3ec}.below p{font-size:11px;margin:0}.below p span{display:block;font-size:9px;color:#8a8288;margin-top:5px}.below-star{margin:auto 8px auto auto;font-size:37px;color:#8c817c}.format-tag{font-size:8px;letter-spacing:1.5px;line-height:1.8}footer{max-width:1152px;margin:auto;border-top:1px solid var(--line);padding:20px 7px 26px;display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#8c8389}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:13px 22px;border-radius:10px;font-size:12px;z-index:20;opacity:0;transition:.2s;pointer-events:none;max-width:90%;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}dialog{border:1.5px solid var(--ink);border-radius:18px;background:var(--paper);color:var(--ink);padding:27px;width:min(440px,92vw);max-height:90dvh;box-shadow:7px 7px 0 #28232955}dialog::backdrop{background:#29232e80;backdrop-filter:blur(5px)}.dialog-header{display:flex;align-items:center;justify-content:space-between}.dialog-header .eyebrow{margin:0;font-size:8px}.close{border:0;background:none;font-size:27px;line-height:20px}.export-preview{width:170px;height:170px;border:1px solid var(--ink);border-radius:12px;margin:23px auto;background:repeating-conic-gradient(#ddd 0% 25%,#fff 0% 50%) 0 0/15px 15px;overflow:hidden}.export-preview svg{width:100%;height:100%;display:block}.check{display:flex;gap:8px;align-items:center;justify-content:center;font-size:11px;margin:15px 0 20px}.check input{accent-color:var(--ink)}.full{width:100%;max-width:343px;margin:9px auto 0}.modal-note{font-size:10px;color:#827984;text-align:center;line-height:1.6;margin:16px 0 0}.saved-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:20px}.saved-look{position:relative;border:1px solid #b8adb8;border-radius:10px;padding:6px;background:#fefcf8}.saved-look>button:first-child{border:0;background:none;width:100%;padding:0;font-size:11px}.saved-look svg{width:100%;display:block;border-radius:6px}.saved-look span{display:block;padding:9px 0 5px}.delete-look{position:absolute;top:10px;right:10px;border:1px solid var(--ink);background:var(--paper);border-radius:50%;width:25px;height:25px}.empty-state{grid-column:1/-1;text-align:center;padding:35px 10px;font-size:13px;line-height:1.8}.toggle-row{display:flex;gap:8px;margin-top:17px;flex-wrap:wrap}.toggle{border:1px solid #d2cbd3;background:none;padding:8px 13px;border-radius:7px;font-size:10px}.toggle.active{background:var(--lime);border-color:var(--ink)}.subsection{margin-top:21px}.background-card{height:67px;border:1.5px solid transparent;border-radius:8px;background:var(--swatch);font-size:9px;position:relative;overflow:hidden}.background-card.selected{border-color:var(--ink);box-shadow:0 0 0 2px #d5f76b}.background-card span{background:#fffdf2dd;padding:3px 6px;border-radius:3px;position:relative;z-index:1}.accessory-grid .option-card svg{height:67px}.accessory-grid{grid-template-columns:repeat(4,1fr)}@media(min-width:1400px){main{padding-top:52px}.portrait-wrap{max-width:328px;margin-top:27px}.options{min-height:385px}.option-card svg{height:87px}}@media(max-width:900px){nav{gap:15px}.status{display:none}main{padding:35px 22px 0}h1{font-size:49px;letter-spacing:-3px;gap:10px}.handwritten{letter-spacing:-2px}.intro-note{font-size:14px;margin-right:8px}.heading-star{font-size:39px}.editor{grid-template-columns:43% 57%}.preview-panel{padding:20px}.customize-panel{padding:24px 19px 0}.tiny{font-size:6px}.portrait-wrap{padding:8px;max-width:280px}.sticker{right:-14px;width:55px;height:55px;font-size:8px}.sticker b{font-size:12px}.option-card svg{height:68px}.editor-bottom .tiny{display:none}.swatches{gap:9px}.swatch{width:22px;height:22px}footer{margin:0 22px}}@media(max-width:650px){.topbar{padding:18px 20px}.brand{font-size:16px}.brand-icon{width:37px;height:37px;font-size:36px;line-height:36px}.brand small{font-size:7px;letter-spacing:1.7px}.studio-link{display:none}.plain{font-size:11px}.intro{padding-bottom:26px}.intro-note{display:none}main{padding:29px 15px 0}.eyebrow{font-size:7px;letter-spacing:1.1px;margin-bottom:13px}h1{font-size:43px;gap:8px;letter-spacing:-2.8px}.heading-star{font-size:32px;margin-left:2px}.subtitle{font-size:11px;max-width:280px;line-height:1.6;margin-top:15px}.editor{display:flex;flex-direction:column;border-radius:14px}.preview-panel{padding:17px 22px;border-right:0;border-bottom:1.5px solid var(--ink)}.preview-top{font-size:7px}.preview-top .tiny{font-size:6px}.portrait-wrap{max-width:250px;margin:13px auto 18px;padding:6px}.polaroid-caption{padding:10px 5px;font-size:14px}.sticker{right:-25px;top:28px}.spark-a{left:-30px}.spark-b{right:-28px}.preview-actions{margin-bottom:12px;max-width:343px}.name-row{margin-bottom:9px}.download-button{padding:13px 15px}.preview-footnote{margin-top:9px;font-size:8px}.customize-panel{padding:23px 19px 0}.customize-top{margin-bottom:19px}h2{font-size:25px}.options{min-height:350px;padding-top:19px}.option-card svg{height:83px}.tab{font-size:9px;padding-bottom:12px}.below{gap:10px;padding:25px 4px}.below p{font-size:10px}.below p span{font-size:8px;max-width:180px;line-height:1.5}.mini-faces svg{width:36px;height:36px}.below-star{font-size:28px;margin-right:0}.format-tag{display:none}footer{font-size:8px;margin:0 19px;padding:17px 0;gap:15px}footer>span:nth-child(2){display:none}.editor-bottom{padding:15px 0}.swatch{height:25px;width:25px}.color-section{margin-top:23px}}@media(prefers-reduced-motion:no-preference){.heading-star{animation:turn 30s linear infinite}.outside-spark{animation:float 5s ease-in-out infinite}.spark-b{animation-delay:-2s}.portrait-card{animation:arrive .6s ease both}.customize-panel{animation:arrive .6s .1s ease both}@keyframes turn{to{transform:rotate(360deg)}}@keyframes float{50%{translate:0 -7px}}@keyframes arrive{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}}
/* The Portrait Room: warm paper, ink and quiet movement. */

:root{--paper:#f4eddf;--ink:#3c342c;--pink:#c3ab91;--lime:#d4c4a1;--line:#d6c9b6;--muted:#827568}body{background:var(--paper);color:var(--ink)}body:after{content:'';position:fixed;inset:0;opacity:.035;pointer-events:none;z-index:30;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.76' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.75' filter='url(%23grain)'/%3E%3C/svg%3E")}.brand{letter-spacing:.5px;font-family:Georgia,serif;font-size:18px}.brand-light{font-size:13px;letter-spacing:2px;margin-left:5px}.brand small{font:7px 'DM Sans',Arial,sans-serif;letter-spacing:2px;margin-top:5px}.brand-icon{font-family:Georgia,serif;font-style:italic;font-weight:400;background:none;border-radius:50%;border-color:#8e795f;line-height:40px;color:#71543d}.brand-icon span{display:none}.status{color:#827568;font-size:8px}.status i,.preview-top i{background:#738069}.plain b{background:#e4d8c6}.eyebrow{color:#8a6f51;font-weight:500;letter-spacing:2px}.eyebrow>span{color:#8a6f51}main{padding-top:45px}.intro{padding-bottom:37px}h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:77px;font-weight:400;letter-spacing:-3.5px;gap:14px}.handwritten{font-family:inherit;font-size:1.03em;background:none;letter-spacing:-3px;transform:none;padding:0;color:#93644c}.heading-star{color:#8b7655;font-size:45px;line-height:1;margin-left:5px}.subtitle{font-size:12px;color:#8d7e6d;margin-top:15px}.intro-note{color:#897358;font-size:15px;transform:rotate(-6deg);margin-right:15px}.intro-note svg{stroke:#ad9270;transform:rotate(10deg)}.editor{border-color:#b6a187;border-radius:5px;box-shadow:0 7px 25px #5a3f2510}.preview-panel{background:#e7ddca;border-color:#b6a187;padding-top:23px}.preview-top{color:#8f7b61}.preview-top .tiny{color:#ad977b}.portrait-wrap{max-width:320px;margin-top:25px}.portrait-card{background:#faf5e9;border:1px solid #9c8569;padding:12px 12px 0;border-radius:0;box-shadow:3px 6px 13px #5c472524;transform:rotate(-2deg)}.portrait-card:before{content:'';position:absolute;inset:-6px;border:1px solid #f8f3e470;pointer-events:none}.portrait-card:hover{transform:rotate(0)}.portrait{border:1px solid #b4a185;border-radius:100px 100px 0 0;background:#d9cdb5}.polaroid-caption{color:#8b735b;font-family:'Cormorant Garamond',Georgia,serif;font-size:21px;padding-top:13px;padding-bottom:12px}.polaroid-caption>span:last-child{color:#b59a79;font-size:21px}.outside-spark{color:#9b815f!important;-webkit-text-stroke:0;font-size:45px;font-family:Georgia,serif}.spark-a{top:32px;left:-24px;transform:rotate(-40deg)}.spark-b{bottom:52px;right:-25px;font-size:45px;transform:rotate(130deg)}.sticker{background:#e2d5b8;color:#8d7050;border:3px double #a98c65;border-radius:50%;box-shadow:none;width:70px;height:70px;font-size:7px;letter-spacing:1.5px;right:-20px;top:28px;transform:rotate(9deg)}.sticker b{font-family:'Cormorant Garamond',Georgia,serif;font-size:20px;letter-spacing:0;font-weight:500;margin:2px 0}.sticker small{font-size:6px;letter-spacing:1px}.secondary{border-color:#b8a78e;border-radius:3px;color:#75614b}.secondary:hover{background:#f5eddf}.history button{border-color:#c2b298;border-radius:3px;color:#8c745b}.name-row{background:#f1e8d9;border-color:#cbb99e;border-radius:3px}.name-row input{color:#6f5945}.name-row label{color:#9b8266}.name-row button{color:#9a7d5c}.download-button{background:#626a53;border-color:#626a53;border-radius:3px;color:#fcf7eb;letter-spacing:.3px;font-weight:500}.download-button>span{color:#e1d5b6}.download-button:hover{background:#535d45;box-shadow:2px 3px 0 #b3a485}.preview-footnote{color:#a18c71}.customize-panel{background:#f9f4e9}.step-label{color:#a18b6e;font-size:7px;letter-spacing:2px}h2{font-family:'Cormorant Garamond',Georgia,serif;font-size:32px;font-weight:500;letter-spacing:-.8px;line-height:1.15}h2>span{color:#a58d68;font-size:21px}.customize-top{margin-bottom:18px}.reset{color:#988169}.portrait-presets{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:15px 0 19px;border-top:1px solid #e0d4c2}.preset-label{display:block;font-size:8px;letter-spacing:1.2px;color:#887153}.portrait-presets small{font-family:'Cormorant Garamond',Georgia,serif;font-size:14px;font-style:italic;display:block;color:#ab9577;margin-top:4px}.preset-buttons{display:flex;padding:3px;border:1px solid #cfc0a8;border-radius:3px;gap:3px}.preset-buttons button{border:0;padding:9px 18px;border-radius:1px;background:none;color:#8a765e;font-family:Georgia,serif;font-size:12px}.preset-buttons button[aria-pressed=true]{background:#736448;color:#fbf4e8;box-shadow:0 1px 3px #49361b20}.tabs{gap:6px;border-color:#dfd2bd}.tab{font-size:9px;color:#ad997e;border-radius:0;transition:background .25s,color .25s,border-color .25s}.tab.active{background:#e9e1d0;border-color:#8d785a;color:#65543e}.tab svg{stroke-width:1.2}.options{padding-top:21px}.section-label{font-weight:500;font-size:11px;color:#806c53}.section-label small{color:#af9b7e}.chip{border-color:#dbcdb8;color:#9b8465;border-radius:3px}.chip.active{background:#857253;border-color:#857253}.option-card{background:#ece5d7;border-radius:4px;border-width:1px}.option-card:hover{background:#dfd7c5}.option-card.selected{border-color:#96805d;background:#e1e0cd;box-shadow:inset 0 0 0 2px #f7f1e5}.option-card.selected:after{background:#7b785d;color:#f9f3e5}.option-card span.label{font-size:8px;color:#8b785e}.swatch{border:2px solid #faf5e9;box-shadow:0 0 0 1px #d3c4ad}.swatch.selected:after{border-color:#8b7658;inset:-5px}.custom-color{filter:saturate(.5)}.toggle{border-color:#d9c9b0;border-radius:3px;color:#927b5c;background:#f6eee0}.toggle.active{background:#dbdfc8;border-color:#a2a17b;color:#66704d}.background-card{border-radius:3px}.background-card span{background:#f7efdecd;color:#8f7659}.background-card.selected{border-color:#8d7657;box-shadow:0 0 0 2px #d2c2a2}.editor-bottom{border-color:#dbccb6;color:#a48e71;padding:18px 0}.editor-bottom>span:first-child{color:#9d8766}.editor-bottom .tiny{font-size:6px}.below{padding-top:28px;padding-bottom:28px}.mini-faces svg{border-color:var(--paper);background:#d7cbb5}.below p{color:#8e775b}.below p b{font-weight:500;color:#6d5c46}.below p span{color:#a48f74}.below-star{color:#aa916a;font-size:35px}.format-tag{color:#aa9271;font-size:7px}footer{color:#a28e74}.toast{background:#645c49;border-radius:3px}dialog{background:#f4eddf;border-color:#b9a17f;border-radius:5px;box-shadow:8px 10px 30px #42341d33}dialog::backdrop{background:#42382970}.export-preview{border-color:#b49e7e;border-radius:85px 85px 0 0}.check input{accent-color:#6c7455}.modal-note{color:#a38c6d}.saved-look{background:#f9f1e1;border-color:#d0bda0;border-radius:3px}.saved-look svg{border-radius:50% 50% 0 0}.delete-look{border-color:#b69a73;color:#8d7352}.close{color:#9c8465}.full{border-radius:3px}.preview-actions .secondary{font-size:10px}
@media(min-width:901px){.options>.option-grid{grid-template-columns:repeat(5,1fr)}.option-card svg{height:80px}.preview-panel{display:flex;flex-direction:column}.portrait-wrap{width:100%;margin-top:auto;margin-bottom:23px;padding-top:22px}.preview-top{margin-bottom:20px}.preview-actions{width:100%}.preview-footnote{margin-bottom:auto;padding-bottom:10px}.name-row{width:100%}.preview-top .tiny{font-size:6px}.preview-top{font-size:7px}.options{min-height:410px}}
@media(max-width:900px){h1{font-size:63px;gap:10px}.heading-star{font-size:34px}.portrait-presets{gap:8px}.preset-buttons button{padding:8px 12px}.portrait-presets small{font-size:12px}.preset-label{font-size:7px}.customize-panel{padding-left:18px;padding-right:18px}.intro-note{font-size:13px}.portrait-wrap{margin-top:28px}.sticker{right:-15px;width:59px;height:59px}.sticker b{font-size:17px}.sticker small{font-size:5px}h2{font-size:28px}.editor-bottom .tiny{display:none}}
@media(max-width:650px){main{padding-top:30px}h1{font-size:55px;letter-spacing:-2.7px;gap:9px}.handwritten{letter-spacing:-2.8px}.heading-star{font-size:30px;margin-left:0}.intro{padding-bottom:24px}.subtitle{font-size:11px;max-width:none;margin-top:12px}.brand{font-size:16px}.brand-light{font-size:10px;letter-spacing:1.2px}.brand small{font-size:6px;letter-spacing:1.5px}.brand-icon{font-size:33px;line-height:34px}.editor{border-radius:4px}.preview-panel{padding-top:19px;padding-bottom:18px}.portrait-wrap{max-width:255px;margin-top:14px;margin-bottom:17px}.sticker{right:-20px;width:61px;height:61px}.spark-a{left:-26px;top:26px}.spark-b{right:-27px;bottom:55px}.polaroid-caption{font-size:20px}.customize-top{margin-bottom:15px}h2{font-size:30px}.customize-panel{padding-top:22px}.portrait-presets{padding:14px 0 18px}.preset-label{font-size:7px}.portrait-presets small{font-size:13px}.preset-buttons button{padding:9px 17px;font-size:12px}.options{min-height:360px}.option-card svg{height:78px}.below{padding-top:24px;padding-bottom:24px}.below p{font-size:10px}.below-star{font-size:27px}.preview-footnote{font-size:8px}.intro .eyebrow{font-size:7px;letter-spacing:1.3px}.intro .eyebrow span{font-size:12px}.editor-bottom p{font-size:9px}}
@media(prefers-reduced-motion:no-preference){.heading-star{animation:quiet-turn 70s linear infinite}.outside-spark{animation:none}.portrait-card{animation:paper-arrive .8s cubic-bezier(.2,.7,.2,1) both}.portrait svg>.portrait-figure{transform-origin:200px 400px;animation:portrait-breathe 6s ease-in-out infinite}.portrait-eyes{transform-origin:200px 169px}.portrait .portrait-eyes{animation:portrait-blink 7.3s infinite}.options{animation:details-arrive .35s ease both}dialog[open]{animation:dialog-arrive .3s cubic-bezier(.2,.7,.2,1) both}.intro{animation:details-arrive .7s ease both}.below{animation:details-arrive .9s .2s ease both}@keyframes quiet-turn{to{transform:rotate(360deg)}}@keyframes portrait-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.5px)}}@keyframes portrait-blink{0%,44%,47%,81%,84%,100%{transform:scaleY(1)}45.5%,82.5%{transform:scaleY(.08)}}@keyframes paper-arrive{from{opacity:0;transform:translateY(12px) rotate(-4deg)}to{opacity:1;transform:translateY(0) rotate(-2deg)}}@keyframes details-arrive{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}@keyframes dialog-arrive{from{opacity:0;translate:0 16px;scale:.98}to{opacity:1;translate:0 0;scale:1}}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.motion-status{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding:9px 0 0;border-top:1px solid #cdbda344;color:#9a8263;font-size:8px;letter-spacing:.4px;gap:10px}.motion-status button{background:#f3ebdc80;border:1px solid #b9a483;border-radius:3px;font-size:8px;color:#806848;padding:5px 9px;white-space:nowrap}.motion-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.motion-card{display:flex;flex-direction:column;align-items:center;padding:18px 5px 13px;gap:8px;background:#eee7d8;border:1px solid #d6c7ae;border-radius:4px;color:#8b7353;min-width:0}.motion-card.selected{border-color:#8b805c;background:#e2e3d0;box-shadow:inset 0 0 0 2px #f5f0e3}.motion-card b{font-family:'Cormorant Garamond',Georgia,serif;font-size:17px;font-weight:500}.motion-card small{font-size:8px;color:#a28c6b;line-height:1.5;text-align:center}.motion-sample{display:flex;align-items:center;justify-content:center;width:47px;height:47px;border:1px solid #bda77e;border-radius:50%;font-family:Georgia,serif;font-size:33px;color:#a28659;background:#f8f0dd}.motion-note{font-size:10px;line-height:1.8;color:#a28b69;margin:24px 0 0;padding-top:16px;border-top:1px dashed #ddcfb8}.gif-progress{max-width:343px;margin:14px auto 4px;font-size:10px;color:#8c7654}.gif-progress progress{width:100%;height:6px;accent-color:#66704d;display:block;margin-bottom:8px}.gif-progress button{float:right;border:0;background:none;color:#8c7654;font-size:10px;text-decoration:underline}.gif-progress[hidden]{display:none}#portrait svg>.portrait-figure,#portrait .portrait-eyes{animation:none!important;transform-origin:unset!important}#exportPreview svg{display:block}.tabs{gap:3px}.tab{font-size:8px}.tab svg{width:20px;height:20px}#gifDownload{font-size:11px}#pngDownload>span{color:#8c7654}.export-preview{margin-top:19px;margin-bottom:18px}
@media(max-width:650px){.motion-status{margin-top:12px;font-size:8px}.motion-status button{font-size:8px}.portrait-wrap{margin-top:10px}.motion-grid{gap:8px}.motion-card{padding:14px 5px 12px}.motion-card b{font-size:15px}.motion-card small{font-size:7px}.tab{font-size:8px}.tab svg{width:19px;height:19px}.motion-sample{width:42px;height:42px}.tabs{gap:2px}}
@media(prefers-reduced-motion:no-preference){.sample-breathe{animation:sample-breathe 3s ease-in-out infinite}.sample-blink{animation:sample-blink 4s infinite}.sample-tilt{animation:sample-tilt 4s ease-in-out infinite}.sample-wink{animation:sample-tilt 3s ease-in-out infinite}.sample-float{animation:sample-float 3s ease-in-out infinite}@keyframes sample-breathe{50%{scale:1.07}}@keyframes sample-blink{0%,40%,48%,100%{scale:1 1}44%{scale:1 .6}}@keyframes sample-tilt{25%{rotate:8deg}75%{rotate:-8deg}}@keyframes sample-float{50%{translate:0 -5px}}}
/* After Hours: amber lamps, moss greens, worn wood and soft knits. */
:root{--paper:#1d241a;--ink:#e2d8bf;--pink:#ac976d;--lime:#a0a96b;--line:#414635;--muted:#9d9f86;--amber:#dab77a;--moss:#8a965e}html{background:#181e16}body{background:radial-gradient(ellipse at 9% 8%,#9b672a24,transparent 42%),radial-gradient(ellipse at 94% 27%,#53603833,transparent 38%),linear-gradient(145deg,#242b1d,#181e17 65%,#20271b);color:#e2d8bf;min-height:100vh}body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 17% 0%,#e8b36514,transparent 43%),radial-gradient(ellipse at 83% 0%,#dba96509,transparent 35%)}body:after{opacity:.055;mix-blend-mode:soft-light}.topbar,main,footer{position:relative}.topbar{border-color:#64624655;padding-top:23px;padding-bottom:23px;background:linear-gradient(#1a21173b,#1a211700)}.brand{color:#e7d6b5}.brand-icon{background:#727d4c18;border-color:#b1965e;color:#d5b67b;box-shadow:0 0 21px #d5a45412}.brand small{color:#9b9d7e}.brand-light{color:#baac8c}.status{color:#929c77;letter-spacing:1px}.status i,.preview-top i{background:#c6a369;box-shadow:0 0 8px #d4b16b66}.plain{color:#c0b493}.plain>span{color:#b7a169}.plain b{background:#414a31;color:#c3c89c}.studio-link{border-color:#595b3c;color:#a9a785}main{padding-top:46px}.intro{position:relative;padding-bottom:39px}.intro:before{content:'';position:absolute;right:13%;top:-48px;width:210px;height:240px;pointer-events:none;background:radial-gradient(ellipse at 50% 0,#e9b45d1a,transparent 68%);filter:blur(9px)}.eyebrow{color:#a7ac82;font-weight:400;font-size:8px;letter-spacing:1.8px}.eyebrow>span{color:#d7b16a}h1{font-size:69px;color:#e8dcc2;gap:15px;letter-spacing:-2.8px;text-shadow:0 0 35px #b0893d16}.handwritten{color:#c9ab71;letter-spacing:-2.7px}.heading-star{color:#859259;font-size:42px;text-shadow:0 0 25px #9caa6044}.subtitle{color:#a4a58c;font-size:12px}.intro-note{color:#9fa77e;font-size:14px}.intro-note svg{stroke:#a8a26e}.editor{border:1px solid #5d6545;border-radius:12px;box-shadow:0 20px 70px #0005,0 0 35px #c59b3f08;isolation:isolate}.preview-panel{background:radial-gradient(ellipse at 13% 0%,#cb914e26,transparent 58%),linear-gradient(155deg,#303825,#222c20 74%);border-color:#4b5539;padding-top:23px}.preview-top{color:#a4ad82}.preview-top .tiny{color:#818e64}.motion-status{color:#999f7a;border-color:#626a454d}.motion-status button{color:#b2b58d;background:#414a313b;border-color:#626d43;border-radius:20px;padding:5px 10px}.portrait-wrap{max-width:325px}.portrait-card{background:#cfc3a0;border-color:#9a8b5e;padding:12px 12px 0;box-shadow:3px 7px 20px #0a110a77,0 0 65px #d9a95b1c;border-radius:3px;transform:rotate(-2deg)}.portrait-card:before{border-color:#d3ba7940;inset:6px}.portrait{border-radius:75px 75px 2px 2px;border-color:#726f4b;background:#343b2a}.polaroid-caption{color:#5f6243;font-size:21px}.polaroid-caption>span:last-child{color:#8c8757}.outside-spark{color:#7e8a52!important;opacity:.8}.sticker{color:#d3bb7f;background:#35432b;border-color:#889654;box-shadow:1px 3px 12px #151d1170;letter-spacing:1px}.sticker b{color:#c4c997}.sticker small{color:#9daa73}.secondary{color:#c2b995;border-color:#69704c;border-radius:6px;background:#424a2d18}.secondary:hover{background:#515a383b}.history button{border-color:#616c45;color:#a9b27f;border-radius:6px;background:#424b2d22}.name-row{background:#1e281b8c;border-color:#4e5d37;border-radius:6px;box-shadow:inset 0 2px 7px #0b120d22}.name-row label{color:#83916a}.name-row input{color:#d1cfac}.name-row input::placeholder{color:#7c8966}.name-row button{color:#b4b982}.download-button{background:#a5a66c;border-color:#bdba7d;color:#252c1b;border-radius:6px;font-weight:650;box-shadow:0 3px 12px #111b1150}.download-button>span{color:#3f4c29}.download-button:hover{background:#bab87c;box-shadow:0 4px 21px #b4b36229}.preview-footnote{color:#818f68;font-size:9px}.customize-panel{background:radial-gradient(ellipse at 100% 0%,#b8954b0a,transparent 55%),#262e22}.step-label{color:#939c72}.customize-top h2{color:#d8cfae}.customize-top h2>span{color:#7e8d51}.reset{color:#9ea580}.portrait-presets{border-color:#47523a}.preset-label{color:#abae89}.portrait-presets small{color:#899777;font-size:14px}.preset-buttons{border-color:#5d6944;background:#1e281d66;border-radius:6px}.preset-buttons button{color:#9aa77e;border-radius:3px}.preset-buttons button[aria-pressed=true]{background:#707c4d;color:#e6dfbd;box-shadow:0 1px 7px #111b1144}.tabs{border-color:#45533a;gap:1px}.tab{font-size:8px;color:#899974;padding:7px 0 13px}.tab svg{width:19px;height:19px;stroke-width:1.3}.tab.active{background:#424c32;color:#ddd3a5;border-color:#bdad6b;border-radius:5px 5px 0 0}.tab:hover{color:#e2d6ab;background:#38442e}.section-label{color:#b9c09a;font-weight:400}.section-label small{color:#7e8e6d}.chip{color:#97a47c;border-color:#566443;border-radius:20px}.chip.active{background:#6e7d4d;border-color:#83935e;color:#e0ddbc}.option-card{background:#333d2d;border-color:#45523a;border-radius:7px}.option-card:hover{background:#424f34;border-color:#728052}.option-card.selected{background:#4f5d3d;border-color:#b5af72;box-shadow:inset 0 0 0 2px #576547}.option-card span.label{color:#b9bf98;font-size:8px}.option-card.selected:after{background:#bcc08a;color:#344227}.swatch{border:2px solid #303b29;box-shadow:0 0 0 1px #68714e}.swatch.selected:after{border-color:#b6af70}.custom-color{filter:saturate(.6) brightness(.8);border-color:#879566}.toggle{color:#a4b18b;border-color:#576947;background:#303d28;border-radius:5px}.toggle.active{background:#687952;border-color:#929c69;color:#e3dfbb}.background-card{border-color:#4f5f3c;border-radius:6px}.background-card span{background:#26301edc;color:#c2c69b;font-size:8px}.background-card.selected{border-color:#a9ad71;box-shadow:0 0 0 2px #7d895438}.motion-card{background:#323e2b;border-color:#4d5f3e;border-radius:7px;color:#b9bf96}.motion-card.selected{background:#4b5b39;border-color:#9da769;box-shadow:inset 0 0 0 2px #566541}.motion-card small{color:#8c9e79}.motion-sample{background:#273421;border-color:#728354;color:#b7b67e;box-shadow:0 0 17px #a1ab4d0a}.motion-note{color:#8f9f79;border-color:#4f603e}.editor-bottom{border-color:#4a5a3a;color:#7e9168}.editor-bottom>span:first-child{color:#8e9d62}.editor-bottom .tiny{color:#7e8c61}.below p{color:#9da983}.below p b{color:#c7cba2}.below p span{color:#7f926e}.mini-faces svg{border-color:#1f291b;background:#34402c}.below-star{color:#96a05c}.format-tag{color:#849568}footer{border-color:#445337;color:#80906c}footer a{color:#99a779}.toast{background:#566845;color:#e2e1bb;border:1px solid #899b62;border-radius:8px;box-shadow:0 7px 30px #09120955}dialog{background:radial-gradient(ellipse at top left,#9b76371c,transparent 50%),#263321;color:#d9d7b4;border-color:#7e8e59;border-radius:12px;box-shadow:0 20px 80px #07100699}dialog::backdrop{background:#0b120cc2;backdrop-filter:blur(7px)}dialog h2{color:#ded7b8}.close{color:#a3b07b}.dialog-header .eyebrow{color:#929f70}.export-preview{border-color:#879961;border-radius:65px 65px 3px 3px}.check{color:#b2bf95}.check input{accent-color:#9da968}.modal-note{color:#8c9f78}.gif-progress,.gif-progress button{color:#afbb89}.gif-progress progress{accent-color:#abb572}#pngDownload>span{color:#abb486}.saved-look{background:#34452b;border-color:#687e4b;border-radius:6px}.saved-look>button:first-child{color:#c8d0a3}.saved-look svg{border-radius:60px 60px 2px 2px}.delete-look{background:#283820;border-color:#849c5a;color:#c7cf99}.empty-state{color:#a6b78d}.options>.beanie-grid{grid-template-columns:repeat(4,1fr)}.beanie-grid .option-card svg{height:111px}.beanie-grid .option-card{padding-bottom:11px}.beanie-grid .option-card span.label{font-size:9px}.name-row input:focus-visible{outline-color:#bac58a;outline-offset:1px}
@media(max-width:1050px) and (min-width:651px){h1{font-size:56px;gap:10px;letter-spacing:-2.7px}.heading-star{font-size:31px}.intro-note{font-size:12px;margin-right:0}.subtitle{font-size:11px}.tab{font-size:7px}.tab svg{width:17px;height:17px}.beanie-grid .option-card svg{height:80px}.beanie-grid .option-card span.label{font-size:7px}.editor-bottom p{font-size:8px}.status{font-size:7px}.preview-footnote{font-size:8px}}
@media(max-width:650px){.topbar{padding:19px 20px}.brand-light{font-size:10px}.brand small{font-size:6px;letter-spacing:1.4px}main{padding-top:31px}.intro{padding:0 7px 30px}.intro:before{right:-15px;top:-30px;width:260px;height:260px;opacity:.7}h1{display:block;position:relative;font-size:65px;line-height:.94;letter-spacing:-2.7px;max-width:330px}.handwritten{display:block;font-size:1.05em;line-height:1.07;margin-top:1px;padding:0;letter-spacing:-2.7px}.heading-star{position:absolute;right:11px;top:26px;font-size:32px}.intro .eyebrow{font-size:6px;letter-spacing:1.3px;margin-bottom:21px}.subtitle{font-size:10px;line-height:1.6;margin-top:18px;max-width:300px}.editor{border-radius:10px}.preview-panel{padding:19px 23px 20px}.preview-top{font-size:7px}.preview-top .tiny{font-size:6px}.portrait-wrap{max-width:252px;margin:13px auto 19px}.portrait{border-radius:65px 65px 2px 2px}.customize-panel{padding:23px 17px 0}.customize-top h2{font-size:30px}.step-label{font-size:6px;letter-spacing:1.7px}.portrait-presets{padding-top:15px;padding-bottom:20px}.tabs{gap:0}.tab{font-size:7px;gap:8px;padding-top:8px;padding-bottom:12px}.tab svg{width:17px;height:17px}.options{padding-top:22px;min-height:355px}.options>.beanie-grid{grid-template-columns:repeat(2,1fr);gap:11px}.beanie-grid .option-card svg{height:113px}.beanie-grid .option-card span.label{font-size:9px}.beanie-grid .option-card{padding-bottom:10px}.beanie-grid~.color-section{margin-top:25px}.editor-bottom p{font-size:8px}.below{padding:26px 5px}.below p{font-size:9px}.below p span{font-size:8px;max-width:175px}.below-star{font-size:27px}footer{font-size:8px}}
@media(prefers-reduced-motion:no-preference){body:before{animation:room-glow 18s ease-in-out infinite alternate}.preview-top i{animation:lamp-glow 6s ease-in-out infinite}.heading-star{animation:quiet-turn 90s linear infinite}@keyframes room-glow{from{opacity:.65}to{opacity:1}}@keyframes lamp-glow{0%,100%{box-shadow:0 0 8px #d4b16b55}50%{box-shadow:0 0 12px #d4b16b88}}}
@media(max-width:650px){.intro .heading-star{top:87px;right:4px;font-size:25px}}
@media(max-width:360px){h1{font-size:56px}.intro .heading-star{top:75px;right:2px;font-size:22px}.intro .eyebrow{font-size:5.5px;letter-spacing:1px}}
