@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;600;700&family=Cinzel:wght@400;600&family=Poppins:wght@400;500;600&display=swap');

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#100914;--panel:#211426;--panel2:#2c1b30;--text:#fff4fa;--muted:#bca8bc;--accent:#ff78bd;--accent2:#a45cff;--line:#ffffff20;--glow:#f14ba16b}
*{box-sizing:border-box}html{min-height:100%;scroll-behavior:smooth}body{margin:0;font-family:'DM Sans',sans-serif;background:radial-gradient(ellipse at 50% -20%,#57264c 0%,transparent 53%),var(--bg);color:var(--text);min-height:100vh}button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.custom-background{display:none;position:fixed;inset:0;z-index:0;background-image:var(--custom-background,none);background-size:cover;background-position:center;background-repeat:no-repeat;pointer-events:none}.custom-background.has-image{display:block}.custom-background:after{content:"";position:absolute;inset:0;background:rgba(8,5,14,.76);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.background-controls{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:22px}.background-upload{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:12px;padding:11px 15px;background:#ffffff12;color:var(--text);font-size:13px;font-weight:600;cursor:pointer}.background-upload input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}.background-upload:focus-within{outline:2px solid var(--accent);outline-offset:3px}.background-reset{border:1px solid var(--line);border-radius:12px;padding:11px 15px;background:#ffffff08;color:var(--text);font-size:13px}.glitter-field{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:3}.glitter{position:absolute;top:-24px;left:var(--x);width:var(--size);height:var(--size);opacity:0;background:var(--color);border-radius:50%;box-shadow:0 0 5px 1px var(--color),0 0 15px 3px var(--color);animation:glitter-fall var(--duration) linear var(--delay) infinite,glitter-twinkle var(--twinkle) ease-in-out var(--delay) infinite alternate}.glitter.star{border-radius:0;clip-path:polygon(50% 0%,60% 37%,100% 50%,60% 63%,50% 100%,40% 63%,0% 50%,40% 37%);filter:drop-shadow(0 0 5px var(--color))}.glitter.star:after{content:"";position:absolute;inset:0;background:var(--color)}@keyframes glitter-fall{0%{transform:translate3d(0,-30px,0) rotate(0deg);opacity:0}8%{opacity:var(--opacity)}86%{opacity:var(--opacity)}100%{transform:translate3d(var(--drift),110vh,0) rotate(var(--rotation));opacity:0}}@keyframes glitter-twinkle{0%,100%{filter:brightness(.8)}50%{filter:brightness(1.8)}}.app{position:relative;z-index:1;max-width:1050px;margin:auto;padding:20px 22px 110px}.top{display:flex;align-items:center;justify-content:space-between;gap:15px}.brand{font-family:'Playfair Display',serif;font-size:23px;letter-spacing:2px}.brand span{color:var(--accent)}.mp-gem{display:inline-block;width:15px;height:15px;vertical-align:-2px;margin-right:4px;fill:none;stroke:url(#mp-gem-gradient);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.chip{border:1px solid var(--line);background:#ffffff0b;border-radius:100px;padding:9px 14px;color:var(--muted);font-size:12px}.hero{text-align:center;padding:70px 0 32px;position:relative}.eyebrow{text-transform:uppercase;letter-spacing:4px;color:var(--accent);font-size:11px;font-weight:700}.hero h1{font:600 clamp(56px,11vw,104px)/1 'Playfair Display',serif;margin:15px 0 12px;letter-spacing:2px;text-shadow:0 0 50px var(--glow)}.hero h1 span{color:var(--accent)}.hero p{color:var(--muted);line-height:1.7;max-width:520px;margin:0 auto 30px}.heart-stage{height:255px;display:grid;place-items:center;position:relative}.orbit{position:absolute;width:220px;height:220px;border:1px solid #ff8dca45;border-radius:50%;box-shadow:0 0 75px var(--glow),inset 0 0 65px #e95ba02c;animation:breathe 4s ease-in-out infinite}.orbit:after{content:'';position:absolute;inset:18px;border:1px dashed #ffb1db3b;border-radius:50%;animation:spin 40s linear infinite}.locket{border:0;background:linear-gradient(145deg,#ffacd6,#d75aaf 50%,#8e3b94);width:142px;height:142px;clip-path:path('M 71 130 C 52 113 7 80 7 47 C 7 6 54 2 71 30 C 88 2 135 6 135 47 C 135 80 90 113 71 130 Z');display:grid;place-items:center;color:#fff;filter:drop-shadow(0 10px 25px #f04a9c);position:relative;transition:transform .3s}.locket:hover{transform:scale(1.08)}.locket svg{width:46px;height:46px;filter:drop-shadow(0 2px 4px #702553)}@keyframes breathe{50%{transform:scale(1.08);opacity:.65}}@keyframes spin{to{transform:rotate(360deg)}}.btn{border:0;border-radius:14px;padding:15px 23px;background:linear-gradient(115deg,var(--accent),var(--accent2));color:#160b19;font-weight:700;box-shadow:0 10px 30px var(--glow)}.btn.secondary{background:#ffffff0c;color:var(--text);box-shadow:none;border:1px solid var(--line)}.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.section{margin:50px 0 0}.section h2{font:500 31px 'Playfair Display',serif;margin:0 0 10px}.section>p{color:var(--muted);line-height:1.6;margin:0 0 22px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tile{background:linear-gradient(145deg,#ffffff10,#ffffff04);border:1px solid var(--line);border-radius:20px;padding:24px;min-height:174px}.tile .symbol{font-size:29px;margin-bottom:20px}.tile h3{margin:0 0 9px;font-size:17px}.tile p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}.preview{margin-top:40px;display:none}.preview.active{display:block}.preview-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.tabs{display:flex;gap:7px;flex-wrap:wrap;margin:22px 0}.tab{border:1px solid var(--line);background:#ffffff08;color:var(--muted);border-radius:100px;padding:11px 17px}.tab.active{background:var(--accent);color:#1d1021;border-color:transparent;font-weight:700}.screen{border:1px solid #ffb7e031;background:linear-gradient(150deg,#ffffff0c,#ffffff04);border-radius:26px;min-height:280px;padding:28px}.screen h3{font:500 29px 'Playfair Display',serif;margin:0 0 12px}.screen p{color:var(--muted);line-height:1.7}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.memory{border-radius:16px;padding:20px;background:linear-gradient(140deg,#ad438644,#552b6c55);border:1px solid var(--line);min-height:130px}.memory b{display:block;margin:10px 0}.memory small{color:var(--muted)}.envelope{margin:24px auto;max-width:250px;height:150px;border-radius:10px;background:linear-gradient(145deg,#ff9cc8,#bc4c94);display:grid;place-items:center;font-size:56px;box-shadow:0 14px 45px var(--glow)}.theme-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.swatch{width:56px;height:56px;border:3px solid transparent;border-radius:16px}.swatch[aria-pressed=true]{border-color:white;outline:2px solid var(--accent);outline-offset:2px}.swatch.pink{background:linear-gradient(135deg,#ff80c1,#5c226a)}.swatch.purple{background:linear-gradient(135deg,#ad7bff,#351a5b)}.swatch.gold{background:linear-gradient(135deg,#d7b575,#2b1a18)}.swatch.blue{background:linear-gradient(135deg,#72dcf2,#193b65)}.footer{text-align:center;color:var(--muted);font-size:12px;padding:65px 0 0}.modal{position:fixed;inset:0;background:#07030acb;display:none;align-items:center;justify-content:center;padding:20px;z-index:10;backdrop-filter:blur(12px)}.modal.active{display:flex}.dialog{width:min(100%,450px);background:linear-gradient(145deg,#35203a,#1a1020);border:1px solid #ff9bd044;border-radius:24px;padding:30px;box-shadow:0 30px 100px #000a;position:relative;text-align:center}.dialog h2{font:500 34px 'Playfair Display',serif;margin:8px 0}.dialog p{color:var(--muted);line-height:1.6}.close{position:absolute;right:15px;top:12px;background:none;color:var(--text);border:0;font-size:28px}.note{font-size:12px;color:var(--muted);line-height:1.6;margin-top:16px}.pill{display:inline-block;border:1px solid #ffb4d64d;border-radius:100px;padding:8px 13px;font-size:12px;color:var(--accent)}.empty{border:1px dashed #ffffff40;border-radius:15px;padding:25px;color:var(--muted);line-height:1.7}.small{font-size:12px!important}.hidden{display:none!important}
body[data-theme=purple]{--bg:#100b20;--panel:#241637;--accent:#c18bff;--accent2:#7362e9;--glow:#9e62ed65}body[data-theme=gold]{--bg:#17100f;--panel:#2c201b;--accent:#e8bd78;--accent2:#bb795b;--glow:#cf96535c}body[data-theme=blue]{--bg:#071622;--panel:#132e3b;--accent:#82dff0;--accent2:#6394f3;--glow:#3fa7dc55}
@media(max-width:650px){.app{padding:18px 16px 90px}.hero{padding-top:52px}.grid{grid-template-columns:1fr}.tile{min-height:auto}.two{grid-template-columns:1fr}.screen{padding:22px}.hero h1{font-size:clamp(52px,14vw,75px)}.brand{font-size:19px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}

.auth-panel{max-width:470px;margin:24px auto 0;text-align:left;background:linear-gradient(145deg,#ffffff13,#ffffff06);border:1px solid #ffb5df35;border-radius:24px;padding:25px;backdrop-filter:blur(16px)}.auth-panel h2{font:500 29px 'Playfair Display',serif;margin:0 0 14px}.field{display:block;margin:13px 0;color:var(--muted);font-size:13px}.field input,.field textarea{display:block;width:100%;margin-top:7px;background:#140e1bc9;border:1px solid #ffffff3a;border-radius:12px;color:var(--text);padding:13px;resize:vertical}.field textarea{min-height:110px}.status{min-height:20px;color:#ffd0e7;font-size:13px;line-height:1.5}.status.error{color:#ffb7b7}.switch{border:0;background:none;color:var(--accent);padding:12px 0}.dashboard{max-width:800px;margin:20px auto}.dashboard-top{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}.stack{display:grid;gap:12px}.entry{border:1px solid var(--line);border-radius:16px;padding:16px;background:#ffffff09;overflow-wrap:anywhere}.entry p{white-space:pre-wrap;margin:9px 0}.entry small{color:var(--muted)}.controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.controls .btn{padding:12px 16px}.list-button{width:100%;text-align:left;border:1px solid var(--line);background:#ffffff0a;border-radius:16px;padding:18px;color:var(--text)}.list-button strong{display:block;font-size:18px}.list-button small{color:var(--muted)}.pulse-button{font-size:36px;border:1px solid #ff9cce77;background:linear-gradient(140deg,#ff85c4,#a963ed);border-radius:50%;width:90px;height:90px;box-shadow:0 0 45px #ff69b76a;color:white;animation:breathe 3s infinite}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:20px 0}.muted{color:var(--muted)}.notice{padding:14px;border:1px solid #ff8dc35a;background:#ff87c016;border-radius:13px}.hidden{display:none!important}

.photo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-top:18px}.photo-card{background:#ffffff0a;border:1px solid var(--line);border-radius:16px;padding:10px}.photo-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:11px}.photo-card p{overflow-wrap:anywhere;font-size:13px}.photo-card button{margin-top:8px}.notice a{color:var(--accent)}.notice .btn{display:inline-block;text-decoration:none;margin-top:8px}.photo-grid .muted{grid-column:1/-1}


:root { --personal-font:'DM Sans',sans-serif; --personal-size:17px; --personal-color:#fff4fa; --personal-gradient:linear-gradient(110deg,#fff4fa,#ff85cb); }
select { font:inherit; color:var(--text); background:#1c1324; border:1px solid #ffffff42; border-radius:12px; padding:13px; width:100%; }
button { transition:transform .2s ease,background-color .2s ease,border-color .2s ease; }
button:hover:not(:disabled) { transform:translateY(-2px); }
button:disabled { opacity:.58; cursor:not-allowed; }
button:focus-visible,select:focus-visible,a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
input[type=color] { min-height:46px; padding:5px; cursor:pointer; }
input[type=range] { accent-color:var(--accent); padding:0; min-height:36px; }
.custom-background { transition:opacity .4s; }
.custom-background.has-image:after { background:rgba(8,5,14,.56); backdrop-filter:none; -webkit-backdrop-filter:none; }
.dashboard #welcome { font:500 34px 'Playfair Display',serif; margin:6px 0 8px; }
.home-screen > .section-head { margin-bottom:20px; }
.home-action { margin-top:28px; padding-top:12px; border-top:1px solid var(--line); }
.home-action .btn { margin-top:5px; }
.locket-space { --personal-size:17px; --personal-font:'DM Sans',sans-serif; --personal-color:#fff4fa; --personal-gradient:linear-gradient(110deg,#fff4fa,#ff85cb); }
.locket-screen { position:relative; overflow:hidden; padding:clamp(21px,4vw,38px); background:linear-gradient(155deg,#ffffff13,#ffffff05 66%); }
.locket-intro { position:relative; text-align:center; padding:28px 15px 22px; min-height:155px; }
.locket-intro h3 { margin:14px 0; font-size:clamp(33px,5vw,53px); }
.locket-intro p { position:relative; z-index:1; font-family:var(--personal-font); font-size:var(--personal-size); color:var(--personal-color); }
.locket-intro .eyebrow { position:relative; z-index:1; }
.sticker-sky { position:absolute; inset:0; pointer-events:none; z-index:0; }
.sticker-sky span { position:absolute; font-size:clamp(23px,3vw,36px); opacity:.92; filter:drop-shadow(0 0 15px var(--glow)); }
.sticker-sky span:nth-child(1){top:3%;left:4%;transform:rotate(-12deg)}
.sticker-sky span:nth-child(2){top:10%;right:5%;transform:rotate(18deg)}
.sticker-sky span:nth-child(3){bottom:6%;left:12%;transform:rotate(8deg)}
.sticker-sky span:nth-child(4){bottom:8%;right:13%;transform:rotate(-18deg)}
.sticker-sky span:nth-child(5){top:48%;right:2%;transform:rotate(11deg)}
.locket-space .personal-heading, .locket-space .entry p, .type-preview { font-family:var(--personal-font); color:var(--personal-color); }
.locket-space .entry p { font-size:var(--personal-size); line-height:1.68; }
.locket-space .detail-banner .personal-heading { font-size:clamp(29px,5vw,calc(var(--personal-size) * 2.15)); }
.invite-panel { margin:20px 0; padding:18px; border:1px solid var(--line); border-radius:18px; background:#ffffff09; }
.locket-space .controls { justify-content:center; }
.love-panel { text-align:center; padding:40px 18px 32px; margin:28px 0 30px; border-radius:25px; background:radial-gradient(ellipse at 50% 20%,var(--glow),transparent 58%),linear-gradient(140deg,#ffffff09,#ffffff02); border:1px solid var(--line); }
.love-panel p { margin:10px auto 20px; max-width:500px; }
.love-panel .stack { text-align:left; max-width:560px; margin:auto; }
.section-label { margin:0 0 15px 3px; }
.experience-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.experience-card { min-height:187px; text-align:left; padding:25px; display:flex; flex-direction:column; align-items:flex-start; gap:9px; border:1px solid #ffb7df42; border-radius:22px; color:var(--text); background:linear-gradient(145deg,#ffe6f010,#9862db0a); box-shadow:inset 0 1px #ffffff0a; }
.experience-card:hover,.experience-card:focus-visible { background:linear-gradient(145deg,#ff8ccc20,#9575ed1a); border-color:var(--accent); }
.experience-card .experience-icon { font-size:32px; line-height:1; color:var(--accent); }
.experience-card strong { font:500 27px 'Playfair Display',serif; }
.experience-card span:not(.experience-icon):not(.card-arrow) { color:var(--muted); font-size:13px; }
.experience-card .card-arrow { color:var(--accent); font-size:12px; margin-top:auto; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.detail-panel { animation:detail-in .34s ease; }
@keyframes detail-in { from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)} }
.detail-back { padding:9px 0; margin:0 0 20px; border:0; background:none; color:var(--accent); font-weight:600; font-size:14px; }
.detail-banner { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; min-height:245px; padding:32px 20px; border:1px solid var(--line); border-radius:24px; background:radial-gradient(ellipse at 45% 12%,#ff81bd30,transparent 66%),linear-gradient(145deg,#6a376332,#25172d8a); text-align:center; }
.detail-banner .eyebrow,.detail-banner h3,.detail-banner p,.detail-symbol { position:relative; z-index:1; }
.detail-symbol { font-size:44px; color:var(--accent); text-shadow:0 0 35px var(--glow); margin:10px 0 2px; }
.detail-banner h3 { font:500 39px 'Playfair Display',serif; margin:8px 0 12px; }
.detail-banner p { margin:0; max-width:390px; color:var(--muted); line-height:1.6; }
.photo-banner { background:radial-gradient(ellipse at 50% -5%,#98d4eb30,transparent 63%),linear-gradient(140deg,#34536a3d,#26192b89); }
.letter-banner { background:radial-gradient(ellipse at 50% 0%,#eecf9b39,transparent 68%),linear-gradient(140deg,#5b3a5548,#2b1b3889); }
.theme-banner { background:radial-gradient(ellipse at 50% 0%,#c490ff3a,transparent 68%),linear-gradient(140deg,#3d3c7548,#291a4089); }
.editor-card { padding:22px; background:#ffffff09; border:1px solid var(--line); border-radius:22px; margin-top:22px; }
.editor-card .field textarea { min-height:145px; font-family:var(--personal-font); font-size:var(--personal-size); }
.editor-card .btn { margin-top:4px; }
.collection-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:34px 0 16px; }
.collection-heading h4 { margin:0; font:500 25px 'Playfair Display',serif; }
.collection-heading span { color:var(--accent); font-size:12px; }
.entry-collection .entry { background:linear-gradient(135deg,#fff4f70d,#8e5eb412); padding:22px; border-radius:20px; }
.entry-collection .entry small { font-size:12px; letter-spacing:.02em; }
.entry-collection .entry p { margin:15px 0 4px; white-space:pre-wrap; }
.entry-collection .entry.letter-entry { position:relative; border-top:2px solid var(--accent); }
.entry-collection .entry.letter-entry:before { content:'✉'; position:absolute; top:15px; right:19px; color:var(--accent); opacity:.65; }
.load-older { margin-top:16px; }
.usage-card { display:flex; align-items:center; gap:24px; justify-content:space-between; border:1px solid var(--line); border-radius:18px; padding:18px 22px; margin-top:20px; background:#ffffff0a; }
.usage-card strong { font-size:14px; }
.usage-card p { margin:4px 0 0; font-size:12px; color:var(--muted); }
.usage-track { width:min(35%,170px); flex-shrink:0; height:9px; background:#ffffff24; border-radius:99px; overflow:hidden; }
.usage-track span { display:block; height:100%; width:0%; border-radius:inherit; background:linear-gradient(90deg,var(--accent),var(--accent2)); transition:width .35s; }
.photo-grid { grid-template-columns:repeat(auto-fill,minmax(175px,1fr)); }
.photo-card { padding:11px; background:linear-gradient(150deg,#ffffff11,#ffffff04); }
.photo-card img { cursor:zoom-in; display:block; }
.photo-card .btn { padding:9px 13px; font-size:12px; }
.photo-card .photo-actions { display:flex; flex-wrap:wrap; gap:8px; }
.photo-card .photo-actions button { margin-top:6px; }
.customize-card { border:1px solid var(--line); background:linear-gradient(150deg,#ffffff0d,#ffffff05); border-radius:21px; margin-top:18px; padding:22px; }
.step-title { display:flex; gap:15px; align-items:flex-start; margin-bottom:16px; }
.step-title > span { flex:0 0 36px; height:36px; border-radius:12px; display:grid; place-items:center; background:#ffffff11; border:1px solid var(--line); color:var(--accent); font-size:12px; font-weight:700; }
.step-title h4 { font:500 24px 'Playfair Display',serif; margin:0 0 5px; }
.step-title p { margin:0; font-size:13px; color:var(--muted); }
.choice-row { display:flex; flex-wrap:wrap; gap:10px; }
.choice { border-radius:14px; border:1px solid var(--line); padding:13px 16px; background:#ffffff09; color:var(--text); font-weight:600; }
.choice[aria-pressed=true],.sticker-picker button[aria-pressed=true] { border-color:var(--accent); box-shadow:0 0 0 2px var(--glow); background:#ffffff19; }
.theme-row { gap:14px; }
.theme-row .swatch { width:calc(25% - 11px); min-width:100px; flex:1; height:90px; border-radius:18px; position:relative; overflow:hidden; display:flex; justify-content:center; align-items:flex-end; padding:9px; }
.swatch span { color:#fff; font-size:12px; text-shadow:0 2px 6px #0008; }
.theme-row .swatch[aria-pressed=true] { border-color:white; outline:2px solid var(--accent); }
.custom-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 17px; }
.type-preview { margin-top:14px; padding:24px; border-radius:16px; border:1px dashed #ffffff3e; font-size:var(--personal-size); line-height:1.6; text-align:center; overflow-wrap:anywhere; }
.sticker-picker { display:flex; flex-wrap:wrap; gap:9px; }
.sticker-picker button { width:57px; height:55px; font-size:27px; background:#ffffff0b; border:1px solid var(--line); border-radius:14px; }
.save-style { margin-top:16px; width:100%; }
.background-card .btn { margin:10px 8px 0 0; }
.background-card .field { max-width:510px; }
.photo-lightbox { position:fixed; inset:0; z-index:20; padding:24px; background:#06040be9; display:grid; place-items:center; backdrop-filter:blur(18px); }
.lightbox-inner { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; max-width:min(92vw,840px); position:relative; }
.lightbox-inner img { max-width:100%; max-height:70vh; object-fit:contain; border-radius:15px; box-shadow:0 25px 80px #0008; }
.lightbox-inner p { text-align:center; overflow-wrap:anywhere; }
.lightbox-inner a { text-decoration:none; }
.lightbox-close { position:absolute; top:-35px; right:0; background:none; border:0; color:white; font-size:24px; }
.glitter-field .effect-glyph { width:auto; height:auto; background:none; border-radius:0; box-shadow:none; font-size:var(--size); color:var(--color); text-shadow:0 0 13px var(--color); }
.glitter-field .effect-glyph::after { display:none; }
@media(max-width:650px) {
  .experience-grid{gap:10px}
  .experience-card{min-height:170px;padding:17px}
  .experience-card strong{font-size:23px}
  .detail-banner{min-height:218px;padding:24px 15px}
  .editor-card,.customize-card{padding:17px}
  .custom-grid{grid-template-columns:1fr}
  .theme-row .swatch{min-width:calc(50% - 8px)}
  .usage-card{align-items:flex-start;flex-direction:column;gap:12px}
  .usage-track{width:100%}
  .dashboard-top{margin-bottom:14px}
  .locket-screen{padding:17px}
}
@media(max-width:390px){.experience-grid{grid-template-columns:1fr}.experience-card{min-height:135px}}

.gradient-strip{height:13px;border-radius:999px;margin:13px 0 17px;border:1px solid #ffffff55;background:linear-gradient(90deg,#fff4fa,#ff85cb);box-shadow:inset 0 1px 4px #0004}
.type-preview{
  font-size:inherit;
  background:none;
  background-image:none;
  background-color:transparent;
  -webkit-background-clip:border-box;
  background-clip:border-box;
  -webkit-text-fill-color:initial;
}
.type-preview #stylePreview{
  display:inline;
  max-width:100%;
  font-family:var(--personal-font);
  font-size:var(--personal-size);
  color:var(--personal-color);
  background:none;
  background-color:transparent;
  -webkit-background-clip:border-box;
  background-clip:border-box;
  -webkit-text-fill-color:var(--personal-color);
}
body[data-text-mode="gradient"] .type-preview #stylePreview,
body[data-text-mode="gradient"] .locket-space .personal-heading,
body[data-text-mode="gradient"] .locket-space .entry p,
body[data-text-mode="gradient"] .locket-intro p{
  background:var(--personal-gradient);
  background-image:var(--personal-gradient);
  background-color:transparent;
  background-repeat:no-repeat;
  background-size:100% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
}
body[data-text-mode="gradient"] .locket-space .personal-heading{
  display:table;
  margin-left:auto;
  margin-right:auto;
}
body[data-text-mode="gradient"] .locket-space .entry p{
  display:inline-block;
  max-width:100%;
}
body[data-text-mode="gradient"] .locket-intro p{
  display:table;
  margin-left:auto;
  margin-right:auto;
}
.locket-screen>.sticker-sky,.sticker-preview{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:14px 20px;margin:0 0 18px;border:1px solid #ffb8dd42;border-radius:18px;background:linear-gradient(110deg,#ffb6de17,#af82ff14)}
.locket-screen>.sticker-sky span,.sticker-preview span{position:relative!important;top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;transform:none!important;display:inline-block;font-size:clamp(26px,4vw,39px);line-height:1.25}
.sticker-preview{margin:15px 0 3px}
.entry-actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin-top:14px}
.entry-actions .btn{font-size:12px;padding:9px 14px;box-shadow:none}
.entry-edit-form{border-top:1px solid var(--line);margin-top:16px;padding-top:12px}
.entry-edit-form textarea{display:block;width:100%;padding:12px;border:1px solid #ffffff48;background:#170e21;border-radius:12px;color:var(--text);resize:vertical;min-height:135px;line-height:1.5}
.entry-edit-form .field{margin:0}
.danger-action{border-color:#ff7b995e!important;color:#ffd4dc!important}
.photo-edit-form{padding:13px 9px 9px;margin-top:12px;border-top:1px solid #ffffff2b;background:#ffffff06;border-radius:13px}
.photo-edit-form .field{font-size:12px}
.photo-edit-form .field input{width:100%;min-width:0;padding:10px 9px}
.photo-edit-form .btn{font-size:12px!important;padding:9px 12px!important}
.photo-edit-form .status{overflow-wrap:anywhere}

.locket-screen>.sticker-sky{position:relative;inset:auto;pointer-events:none;z-index:1}