.selfie{--selfie-cyan:#b6c9a8;--selfie-text:#f6f7f5;--selfie-muted:#b4c0c3;background:#080c0f;color:var(--selfie-text);border-block:1px solid #26363e;position:relative}.selfie-heading{display:grid;grid-template-columns:1fr 1.2fr;gap:20px 50px;align-items:end;margin-bottom:44px}.selfie-heading .eyebrow{grid-column:1/-1;color:var(--selfie-cyan)}.selfie-heading h2{margin:0}.selfie-heading h2 em{color:var(--selfie-cyan)}.selfie-heading>p:last-child{max-width:390px;line-height:1.7;color:var(--selfie-muted)}.selfie-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:7%}.selfie-layout>div{min-width:0}.selfie-stage{position:relative;background:#0c1319;overflow:hidden;border:1px solid #49616e;box-shadow:0 0 0 5px #10171d,0 25px 70px #0008}.selfie-stage:after{content:'';position:absolute;inset:0;pointer-events:none;border:1px solid #b6c9a826;background:linear-gradient(90deg,#b6c9a808,transparent 20%,transparent 80%,#b6c9a808)}.selfie-stage canvas{width:100%;height:auto;display:block}.selfie-badge{position:absolute;top:16px;left:16px;right:16px;width:fit-content;max-width:calc(100% - 32px);background:#080c0fee;color:var(--selfie-cyan);border:1px solid #385b61;font-size:9px;letter-spacing:1.3px;padding:9px 12px;line-height:1.5}.selfie-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.selfie button,.selfie select{font:inherit;min-height:44px}.selfie-actions button:not(.button),.selfie details button{border:1px solid #536571;background:#111b22;color:var(--selfie-text);padding:12px 15px;cursor:pointer}.selfie .button{background:var(--selfie-cyan);color:#071012;border:1px solid var(--selfie-cyan);cursor:pointer;font-weight:700;white-space:normal}.selfie .button:hover{background:#b7fffd;border-color:#b7fffd}.selfie button:disabled{opacity:.65;cursor:wait}.selfie [hidden]{display:none!important}.selfie #selfie-status{font-size:12px;line-height:1.7;min-height:42px;margin-top:14px;color:var(--selfie-muted)}.selfie fieldset{padding:0;border:0;margin:0 0 30px;min-width:0}.selfie legend{font-size:11px;letter-spacing:1.8px;margin-bottom:15px;font-weight:700;color:var(--selfie-cyan)}.selfie-options{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px}.selfie-options button{min-height:58px;padding:13px;text-align:left;border:1px solid #40525e;background:#111a21;color:var(--selfie-text);cursor:pointer;line-height:1.4;font-size:13px;transition:background .18s,border-color .18s}.selfie-options button:hover{background:#1a2a34;border-color:#88a5b1}.selfie-options button[aria-pressed=true]{background:#29372d;color:#f4ffff;border-color:var(--selfie-cyan);box-shadow:inset 3px 0 var(--selfie-cyan)}.selfie-color{display:flex;align-items:center;gap:15px;justify-content:space-between;font-size:13px}.selfie-color select{padding:10px;background:#111b22;border:1px solid #536571;max-width:60%;color:var(--selfie-text);color-scheme:dark}.selfie details{border-top:1px solid #384c58;border-bottom:1px solid #384c58;padding:17px 0;margin:25px 0}.selfie summary{cursor:pointer;font-weight:600;padding-block:6px}.selfie details p{font-size:12px;line-height:1.7;color:var(--selfie-muted)}.selfie details label{display:grid;grid-template-columns:100px minmax(0,1fr);gap:10px;align-items:center;margin:16px 0;font-size:12px}.selfie input[type=range]{width:100%;min-width:0;min-height:30px;accent-color:var(--selfie-cyan)}.selfie-wa{display:block!important;text-align:center;line-height:1.5}.selfie-disclaimer{font-size:11px;line-height:1.8;color:var(--selfie-muted);margin-top:18px}.selfie :focus-visible{outline:3px solid #f0b48c;outline-offset:4px}.selfie-controls{min-width:0}@media(max-width:760px){.selfie-heading{display:block}.selfie-heading h2{margin:18px 0;font-size:clamp(38px,11vw,72px)}.selfie-heading>p:last-child{font-size:13px}.selfie-layout{grid-template-columns:1fr;gap:28px}.selfie-stage{max-height:600px}.selfie-stage canvas{max-height:600px;object-fit:contain}.selfie-options button{font-size:12px;padding:11px}.selfie-actions button{font-size:12px;flex:1 1 130px}.selfie-color{flex-wrap:wrap}.selfie-color select{max-width:100%}.selfie-badge{font-size:8px;letter-spacing:.8px}.selfie details label{grid-template-columns:82px minmax(0,1fr)}}@media(prefers-reduced-motion:reduce){.selfie *{transition:none!important}}