@font-face{font-family:KiaraScript;src:url('/fonts/character/Allura-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
.character-hero-wrap{--cx:0;--cy:0;--progress:0;--light-x:55%;--light-y:35%;position:relative;height:138svh;min-height:790px;color:#f4eee4;background:#0b0d10;isolation:isolate;font-family:Inter,system-ui,sans-serif}
.character-scene{position:sticky;top:56px;height:calc(100svh - 56px);min-height:600px;max-height:1100px;overflow:clip;isolation:isolate;background:#171b1e;perspective:1200px}
.character-camera{position:absolute;inset:0;transform-style:preserve-3d;isolation:isolate;will-change:transform}
.character-glass,.character-glass-echo{position:absolute;inset:-8%;background:url('/character/hero/prismatic-glass.png') 52% 47%/100% 100%;will-change:transform;transform:translate3d(calc(var(--cx)*-30px),calc(var(--cy)*-17px),0) scale(1.05);filter:saturate(.85) brightness(.65)}
.character-glass:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0d161c44,transparent 50%,#01050844),linear-gradient(0deg,#0b0d10 0%,transparent 55%)}
.character-glass-echo{opacity:.12;background-position:65% 60%;mix-blend-mode:screen;transform:translate3d(calc(var(--cx)*35px),calc(var(--cy)*20px),0) scale(1.3);filter:saturate(.5) blur(4px);mask-image:linear-gradient(transparent,#000,transparent)}
.character-light{position:absolute;width:65%;height:80%;top:8%;border-radius:50%;filter:blur(70px);mix-blend-mode:screen;opacity:.27;pointer-events:none;animation:character-breathe 9s ease-in-out infinite alternate}
.character-light-cyan{right:-16%;background:radial-gradient(ellipse,#48dae077,transparent 68%)}
.character-light-gold{left:-20%;background:radial-gradient(ellipse,#efb87b8f,transparent 70%);animation-delay:-5s}
.character-cursor-light{position:absolute;inset:-10%;background:radial-gradient(ellipse 32% 46% at var(--light-x) var(--light-y),#d4faff55,#64d8e212 40%,transparent 70%);mix-blend-mode:screen;pointer-events:none}
.character-ribs{position:absolute;inset:-5%;opacity:.11;background:repeating-linear-gradient(90deg,transparent 0 18px,#e3feff44 19px,#0004 21px,transparent 23px);mix-blend-mode:overlay;transform:translate3d(calc(var(--cx)*10px),0,0)}
.character-lettering{position:absolute;left:6.5%;top:13%;width:66%;margin:0;z-index:2;font-family:KiaraScript,cursive;font-weight:400;line-height:.72;letter-spacing:-.04em;transform:translate3d(calc(var(--cx)*-13px),calc(var(--cy)*-9px + var(--progress)*-42px),28px) rotate(-7deg);filter:drop-shadow(0 16px 15px #07101555);pointer-events:none}
.character-lettering span{display:block;width:max-content;max-width:100%;padding:.12em .08em .1em;font-size:clamp(150px,20vw,340px);color:#e7dac3;text-shadow:1px 1px 0 #b5ac98,2px 2px 0 #9b9283,3px 3px 0 #726e65,4px 4px 0 #4d5757,5px 5px 0 #344244,6px 6px 0 #26373c,7px 7px 0 #182b32,10px 13px 9px #01101855;-webkit-text-stroke:.25px #fff7e5}
.character-lettering span+span{font-size:clamp(90px,12.7vw,213px);margin-top:-.12em;margin-left:.02em;color:#e6e8dd}
.character-person{position:absolute;z-index:4;left:69%;top:0;width:min(93vw,118svh);aspect-ratio:1;transform:translate3d(calc(-50% + var(--cx)*17px),calc(var(--cy)*10px + var(--progress)*-38px),65px) rotateY(calc(var(--cx)*3deg)) rotateX(calc(var(--cy)*-1.5deg)) scale(calc(1 + var(--progress)*.045));transform-origin:50% 32%;will-change:transform;isolation:isolate}
.character-portrait{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(calc(var(--cx)*-12px) 20px 16px #0007) drop-shadow(0 28px 45px #030a12a8)}
.character-aura{position:absolute;z-index:3;left:40%;top:12%;width:65%;height:82%;background:radial-gradient(ellipse at 50% 40%,#d7f8e81c,#94d4ed0d 30%,transparent 64%);filter:blur(24px);transform:translate3d(calc(var(--cx)*9px),calc(var(--cy)*9px),30px)}
.character-lens{position:absolute;z-index:2;overflow:hidden;pointer-events:none;mix-blend-mode:screen;mask-repeat:no-repeat;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;-webkit-mask-size:100% 100%;visibility:hidden;background:linear-gradient(125deg,#759aaf11,#97fbff22 40%,#e9c38a0a 65%,#fff0)}
.character-lens.is-calibrated{visibility:visible}
.character-lens video{width:100%;height:100%;object-fit:cover;display:none;opacity:.75;filter:saturate(.75) brightness(.8)}
.character-hero-wrap.has-intro .character-lens video{display:block}
.character-lens i{position:absolute;inset:-60%;background:linear-gradient(105deg,transparent 35%,#f0fcff33 46%,#fff6 49%,transparent 59%);transform:translateX(calc(var(--cx)*20%));animation:character-glint 8s ease-in-out infinite}
.character-glasses-trigger{position:absolute;z-index:5;left:35.5%;top:22%;width:25.5%;height:8%;min-height:30px;border:0;background:transparent;cursor:zoom-in;border-radius:24%;color:#f2fbff}
.character-glasses-trigger span{position:absolute;right:18%;top:43%;font-size:clamp(6px,.65vw,10px);text-shadow:0 0 10px #0009;transition:transform .25s}
.character-glasses-trigger:hover span{transform:scale(1.5)}
.character-glasses-trigger:focus-visible{outline:2px solid #cffaff;outline-offset:4px;background:#07182044}
.character-grain{position:absolute;z-index:7;inset:0;pointer-events:none;opacity:.075;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.character-fade{position:absolute;z-index:5;inset:0;pointer-events:none;background:linear-gradient(0deg,#0b0d10 0%,#0b0d10e3 4%,#0b0d1070 18%,transparent 46%,transparent 83%,#0b0d1025);box-shadow:inset 0 0 150px #060e1520}
.character-hero-meta{position:absolute;z-index:6;left:5%;right:5%;top:28px;display:flex;justify-content:space-between;align-items:center;font-size:9px;font-weight:500;letter-spacing:.18em;color:#ede7d6bf}
.character-hero-meta span:first-child{display:flex;gap:10px;align-items:center}
.character-hero-meta i{display:block;width:5px;height:5px;background:#d6eedc;border-radius:50%;box-shadow:0 0 14px #c2f6df9c}
.character-hero-bottom{position:absolute;z-index:6;left:6.5%;right:6.5%;bottom:65px;display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:26px}
.character-hero-bottom p{margin:0 0 24px;font-family:Georgia,serif;font-size:clamp(21px,2.1vw,31px);line-height:1.4;color:#f5eddf}
.character-hero-bottom em{font-weight:400;color:#c5c6b9}
.character-enter{display:flex;align-items:center;justify-content:space-between;gap:40px;max-width:270px;border-bottom:1px solid #e4f9f566;padding:14px 0;color:#f4eee2;font-size:12px;font-weight:500;text-decoration:none;grid-row:2;transition:color .2s}
.character-enter span{font-size:24px;transition:transform .25s}
.character-enter:hover{color:#a8f1ed}.character-enter:hover span{transform:translate(4px,4px)}
.character-scroll-note{justify-self:end;grid-column:2;grid-row:2;font-size:8px;letter-spacing:.18em;color:#b9bdb8;display:flex;align-items:center;gap:16px}
.character-scroll-note i{width:1px;height:36px;background:linear-gradient(#e7e9dd,transparent)}
.character-motion-toggle{position:absolute;z-index:8;right:3%;bottom:24px;display:flex;gap:7px;align-items:center;background:#0b111933;border:1px solid #c6e9e327;color:#c8d7d3;border-radius:30px;padding:8px 11px;cursor:pointer;font-size:10px;backdrop-filter:blur(10px)}
.character-motion-toggle b{font-weight:400;font-size:9px}.character-motion-toggle[aria-pressed=true]{color:#9ca6a5}
.character-hero-wrap.is-paused .character-light,.character-hero-wrap.is-paused .character-lens i{animation-play-state:paused}
.character-intro{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;color:#f4eee4;overflow:hidden}
.character-intro::backdrop{background:transparent}
.character-hero-wrap.is-intro-open .character-hero-bottom,.character-hero-wrap.is-intro-open .character-hero-meta,.character-hero-wrap.is-intro-open .character-motion-toggle,.character-hero-wrap.is-intro-open .character-fade{opacity:0;pointer-events:none}
.character-intro-surface{position:absolute;inset:0;background:radial-gradient(ellipse at 60% 35%,#204047,#0a0d12 65%);opacity:0;display:grid;place-items:center}
.character-intro header{position:absolute;z-index:2;top:25px;left:4%;right:4%;display:flex;align-items:center;justify-content:space-between;gap:20px;font:500 11px Inter,system-ui,sans-serif;letter-spacing:.08em}
.character-intro header button{border:1px solid #b5d8d850;background:#0e181e88;border-radius:40px;padding:12px 18px;color:inherit;cursor:pointer;font:inherit}
.character-intro header button span{margin-left:20px;font-size:20px}
.character-intro-video{width:100%;height:100%;object-fit:contain}
.character-intro-pending{text-align:center;padding:40px 24px;max-width:620px}
.character-intro-star{font-size:45px;color:#a0d3ce;display:block;margin-bottom:24px}
.character-intro-pending h2{font-family:KiaraScript,cursive;font-size:clamp(65px,10vw,120px);line-height:1;margin:0 0 18px;font-weight:400}
.character-intro-pending p{color:#b9c9c9;font:400 14px/1.6 Inter,system-ui,sans-serif}
.character-intro-pending button{margin-top:32px;background:transparent;color:#d7eee9;border:0;border-bottom:1px solid #d7eee966;padding:12px 0;cursor:pointer;font:500 12px Inter,sans-serif}
.character-intro-pending button span{margin-left:40px;font-size:20px}
.character-intro-status{position:absolute;bottom:90px;left:20px;right:20px;color:#ded3c5;text-align:center;font-size:13px}
[data-tool=character]:has(.character-hero-wrap){background:#0b0d10}
#character-create{scroll-margin-top:80px;position:relative;padding-top:30px;background:radial-gradient(ellipse 70% 280px at 80% 5%,#1d474729,transparent),radial-gradient(ellipse 60% 300px at 5% 2%,#5844351e,transparent),#0b0d10}
#character-create:before{content:'';position:absolute;left:5%;right:5%;top:0;height:1px;background:linear-gradient(90deg,transparent,#b8e6df45,#e6ceaa22,transparent)}
#character-create #kc{max-width:1320px;padding:40px 42px 100px}
#character-create .character-recipe{margin-top:34px;order:2;background:linear-gradient(135deg,#719d9710,#bc936b05);border-color:#a6c8c41b;border-radius:12px;padding:20px 24px}
#character-create .character-recipe-dot{background:#a0cfc1;box-shadow:0 0 12px #90d3c533}
#character-create .character-recipe-tag{color:#c0d7d0;border-color:#c0d7d026;font-size:9px}
#character-create .character-recipe-facts{color:#9ab5b0}
#character-create .kc-head{margin-bottom:36px}
#character-create .kc-head .suite-headline{font-size:clamp(40px,5vw,72px)}
#character-create .kc-head .suite-headline em{background:none;color:#c5e5d3;-webkit-text-fill-color:#c5e5d3}
#character-create .kc-head .suite-eyebrow{color:#a8c0b9}
#character-create .kc-sub{font-size:13px;line-height:1.8;color:#97a4a8;max-width:57ch}
#character-create .kc-chooser{gap:20px}
#character-create .kc-choice{min-height:410px;padding:236px 25px 25px;border-radius:14px;background:#11171b;border-color:#8dadb326;gap:12px;box-shadow:0 14px 35px #0002;transition:transform .4s,border-color .4s,box-shadow .4s}
#character-create .kc-choice:hover{transform:translateY(-7px);border-color:#bde9da80;box-shadow:0 22px 50px #0004}
#character-create .kc-choice-media{inset:0;z-index:-1;opacity:1}
#character-create .kc-choice-media img,#character-create .kc-choice-media video{top:0;right:0;width:100%;height:270px;object-fit:cover;object-position:center 25%;filter:saturate(.65) brightness(.85);opacity:.88;transform:scale(1);transition:filter .6s,transform .8s}
#character-create .kc-choice.has-media:hover .kc-choice-media img,#character-create .kc-choice.has-media:hover .kc-choice-media video{filter:saturate(.85) brightness(.97);opacity:1;transform:scale(1.025)}
#character-create .kc-choice-media:after{background:linear-gradient(0deg,#11171b 30%,#11171bdb 42%,#11171b00 73%,#11171b15),linear-gradient(90deg,#05121733,transparent);inset:0}
#character-create .kc-choice-mark{position:absolute;top:20px;left:22px;background:#0b171c70;backdrop-filter:blur(12px);border:1px solid #deffff22;border-radius:50%;width:40px;height:40px;display:grid;place-items:center}
#character-create .kc-choice-mark svg{width:18px;height:18px}
#character-create .kc-choice-rec{top:27px;right:20px;color:#e4ece1;border-color:#e4ece133;background:#16262966;font-size:8px}
#character-create .kc-choice-h{font-family:'Instrument Serif',Georgia,serif;font-size:33px;line-height:1.05;font-weight:400;letter-spacing:-.015em;color:#e9ede3;background:none;-webkit-text-fill-color:#e9ede3}
#character-create .kc-choice-p{color:#a7b4b7;font-size:12px;line-height:1.65;max-width:26ch}
#character-create .kc-choice-tags{gap:5px;flex-wrap:wrap}
#character-create .kc-tag{background:#adcecc09;border-color:#adcecc20;color:#a9c5c0;font-size:8px}
#character-create .kc-tag.good{color:#c3daca;background:#9ed3c60a;border-color:#c5f2df22}
#character-create .kc-choice-go{color:#c6e0d8;bottom:27px;right:23px}
#character-create .kc-pathback{color:#a2bfb9}
#character-create .kc-presets{margin-top:30px}
#character-create .kc-preset{border-color:#badcd425}
#character-create .kc-preset:hover,#character-create .kc-preset.on{border-color:#b4ddcd88}
#character-create .km-photo{background:linear-gradient(135deg,#143438,#111a21)}
#character-create .kc-form,#character-create .kc-card{border-color:#b8ddd320;background:linear-gradient(140deg,#131b21,#101519)}
#character-create .sw.on{background:#9fcbc317;border-color:#b4e2d969;color:#def5eb}
#character-create .kc-input,#character-create textarea{background:#0b1116;border-color:#a2c5c42b}
#character-create .kc-drop{background:#afded308;border-color:#8dbab340}
.character-workbench-head{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-bottom:20px;margin-bottom:30px;border-bottom:1px solid #accac51a;font-family:Inter,system-ui,sans-serif}
.character-workbench-head>span{font-size:9px;letter-spacing:.18em;color:#a9c4bf}
.character-workbench-head small{font-size:10px;color:#738a8a}
.character-workbench-head small i{display:inline-block;width:5px;height:5px;margin-right:7px;border-radius:50%;background:#a4c5b5}
.character-workbench-footer{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:50px;padding-top:25px;border-top:1px solid #accac51a;color:#6d8585;font:400 10px/1.6 Inter,sans-serif}
.character-workbench-footer span:first-child{color:#a6bcb7}
@keyframes character-breathe{to{transform:translate3d(6%,5%,0) scale(1.14);opacity:.45}}
@keyframes character-glint{0%,25%,100%{opacity:.2}50%,65%{opacity:.7}}
@media(max-width:1100px) and (min-width:761px){.character-lettering{top:11%;left:5%;width:75%}.character-lettering span{font-size:25vw}.character-lettering span+span{font-size:16vw}.character-person{left:65%;top:11%;width:min(112vw,115svh)}.character-hero-bottom{bottom:60px}.character-hero-bottom p{max-width:14ch}}
@media(max-width:760px){.character-hero-wrap{height:124svh}.character-scene{min-height:640px;max-height:900px}.character-lettering{top:7%;left:6%;width:92%;transform:translate3d(calc(var(--cx)*-6px),calc(var(--cy)*-5px + var(--progress)*-20px),20px) rotate(-8deg)}.character-lettering span{font-size:40vw}.character-lettering span+span{font-size:25vw;margin-left:10%}.character-person{width:140vw;left:53%;top:21%;transform:translate3d(calc(-50% + var(--cx)*10px),calc(var(--cy)*7px + var(--progress)*-25px),40px) rotateY(calc(var(--cx)*2deg)) scale(calc(1 + var(--progress)*.045))}.character-glass{background-position:48% 47%;filter:saturate(.6) brightness(.62)}.character-aura{left:8%;width:95%;top:30%}.character-hero-meta{left:6%;right:6%;font-size:7px;top:20px}.character-hero-meta span:last-child{display:none}.character-hero-bottom{left:7%;right:7%;bottom:57px;gap:0}.character-hero-bottom p{font-size:20px;line-height:1.3;margin-bottom:15px;text-shadow:0 3px 15px #000}.character-enter{font-size:11px;max-width:220px;gap:25px;padding:11px 0}.character-scroll-note{font-size:6px;letter-spacing:.14em;gap:8px}.character-scroll-note i{height:25px}.character-motion-toggle{bottom:18px;right:6%}.character-fade{background:linear-gradient(0deg,#0b0d10 0%,#0b0d10d9 9%,#0b0d1088 22%,transparent 42%,transparent 90%,#0b0d1025)}#character-create #kc{padding:28px 20px 70px}#character-create .kc-chooser{grid-template-columns:1fr;gap:18px}#character-create .kc-choice{min-height:365px;padding-top:212px}#character-create .kc-choice-media img,#character-create .kc-choice-media video{height:255px;object-position:center 28%}#character-create .character-recipe{padding:20px 18px}#character-create .character-recipe-heading{flex-wrap:wrap}.character-workbench-head small{max-width:16ch;text-align:right;line-height:1.6}.character-intro header{left:6%;right:6%;font-size:9px}}
@media(max-width:760px){.character-lettering span{font-size:36vw}.character-lettering span+span{font-size:20.8vw;margin-left:0}.character-person{width:134vw;left:50%;top:31%}}
@media(min-width:761px) and (max-width:1100px) and (max-aspect-ratio:5/4){.character-lettering{top:6%;left:4%;width:92%;transform:translate3d(calc(var(--cx)*-8px),calc(var(--cy)*-6px + var(--progress)*-26px),24px) rotate(-5deg)}.character-lettering span{font-size:24vw;margin-left:auto;margin-right:auto}.character-lettering span+span{font-size:14vw;margin-top:-.12em;margin-left:auto}.character-person{left:50%;top:39%;width:101vw}.character-aura{left:12%;width:85%;top:30%}.character-hero-wrap{height:126svh}}
@media(max-width:380px){.character-scroll-note{display:none}.character-hero-bottom{grid-template-columns:1fr}.character-hero-bottom p{font-size:18px}}
@media(prefers-reduced-motion:reduce){.character-light,.character-lens i{animation:none!important}.character-person,.character-camera,.character-glass{will-change:auto}.character-hero-wrap{--cx:0!important;--cy:0!important;--progress:0!important}#character-create .kc-choice,#character-create .kc-choice-media img,#character-create .kc-choice-media video{transition:none!important}#character-create .kc-choice:hover{transform:none}}
