/* Approved four-step setup: illustrated choices, no fictitious video preview. */
.faceless-setup .flow-main{position:relative;max-width:540px;padding:22px 18px max(24px,env(safe-area-inset-bottom));box-sizing:border-box}
.faceless-setup .flow-header{justify-content:center;height:32px;margin:0 0 25px}.faceless-setup .flow-header a{display:none}.faceless-setup .flow-header b{font-size:21px;letter-spacing:-.7px;font-weight:500}
.faceless-setup #back{position:absolute;top:15px;left:10px;width:44px;height:44px;padding:0;margin:0;border:0;background:none;font-size:34px;line-height:1}
.faceless-setup #screen{display:flex;flex-direction:column;gap:18px;min-height:calc(100dvh - 110px)}
.faceless-setup #screen h1{font-size:clamp(24px,6.5vw,31px);font-weight:550;letter-spacing:-.8px;line-height:1.15;margin:0 0 9px}
.faceless-setup .intro{font-size:13px;line-height:1.5;margin:0;color:#a7a3b4}
.setup-steps{display:flex;justify-content:space-between;padding:2px 13px 10px;position:relative;margin-bottom:2px}.setup-steps:before{content:'';position:absolute;left:25px;right:25px;top:6px;height:1px;background:#ffffff19}.setup-steps span{font-size:10px;position:relative;padding-top:21px;color:#747183;min-width:32px;text-align:center}.setup-steps span:before{content:'';position:absolute;top:0;left:calc(50% - 4px);width:7px;height:7px;background:#11121a;border:1px solid #615c73;border-radius:50%}.setup-steps .reached{color:#cac4db}.setup-steps .reached:before{background:#a58cde;border-color:#c7b4f5}.setup-steps [aria-current]:before{box-shadow:0 0 0 4px #ae90f017,0 0 14px #aa87e988}
.faceless-setup .setup-options{display:flex;flex-direction:column;gap:14px;min-width:0}
.faceless-setup .visual-rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;overflow:visible;mask-image:none;-webkit-mask-image:none;padding:1px;scroll-snap-type:none}
.faceless-setup .visual-card{width:100%;max-width:none;min-width:0;border-radius:19px;background:linear-gradient(145deg,#ffffff08,#ffffff02),#101118;box-shadow:inset 0 1px 0 #ffffff09;transition:border-color .22s,background .22s,box-shadow .22s}
.faceless-setup .visual-card.chosen{border-color:#b79ce8a6;box-shadow:inset 0 0 22px #a582e416,0 0 0 1px #b79ce81c}
.faceless-setup .visual-select{padding:0 0 13px!important;min-height:0!important;overflow:hidden}
.faceless-setup .visual-select strong{font-size:14px;line-height:1.25;margin:11px 12px 0;font-weight:500;overflow-wrap:anywhere}
.faceless-setup .card-caption{font-size:10px;margin:5px 12px 0;color:#938da5;line-height:1.4}
.faceless-setup .visual-rail.visual .card-caption{display:none}
.faceless-setup .card-art{height:auto;aspect-ratio:1.13;background:radial-gradient(at 50% 40%,#44314e44,transparent 80%),#11121a;position:relative;font-size:26px}
.faceless-setup .card-art img{object-fit:cover;transition:transform .5s}.faceless-setup .chosen .card-art>img{transform:scale(1.035)}
.faceless-setup .card-art img[src*="sketch-v1"]{object-fit:contain;padding:7px;box-sizing:border-box}
.faceless-setup .card-info{width:28px;height:28px;min-height:28px!important;top:8px;right:8px;font-size:12px;z-index:2;background:#1818249e!important;border-color:#ffffff22!important}
.faceless-setup .visual-rail>.personal-create-style{align-self:stretch;width:100%;height:100%;min-height:145px;margin:0;padding:14px!important;border:1px solid #ffffff20;border-radius:19px;font-size:13px;color:#cec5e0;background:radial-gradient(ellipse at 55% 35%,#9771d926,transparent 70%),#11121a;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px}
.faceless-setup .personal-create-style:before{content:'◇';font-size:65px;line-height:1;color:#baa1ec;text-shadow:5px 3px 0 #7a65a236;transform:rotate(-12deg)}
.faceless-setup .personal-style-menu{width:28px;height:28px;top:8px;right:8px}.faceless-setup .personal-style-art{aspect-ratio:1.13}.faceless-setup .personal-style-art img{object-fit:contain}
.faceless-setup .visual-rail.style{grid-template-columns:1fr;gap:13px}.faceless-setup .style .visual-select{position:relative;min-height:163px!important;padding:18px!important}.faceless-setup .style .visual-select strong{position:relative;z-index:1;margin:0;font-size:18px}.faceless-setup .style .card-caption{position:relative;z-index:1;margin:7px 0 0;font-size:12px;max-width:47%}
.faceless-setup .style .card-art{position:absolute;inset:0;aspect-ratio:auto;height:100%;background:radial-gradient(at 85% 50%,#8970c52b,transparent 80%);display:block;overflow:hidden;pointer-events:none}
.faceless-setup .style .card-art img{position:absolute;width:32%;height:77%;object-fit:cover;border:1px solid #e4d6ff42;border-radius:9px;top:27%;left:39%;transform:rotate(-13deg);box-shadow:0 8px 18px #0008}.faceless-setup .style .card-art img:nth-child(2){left:59%;top:18%;transform:rotate(-7deg)}.faceless-setup .style .card-art img:nth-child(3){left:80%;top:9%;transform:rotate(3deg)}
.faceless-setup .style .chosen .card-art img{animation:rhythm-drift 5s ease-in-out infinite}.faceless-setup .style .chosen .card-art[data-family=dynamic] img{animation-duration:2.4s}.faceless-setup .style .chosen .card-art img:nth-child(2){animation-delay:-.6s}.faceless-setup .style .chosen .card-art img:nth-child(3){animation-delay:-1.2s}
.faceless-setup .type .card-art{font-size:27px;min-height:120px;aspect-ratio:1.25;transform:none;padding:10px;box-sizing:border-box;letter-spacing:-1px}.faceless-setup .type .chosen .card-art{animation:type-reveal 3.5s ease-in-out infinite}.faceless-setup .type .card-caption{display:none}.faceless-setup .setup-font{order:2;border-radius:17px;font-size:14px;text-align:left;padding:16px;margin:0;background:#ffffff05;border:1px solid #ffffff17}
.faceless-setup .setup-background h2{font-size:13px;font-weight:500;margin:3px 0 8px}.faceless-setup .setup-background[hidden]{display:none}.faceless-setup .background-rail{padding:0 0 10px;gap:9px;overflow-y:hidden;mask-image:linear-gradient(90deg,#000 calc(100% - 20px),transparent);-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 20px),transparent)}
.faceless-setup .background-card{flex:0 0 86px;min-width:86px}.faceless-setup .background-card>button:first-child{padding:0;border-radius:13px;overflow:hidden}.faceless-setup .background-card img{width:84px;height:62px;object-fit:cover}.faceless-setup .background-card strong{font-size:9px;padding:5px;white-space:nowrap}.faceless-setup .background-play{display:none}
.faceless-setup .visual-rail.voice{display:flex;gap:10px;padding:4px 1px 20px;max-height:55dvh;overflow-y:auto;overflow-x:hidden;mask-image:linear-gradient(#000 calc(100% - 28px),transparent);-webkit-mask-image:linear-gradient(#000 calc(100% - 28px),transparent)}
.faceless-setup .voice .visual-select{display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:13px;min-height:88px!important;padding:14px 54px 14px 13px!important}.faceless-setup .voice .card-art{width:50px;height:50px;aspect-ratio:1;border-radius:50%;font-size:22px}.faceless-setup .voice .visual-select strong{margin:0;font-size:16px}.faceless-setup .voice .card-caption{margin:4px 0 0;font-size:11px}.faceless-setup .voice .card-info{top:50%;right:12px;transform:translateY(-50%);width:32px;height:32px}.faceless-setup .voice .visual-card:has([aria-pressed=true].card-info){box-shadow:inset 0 0 25px #a687d520;border-color:#b49adf}.faceless-setup .voice .card-info[aria-pressed=true]{animation:voice-pulse 1.2s ease-in-out infinite}
.faceless-setup #screen>.primary{margin:8px 0 0;margin-top:auto;width:100%;min-height:54px;flex-shrink:0;color:#181321;font-weight:600;background:linear-gradient(115deg,#bea9fa,#9881d7 48%,#d2bbff);background-size:200% 100%;border:1px solid #d9c9ff8c;box-shadow:inset 0 1px 0 #ffffff60,0 6px 24px #9174ce18;border-radius:17px;animation:glass-action 7s ease-in-out infinite}
.faceless-setup button:focus-visible{outline:2px solid #decaff;outline-offset:3px}.faceless-setup button:disabled{opacity:.45}.faceless-setup #screen>.primary:active{transform:scale(.985)}
@keyframes rhythm-drift{0%,100%{translate:0 0}50%{translate:-8px -7px}}
@keyframes type-reveal{0%,12%{opacity:0;translate:0 12px}28%,80%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -5px}}
@keyframes voice-pulse{50%{box-shadow:0 0 0 5px #b89be812}}
@media(prefers-reduced-motion:reduce){.faceless-setup *{animation:none!important;transition:none!important}}

.config-color-dialog{width:350px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 48px);overflow:auto;padding:20px;border:1px solid #ffffff2b;border-radius:26px;background:linear-gradient(140deg,#29252ff5,#15131df5);color:#f4f0fa;box-shadow:0 24px 80px #0009;backdrop-filter:blur(30px)}.config-color-dialog::backdrop{background:#05030a88;backdrop-filter:blur(12px)}.config-color-dialog header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.config-color-dialog header strong{font-size:17px;font-weight:600}.config-color-dialog button{background:#ffffff09;border:0;border-radius:12px;padding:10px 14px;color:#d8d0e6;font-size:13px}.config-color-dialog header button{background:none;font-size:25px;padding:0 5px}.color-modes{display:flex;gap:5px;margin-bottom:15px}.color-modes button{flex:1;background:none}.color-modes button[aria-pressed=true]{background:#ffffff12;color:white}.sv-square{height:200px;border-radius:13px;position:relative;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent);touch-action:none;cursor:crosshair;overflow:hidden}.sv-square i{position:absolute;width:20px;height:20px;border:2px solid white;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0006;pointer-events:none}.hue-label{display:block;font-size:11px;color:#a99fb6;margin:12px 0}.config-color-dialog input[type=range]{width:100%;accent-color:#c5a3f2;touch-action:pan-x}.color-hue{appearance:none;height:15px;background:linear-gradient(90deg,red,#ff0,#0f0,cyan,blue,magenta,red);border-radius:12px}.color-hue::-webkit-slider-thumb{appearance:none;width:23px;height:23px;border:3px solid white;border-radius:50%;background:transparent;box-shadow:0 1px 4px #0008}.color-code{display:flex;gap:12px;align-items:center;margin:16px 0}.color-chip{width:43px;height:43px;border:1px solid #fff3;border-radius:12px;flex-shrink:0}.color-code label{display:flex;align-items:center;gap:10px;color:#a99fb6;font-size:11px}.color-code input{width:115px;background:#ffffff08;border:1px solid #ffffff1b;color:white;border-radius:10px;padding:10px;font-size:16px}.config-color-dialog footer{display:flex;gap:10px;justify-content:flex-end}.config-color-dialog .color-done{background:#bca5df;color:#22182e}.rgb-sliders label{display:block;font-size:12px;color:#b4aabd;margin:16px 0}.rgb-sliders label span{display:block;text-align:right;font-size:11px}.config-color-dialog input[aria-invalid=true]{border-color:#ff7878}
.setup-appearance{display:grid;grid-template-columns:1fr 1fr;gap:9px}.setup-appearance>button{border:1px solid #ffffff18;border-radius:15px;background:#ffffff05;color:#c9c0d7;font-size:12px;padding:13px 10px;text-align:left}.setup-color-row{grid-column:1/-1;display:flex;align-items:center;gap:7px;min-width:0;padding:12px 10px;border:1px solid #ffffff18;border-radius:15px;background:#ffffff04}.setup-color-row>span{font-size:11px;color:#aba2bb;flex:1}.setup-color-row .setup-swatch{width:21px;height:21px;min-height:21px;flex-shrink:0;border:1px solid #ffffff38;border-radius:50%;padding:0}.setup-color-row .palette-toggle{font-size:0;width:25px;height:25px;padding:0;background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red);border:3px solid #2d2838;border-radius:50%}.setup-color-row .palette-toggle:focus-visible{outline:2px solid white}.config-color-dialog{box-sizing:border-box}
.faceless-setup .visual-rail.visual .card-art{height:clamp(88px,14dvh,118px);aspect-ratio:auto}.faceless-setup .visual-rail.visual>.personal-create-style{min-height:0}.faceless-setup .visual-rail.visual .personal-style-art{height:clamp(88px,14dvh,118px)}.faceless-setup .visual-rail.visual .visual-select strong{font-size:13px}.faceless-setup .visual-rail.visual .personal-create-style:before{font-size:52px}.faceless-setup .style .visual-select strong{max-width:50%;font-size:17px}.faceless-setup .style .card-art{mask-image:linear-gradient(90deg,transparent 25%,#000 60%);-webkit-mask-image:linear-gradient(90deg,transparent 25%,#000 60%)}
.faceless-setup .type .visual-card{container-type:inline-size}.faceless-setup .type .card-art{font-size:clamp(16px,14cqw,26px);letter-spacing:-.7px}.faceless-setup .visual-rail.visual .card-art>img{object-fit:contain}.faceless-setup .visual-rail.visual .card-art>img[src*=cinematic],.faceless-setup .visual-rail.visual .card-art>img[src*=retro-v2]{object-fit:cover}.faceless-setup .background-play{display:block;width:20px;height:20px;font-size:8px;min-height:20px;padding:0;top:5px;right:5px}
@font-face{font-family:Heavy;src:url(faceless-runtime/fonts/robotocondensed.ttf);font-weight:100 900}@font-face{font-family:Hand;src:url(faceless-runtime/fonts/comforter.ttf);font-weight:100 900}@font-face{font-family:Wide;src:url(faceless-runtime/fonts/unbounded.ttf);font-weight:100 900}@font-face{font-family:Golos;src:url(faceless-runtime/fonts/golostext.ttf);font-weight:100 900}
.faceless-setup .type .card-art.real-typography{padding:0;animation:none!important;transform:none;translate:none;opacity:1}.real-typography canvas{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.setup-color-row .setup-swatch{position:relative;width:25px;height:25px;min-height:25px;outline-offset:3px}.setup-color-row .setup-swatch[aria-pressed=true],.setup-color-row .palette-toggle[aria-pressed=true]{outline:2px solid #e8dcff;box-shadow:0 0 0 3px #15131e}.setup-color-row .palette-toggle[aria-pressed=true]{background:var(--custom-color)}.setup-color-row{gap:10px;flex-wrap:wrap}.setup-color-row>span{min-width:90px}

.setup-native-color{padding:5px 8px;border:1px solid #ffffff18;border-radius:9px;color:#a69bb7;background:#ffffff05;font-size:10px}.setup-native-color[aria-pressed=true]{border-color:#d6c1f8;color:#efe4ff;background:#b297d51c}.setup-color-row>span{flex-basis:100%;margin-bottom:3px}

/* Keep the complete setup navigation visible while the choices scroll. */
.faceless-setup .flow-main{padding-top:152px}
.faceless-setup .flow-header{position:fixed;z-index:50;top:0;left:50%;transform:translateX(-50%);width:min(100%,540px);height:70px;box-sizing:border-box;padding:22px 18px 16px;margin:0;background:#090a0ef5;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.faceless-setup #back{position:fixed;z-index:52;top:15px;left:max(10px,calc(50% - 260px))}
.faceless-setup .setup-steps{position:fixed;z-index:50;top:70px;left:50%;transform:translateX(-50%);width:min(100%,540px);height:64px;box-sizing:border-box;padding:12px 31px 14px;margin:0;background:#090a0ef5;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.faceless-setup .setup-steps:before{top:16px;left:47px;right:47px}
.faceless-setup .setup-steps:after{content:'';position:absolute;top:100%;left:0;right:0;height:16px;background:linear-gradient(#090a0ef5,transparent);pointer-events:none}
.faceless-setup #screen{min-height:calc(100dvh - 180px)}

/* Setup footer stays in the viewport; only the choices scroll on all four steps. */
body.faceless-setup{height:100dvh;overflow:hidden}
.faceless-setup .flow-main{height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.faceless-setup .flow-header{flex-shrink:0}
.faceless-setup #screen{flex:1;min-height:0;overflow:hidden}
.faceless-setup #screen>nav,.faceless-setup #screen>div:not(.setup-options){flex-shrink:0}
.faceless-setup .setup-options{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-width:none;padding:2px 2px 10px;scroll-padding-block:8px}
.faceless-setup .setup-options::-webkit-scrollbar{display:none}
.faceless-setup .setup-options>*{flex-shrink:0}
.faceless-setup .visual-rail.voice{max-height:none;overflow:visible;mask-image:none;-webkit-mask-image:none}
.faceless-setup #screen>.primary{margin:0;flex-shrink:0}
.faceless-setup .flow-error,.faceless-setup .flow-message{flex-shrink:0;max-height:min(18dvh,80px);overflow:auto;margin:8px 0 0}
.faceless-setup .flow-error:empty,.faceless-setup .flow-message:empty{display:none}

/* Soft lower edge, above the action: content fades and gently blurs into the page. */
.faceless-setup #screen{position:relative}
.faceless-setup #screen:after{content:'';position:absolute;z-index:2;left:0;right:0;bottom:72px;height:40px;pointer-events:none;background:linear-gradient(to bottom,#090a0e00,#090a0e50 45%,#090a0ef5);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);mask-image:linear-gradient(to bottom,transparent,#000);-webkit-mask-image:linear-gradient(to bottom,transparent,#000)}
.faceless-setup .setup-options{padding-bottom:42px;scroll-padding-bottom:42px}
@media(prefers-reduced-transparency:reduce){.faceless-setup #screen:after{backdrop-filter:none;-webkit-backdrop-filter:none}}
