/* Estilo's existing glass, with separate single-hue neon SVGs and readable controls.
   The glass shell stays still: press/lift motion belongs to the image only. */
#ob-role-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
#ob-role-grid[hidden],#ob-craft-summary[hidden]{display:none!important}
#ob-role-grid .ob-role-card{appearance:none;font-family:inherit;min-width:0;width:100%;padding:14px 10px 16px!important;display:flex!important;flex-direction:column;gap:8px!important;align-items:center!important;text-align:center;position:relative;border-radius:20px!important;color:var(--tx);cursor:pointer;transform:none!important;filter:none!important;transition:none!important}
.ob-craft-art{display:block;flex:none;width:104px;height:104px;object-fit:contain;pointer-events:none;transition:transform 180ms cubic-bezier(.22,1,.36,1)}
#ob-role-grid .ob-craft-art{margin-top:8px;width:min(128px,100%);height:128px}
#ob-role-grid .ob-role-name{display:block;font-size:16px;font-weight:750;line-height:1.3;text-wrap:balance}
#ob-role-grid .ob-role-description{display:block;font-size:14px;font-weight:400;line-height:1.4;color:var(--muted);margin-top:5px;text-wrap:balance}
.ob-role-mark{position:absolute;right:10px;top:9px;width:24px;height:24px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.25);border-radius:50%;font-size:16px;background:rgba(0,0,0,.22);color:transparent;visibility:hidden}
#ob-role-grid .ob-role-sel .ob-role-mark{color:#17131c;background:var(--craft-neon);border-color:var(--craft-neon);visibility:visible}
#ob-role-grid .ob-role-card:active .ob-craft-art{transform:scale(.94)}
#ob-role-grid .ob-role-card:focus-visible,#ob-craft-change:focus-visible{outline:3px solid var(--craft-neon,var(--neon));outline-offset:4px}
#ob-role-grid .ob-role-card.ob-role-sel::after{border-color:var(--craft-neon);box-shadow:0 0 18px color-mix(in srgb,var(--craft-neon) 22%,transparent),inset 0 0 18px color-mix(in srgb,var(--craft-neon) 12%,transparent)}
#ob-craft-summary{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1.5px solid var(--neon);border-radius:20px;background:radial-gradient(ellipse at 18% 50%,rgba(231,198,106,.25),transparent 72%),rgba(24,24,30,.85);box-shadow:0 0 24px rgba(231,198,106,.12),inset 0 1px 0 rgba(255,255,255,.2);margin-bottom:24px}
#ob-craft-summary{border-color:var(--craft-neon,var(--neon));background:radial-gradient(ellipse at 18% 50%,color-mix(in srgb,var(--craft-neon,var(--neon)) 17%,transparent),transparent 72%),rgba(24,24,30,.85);box-shadow:0 0 24px color-mix(in srgb,var(--craft-neon,var(--neon)) 10%,transparent),inset 0 1px 0 rgba(255,255,255,.2)}
#ob-craft-summary .ob-craft-art{width:84px;height:84px}
.ob-craft-summary-copy{flex:1;min-width:0;font-size:16px;line-height:1.4;font-weight:750}
.ob-craft-selected{display:block;font-size:14px;font-weight:500;color:var(--neon);margin-bottom:3px}
#ob-craft-change{background:none!important;color:var(--neon)!important;font:inherit;font-size:14px;min-height:44px;padding:8px;border:0;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.ob-craft-selected{color:var(--craft-neon,var(--neon))}
.ob-guide-heading{font-size:20px!important;line-height:1.3!important;letter-spacing:-.02em!important;text-transform:none!important;font-weight:700!important;color:var(--tx)!important;margin-bottom:12px!important}
.ob-guide-caption{font-size:14px;line-height:1.5;color:var(--muted);margin:0 0 16px}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) .input{font-size:16px!important;min-height:48px}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) .il{font-size:14px!important;letter-spacing:0!important;text-transform:none!important;line-height:1.5}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) [style*="font-size:10"],
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) [style*="font-size:11"],
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) [style*="font-size:12"],
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) [style*="font-size:13"]{font-size:14px!important;line-height:1.5}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) .ob-footer{padding-bottom:max(18px,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(15,15,20,.92),#0f0f14 35%)}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) .ob-footer .btn{min-height:48px;font-size:16px!important;line-height:1.4}
#ob1-continue-btn:disabled{opacity:.5!important;cursor:not-allowed}
#spec-chips .chip{font-size:15px!important;min-height:44px;display:inline-flex;align-items:center;padding:10px 14px!important}
#spec-chips button{font-family:inherit;cursor:pointer}
#custom-spec-input{flex-direction:column;align-items:stretch;gap:8px}
#screen-ob-welcome #ob-spec-section,#screen-ob-welcome #ob-info-section{animation:none!important}
#ob-day-grid .ob-day-pill{min-height:44px;display:grid;place-items:center;font-size:14px!important;padding:6px 1px!important;line-height:1!important}
#ob-mini-preview{display:grid!important;grid-template-columns:36px minmax(0,1fr);gap:4px 10px!important}
#ob-mini-preview[style*="display:none"]{display:none!important}
#ob-mini-avatar{grid-column:1;grid-row:1 / 3}
#ob-mini-preview>div:nth-child(2){grid-column:2;min-width:0}
#ob-mini-name,#ob-mini-sub,#ob-mini-link{white-space:normal!important;overflow-wrap:anywhere}
#ob-mini-link{grid-column:2;font-size:14px!important}
#ob-bookstyle-cards .ob-bookstyle-card>div>div{font-size:16px!important;line-height:1.5}
#ob-books-pills{flex-wrap:wrap}
#ob-books-pills .ob-books-pill{min-height:48px;min-width:82px}
#ob-bookstyle-cards .ob-bookstyle-card:focus-visible,#ob-day-grid .ob-day-pill:focus-visible,#ob-books-pills .ob-books-pill:focus-visible,#spec-chips .chip:focus-visible{outline:3px solid var(--neon);outline-offset:3px}
#prof-list-wrap .pcard{width:100%;font-family:inherit;text-align:left;color:var(--tx)}
#prof-list-wrap .ob-craft-art{width:64px;height:64px}
#prof-list-wrap .pname{font-size:16px!important}
#prof-list-wrap .pdesc{font-size:14px!important;line-height:1.4}
body.light-mode #ob-craft-summary{background:radial-gradient(ellipse at 18% 50%,rgba(231,198,106,.35),transparent 72%),#fffaf0;color:#231c0b}
body.light-mode .ob-craft-selected,body.light-mode #ob-craft-change{color:#72500d!important}
body.light-mode :is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) .ob-footer{background:#fffaf5}
@media(prefers-reduced-motion:reduce){.ob-craft-art{transition:none!important}#ob-role-grid .ob-role-card:active .ob-craft-art{transform:none}}
.ob-footer-hint{font-size:14px;line-height:1.5;color:var(--muted);text-align:center;margin:10px 0 0}
.ob-stepbar{display:flex;align-items:center;gap:12px;padding:16px 18px 8px;flex-shrink:0}
.ob-stepbar .back-btn,.ob-back-space{flex:0 0 44px;width:44px;height:44px}
.ob-journey{display:flex;flex:1;gap:12px;list-style:none;margin:0;padding:0;min-width:0}
.ob-journey li{display:flex;flex:1;flex-direction:column;align-items:center;gap:6px;position:relative;font:500 14px/1.3 var(--font-grotesk,system-ui);color:var(--muted);white-space:nowrap}
.ob-journey li:not(:last-child)::after{content:"";position:absolute;top:13px;left:calc(50% + 20px);width:calc(100% - 28px);height:1px;background:rgba(255,255,255,.18)}
.ob-journey li.is-complete::after{background:var(--neon)}
.ob-step-symbol{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.28);font-size:14px;line-height:1;color:var(--muted)}
.ob-journey .is-current,.ob-journey .is-complete{color:var(--neon)}
.ob-journey .is-current .ob-step-symbol{border-color:var(--neon);color:var(--neon);background:rgba(231,198,106,.1)}
.ob-journey .is-complete .ob-step-symbol{border-color:var(--neon);background:var(--neon);color:#241d12}
.ob-step-symbol svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ob-step-symbol path{stroke-dasharray:24;stroke-dashoffset:0}
.ob-step-complete{margin:0 0 10px;color:var(--neon);font-size:14px;line-height:1.5;font-weight:500}
.ob-step-complete[hidden]{display:none}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile)>.obprog{display:none}
/* The legacy app-wide card cascade also ran on these forms, briefly hiding
   upload controls. The step heading owns the entrance; form cards stay put. */
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) :is(.card,.acard).content-reveal{animation:none!important}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) .ob-hero:focus{outline:none}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) .ob-footer button{touch-action:manipulation}
.ob-journey,.ob-stepbar,.ob-step-complete{transform:none;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
body.light-mode .ob-journey :is(.is-current,.is-complete),body.light-mode .ob-step-complete{color:#72500d}
body.light-mode .ob-journey .is-current .ob-step-symbol{border-color:#8a6620;color:#72500d}
@media(max-width:360px){.ob-stepbar{gap:6px;padding-inline:12px}.ob-journey{gap:8px}.ob-journey li{font-size:14px}}
@media(prefers-reduced-motion:reduce){:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) .ob-hero{animation:none!important}}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) .ob-footer{padding-bottom:max(16px,env(safe-area-inset-bottom));gap:0}
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) [style*="font-size:11.5"],
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) [style*="font-size:12px"],
:is(#screen-ob-welcome,#screen-ob-booking,#screen-ob-profile) [style*="font-size:13px"]{font-size:14px!important;line-height:1.5!important}