@font-face{font-family:HoloRound;src:local(SF Pro Rounded),local(PingFang SC);font-display:swap}:root{--rx:0deg;--ry:0deg;--tx:0;--ty:0;--px:50%;--py:50%;--spin:0deg;--axis-x:0;--axis-y:1;--shadow-x:0px;--shadow-y:24px;--glint-x:0px;--glint-y:0px;--avatar-shadow-x:0px;--avatar-shadow-y:9px;--foil-angle:70deg;--card-radius:clamp(22px, 7vw, 28px);--hot-a-x:0%;--hot-a-y:0%;--hot-b-x:0%;--hot-b-y:0%;--hot-c-x:0%;--hot-c-y:0%;--hot-d-x:0%;--hot-d-y:0%;--pos-a-x:0%;--pos-a-y:0%;--pos-b-x:0%;--pos-b-y:0%;--pos-c-x:0%;--pos-c-y:0%;--pos-d-x:0%;--pos-d-y:0%;--bg:#050609;--panel:#111318db;--panel-strong:#171a20;--ink:#f4eedf;--muted:#a29a88;--dim:#6f6a5f;--line:#f4eedf1f;--line-strong:#f4eedf33;--gold:#d8c58a;--mint:#8ee6cf;--rose:#e47c9e;--shadow-soft:0 30px 90px #0000007a;--ease-out-quint:cubic-bezier(.22, 1, .36, 1);--ease-out-expo:cubic-bezier(.16, 1, .3, 1);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:HoloRound,Avenir Next,Trebuchet MS,sans-serif}*{box-sizing:border-box}html,body{overscroll-behavior-x:none;width:100%;min-height:100%;overflow-x:hidden}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;touch-action:none;margin:0;overflow:hidden}button,input,textarea{font:inherit}button{appearance:none;cursor:pointer;border:0}.stage{--stage-pad-y:max(14px, env(safe-area-inset-top));--stage-pad-x:clamp(6px, .9vw, 12px);max-width:100vw;min-height:100svh;padding:var(--stage-pad-y) var(--stage-pad-x) max(14px, env(safe-area-inset-bottom));isolation:isolate;background:radial-gradient(at 18% 42%,#d8c58a1f,#0000 34%),radial-gradient(at 55% 62%,#8ee6cf14,#0000 38%),linear-gradient(120deg,#090a0f 0%,#050609 46%,#0d0f13 100%);grid-template-rows:minmax(0,1fr);display:grid;position:relative;overflow-x:clip}.stage:before{content:"";z-index:-1;pointer-events:none;opacity:.32;background-color:#0000;background-image:linear-gradient(90deg,#ffffff0a 1px,#0000 1px),linear-gradient(#ffffff09 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:44px 44px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:fixed;inset:0;-webkit-mask-image:linear-gradient(90deg,#0000,#000 14% 86%,#0000);mask-image:linear-gradient(90deg,#0000,#000 14% 86%,#0000)}.stage:after{content:"";z-index:-1;pointer-events:none;opacity:.18;background-image:radial-gradient(#f4eedf21 .65px,#0000 .75px);background-size:5px 5px;position:fixed;inset:0}.eyebrow,.panel-kicker{color:var(--gold);letter-spacing:.24em;text-transform:uppercase;margin:0 0 6px;font-size:.68rem;font-weight:850}h1,h2{letter-spacing:-.025em;margin:0;line-height:1.08}h1{white-space:nowrap;font-size:clamp(1.75rem,2.4vw,2.35rem)}h2{font-size:clamp(1.45rem,2.3vw,2rem)}.workspace{width:100%;min-height:0;height:calc(100svh - (var(--stage-pad-y) * 2));grid-template-columns:minmax(0,1fr) clamp(360px,31vw,430px);align-items:stretch;gap:clamp(10px,1.2vw,18px);margin:0 auto;display:grid}.workspace>*{min-width:0}.preview-panel{border:1px solid var(--line);min-width:0;min-height:0;box-shadow:var(--shadow-soft), inset 0 1px 0 #ffffff17;perspective:1100px;animation:rise .72s 80ms var(--ease-out-expo) both;background:linear-gradient(145deg,#ffffff14,#0000 42%),linear-gradient(#111319db,#08090deb);border-radius:34px;grid-template-rows:auto minmax(0,1fr) auto;place-items:center;gap:clamp(10px,1.8vh,16px);padding:clamp(14px,2vw,24px);display:grid;position:relative;overflow:hidden}.preview-meta{z-index:2;justify-content:flex-start;align-self:start;align-items:end;gap:clamp(16px,3vw,40px);width:100%;display:flex;position:relative}.preview-panel:before{content:"";opacity:.4;pointer-events:none;filter:blur(30px);background:radial-gradient(#f4eedf1f,#0000 60%);border-radius:999px;position:absolute;inset:8%}.preview-orbit{aspect-ratio:1;pointer-events:none;border:1px solid #f4eedf14;border-radius:999px;width:min(54vw,560px);position:absolute;transform:rotate(-18deg)scaleY(.58)}.preview-orbit:before,.preview-orbit:after{content:"";border-radius:inherit;border:1px solid #d8c58a1a;position:absolute;inset:11%}.preview-orbit:after{border-color:#8ee6cf17;inset:24%}.preview-shell{z-index:1;background:linear-gradient(160deg,#f4eedf14,#f4eedf04),#0000003d;border:1px solid #f4eedf1f;border-radius:34px;width:min(54vh,410px);max-width:min(42vw,455px);padding:clamp(8px,1.4vw,14px);position:relative;box-shadow:0 22px 60px #00000075,inset 0 1px #ffffff1a}.scene{aspect-ratio:300/420;touch-action:none;width:100%;transform-style:preserve-3d;perspective:1000px;place-items:stretch stretch;display:grid}.holo-card{border-radius:var(--card-radius);cursor:grab;isolation:isolate;-webkit-user-select:none;user-select:none;touch-action:none;width:100%;height:100%;transform-style:preserve-3d;transform:rotate3d(var(--axis-x), var(--axis-y), 0, var(--spin)) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .18s var(--ease-out-quint), filter .25s ease;filter:drop-shadow(var(--shadow-x) var(--shadow-y) 30px #00000094) drop-shadow(0 0 26px #8ee6cf1c);border:0;outline:none;position:relative}.holo-card.is-dragging{cursor:grabbing;transition:filter .16s}.card-face{border-radius:var(--card-radius);backface-visibility:hidden;clip-path:inset(0 round var(--card-radius));transform-style:preserve-3d;contain:layout paint;isolation:isolate;background:#bfc1bc;border:1.5px solid #0000003d;flex-direction:column;display:flex;position:absolute;inset:0;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}.card-front:after,.card-back:after{content:"";pointer-events:none;border-radius:inherit;mix-blend-mode:soft-light;position:absolute;inset:0;box-shadow:inset 0 1px #ffffffa6,inset 0 -16px 34px #0000002e,inset 0 0 0 1px #ffffff2e}.card-back{transform:rotateY(180deg)}.foil,.portrait-foil{border-radius:inherit;background:radial-gradient(circle at var(--px) var(--py), #ffffff38, transparent 34%), linear-gradient(135deg, #41423f, #bfc0b7 44%, #676965 70%, #e3dfcf);filter:saturate(1.05)contrast(1.03);position:absolute;inset:0;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}.foil{clip-path:inset(0 round var(--card-radius))}.portrait-foil{clip-path:inset(0 round 16px)}.shader-canvas{border-radius:inherit;width:100%;height:100%;display:block;position:absolute;inset:0}.foil:before,.portrait-foil:before{content:"";mix-blend-mode:screen;opacity:.52;transform:translate3d(var(--glint-x), var(--glint-y), 0) rotate(8deg);background:repeating-linear-gradient(104deg,#0000 0 9px,#ffffff0b 10px,#0000 12px),radial-gradient(circle at 34% 28%,#ffffff57,#0000 22%),radial-gradient(circle at 72% 76%,#ffffff3d,#0000 24%);position:absolute;inset:-10%}.foil:after,.portrait-foil:after{content:"";opacity:.24;mix-blend-mode:overlay;background-image:radial-gradient(circle at 20% 30%,#ffffff57 0 1px,#0000 1.6px),radial-gradient(circle at 75% 55%,#ffffff3d 0 1px,#0000 1.8px);background-size:13px 13px,17px 17px;position:absolute;inset:0}.text-scrim{pointer-events:none;background:linear-gradient(#ffffff94,#ffffff24 13%,#0000 22% 56%,#ffffff61 72%,#ffffffa3);position:absolute;inset:0}.parallax{will-change:transform;transform:translateZ(36px)}.card-row{z-index:2;color:#000000d6;justify-content:space-between;align-items:center;display:flex;position:relative}.card-top{letter-spacing:-.035em;padding:16px 18px 0;font-size:clamp(1rem,4.4vw,1.2rem)}.card-top span,.card-name span{opacity:.72;font-size:.82rem}.portrait-window{z-index:2;clip-path:inset(0 round 16px);height:55%;transform-style:preserve-3d;background:#0000003d;border-radius:16px;margin:14px 16px 0;position:relative;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}.portrait-foil{filter:blur(15px)saturate(1.32)contrast(1.05);transform:scale(1.12)}.portrait-vignette{background:radial-gradient(circle,#0000 20%,#0000009e 78%);position:absolute;inset:0}.avatar{object-fit:contain;z-index:2;width:84%;height:86%;filter:drop-shadow(var(--avatar-shadow-x) var(--avatar-shadow-y) 11px #0000006b);position:absolute;inset:8% 8% 6%}.card-name{padding:14px 18px 0;font-size:1.2rem}.card-copy{z-index:2;color:#000000b8;margin:6px 18px 0;font-size:.78rem;line-height:1.45;position:relative}.card-foot{color:#00000085;letter-spacing:.18em;margin-top:auto;padding:0 18px 16px;font-size:.66rem}.back-mark{z-index:2;color:#000c;place-items:center;gap:10px;margin:auto;display:grid;position:relative;transform:translateZ(42px)}.spark{opacity:.78;font-size:3.8rem;font-weight:100}.back-mark strong{letter-spacing:.16em;font-size:2.25rem}.back-mark em{letter-spacing:.24em;opacity:.64;font-size:.66rem;font-style:normal}.hint{z-index:1;min-height:1.4em;color:var(--muted);text-align:center;margin:0;font-size:.86rem;position:relative}.config-panel{scrollbar-width:thin;border:1px solid var(--line);background:linear-gradient(180deg, #ffffff13, transparent 22%), var(--panel);min-width:0;min-height:0;max-height:100%;box-shadow:var(--shadow-soft), inset 0 1px 0 #ffffff14;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);animation:enter .72s .12s var(--ease-out-expo) both;border-radius:30px;padding:clamp(16px,2vw,22px);overflow:auto}.config-panel::-webkit-scrollbar{width:8px}.config-panel::-webkit-scrollbar-thumb{background:#f4eedf2e;border-radius:999px}.panel-heading{border-bottom:1px solid var(--line);padding-bottom:16px}.panel-heading p:last-child{color:var(--muted);margin:10px 0 0;font-size:.9rem;line-height:1.6}.control-group{border-bottom:1px solid #f4eedf17;padding:16px 0}.control-group:last-child{border-bottom:0;padding-bottom:0}.group-title{justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:11px;display:flex}.group-title span{letter-spacing:-.035em;font-weight:850}.group-title small{color:var(--dim);font-size:.74rem}.action-row{flex-wrap:wrap;gap:8px;display:flex}.action-row button{color:var(--ink);border:1px solid var(--line);transition:transform .16s var(--ease-out-quint), background .16s ease, border-color .16s ease;background:#f4eedf17;border-radius:999px;padding:10px 13px}.action-row button[disabled]{cursor:not-allowed;opacity:.42;transform:none}.action-row button:hover,.action-row button:focus-visible{background:#d8c58a2b;border-color:#d8c58a57}button:hover,button:focus-visible{transform:translateY(-1px)}button:active{transform:translateY(1px)scale(.98)}.upload-tile{cursor:pointer;transition:background .18s ease, border-color .18s ease, transform .18s var(--ease-out-quint);background:#f4eedf0e;border:1px dashed #d8c58a47;border-radius:20px;grid-template-columns:58px 1fr;align-items:center;gap:12px;padding:10px;display:grid}.upload-tile:hover{background:#f4eedf14;border-color:#d8c58a7a;transform:translateY(-1px)}.upload-tile img{object-fit:cover;width:58px;height:58px;box-shadow:inset 0 0 0 1px var(--line);background:#191b20;border-radius:16px}.upload-tile span{gap:4px;display:grid}.upload-tile strong{color:var(--ink);letter-spacing:-.035em}.upload-tile em{color:var(--muted);font-size:.78rem;font-style:normal}label{color:var(--muted);gap:7px;font-size:.75rem;font-weight:800;display:grid}label+label,.field-grid+label,label+.field-grid{margin-top:11px}.field-grid{grid-template-columns:1fr 1fr;gap:9px;display:grid}.compact-grid{grid-template-columns:.82fr 1fr 1fr}input,textarea{border:1px solid var(--line);width:100%;color:var(--ink);resize:vertical;background:#0003;border-radius:14px;outline:none;padding:10px 11px;transition:border-color .16s,box-shadow .16s,background .16s}input:focus,textarea:focus{background:#00000052;border-color:#d8c58a8c;box-shadow:0 0 0 4px #d8c58a17}.export-group{padding-bottom:0}.export-copy,.export-status{color:var(--muted);margin:0;font-size:.78rem;line-height:1.55}.export-actions{margin-top:12px}.export-status{min-height:1.5em;color:var(--gold);margin-top:10px}.export-group.is-mobile-blocked .export-actions,.export-group.is-mobile-blocked .export-status{display:none}.export-group.is-mobile-blocked .export-copy{color:var(--ink);background:#d8c58a14;border:1px solid #d8c58a33;border-radius:18px;padding:14px 15px}.capture-stage{z-index:50;aspect-ratio:1;background:var(--capture-bg,#0f0);contain:layout paint style;place-items:center;width:min(92vw,94vh,1040px);display:none;position:fixed;top:50%;left:50%;overflow:hidden;translate:-50% -50%}.capture-stage.is-active{display:grid}.capture-card-slot{aspect-ratio:300/420;width:min(42vmin,430px);transform-style:preserve-3d;perspective:1000px;place-items:stretch stretch;display:grid}.capture-card-slot .scene{aspect-ratio:auto;width:100%;height:100%}.capture-stage.is-active .holo-card{transition:none!important}.capture-stage.is-png-export .holo-card{isolation:isolate;filter:none!important}.capture-stage.is-png-export .card-face{isolation:isolate}.stage.is-recording .preview-panel{border-color:#d8c58a61;box-shadow:0 30px 90px #0000007a,0 0 0 1px #d8c58a21,inset 0 1px #ffffff17}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@keyframes enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translate(0,0)}}@keyframes rise{0%{opacity:0;transform:translateY(18px)scale(.98)}to{opacity:1;transform:translate(0,0)scale(1)}}@media (width<=960px){body{touch-action:pan-y;overflow:hidden auto}.stage{min-height:100svh;overflow:visible}h1{white-space:normal}.workspace{grid-template-columns:1fr;width:100%;max-width:100%;height:auto}.preview-meta{align-items:start;display:grid}.preview-panel{width:100%;max-width:100%;min-height:min(680px,100svh - 156px)}.preview-shell{width:min(76vw,400px);max-width:none}.config-panel{max-height:none}}@media (width<=560px){.stage{padding-inline:12px}.preview-panel,.config-panel{border-radius:24px}.preview-shell{width:min(100vw - 64px,340px)}.field-grid,.compact-grid{grid-template-columns:1fr}}@media (height<=760px) and (width>=961px){.stage{padding-block:12px}h1{font-size:clamp(1.7rem,2.7vw,2.35rem)}.preview-shell{width:min(54vh,410px)}.control-group{padding-block:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
