/* Frosted Studio — production system, shared by all roles and public screens. */
:root {
    --bg: #111015; --card: #201d25; --card-2: #29252f;
    --text: #faf7fc; --text-2: #beb7c8; --text-3: #aaa1b6;
    --accent: #cf2348; --accent-hover: #f05c79; --accent-soft: #ec42651c;
    --border: #ffffff1f; --border-strong: #ffffff40;
    --font-body: 'Space Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;
    --r-sm: 13px; --r: 19px; --r-lg: 26px; --r-xl: 30px;
    --studio-surface: linear-gradient(140deg, #ffffff15, #ffffff04 68%), rgba(35,32,42,.72);
    --studio-blur: blur(26px) saturate(155%);
    --studio-depth: inset 0 1px 0 #ffffff38, inset 0 -1px 0 #ffffff06, 0 5px 0 -3px #06040b70, 0 18px 42px -22px #000b;
    --g-surface: rgba(38,34,44,.78); --g-line: #ffffff2e; --g-blur: var(--studio-blur); --g-shadow: var(--studio-depth);
    --frost: var(--studio-surface); --frost-edge: var(--g-line); --frost-filter: var(--studio-blur); --frost-depth: var(--studio-depth);
    --frost-text: var(--text); --frost-muted: var(--text-2);
}
html { color-scheme: dark; scroll-padding-top: 110px; }
body { isolation: isolate; }
body::before, body[data-surface="marketing"]::before, body.al-body::before, body.guest-glass::before, body.guest-entry::before {
    background: radial-gradient(ellipse 70vw 85vh at 0 0, #7186963d, transparent 75%), radial-gradient(ellipse 70vw 90vh at 100% 16%, #a32a4540, transparent 80%), linear-gradient(155deg, #19171e, #111015 80%);
}
body::after { opacity: .025; }
h1, h2, h3 { text-wrap: balance; }
button, .btn, summary, input[type="checkbox"] { touch-action: manipulation; }
:focus-visible { outline-color: #ffb3c8; outline-offset: 4px; }
/* One material system. Media itself remains unblurred. */
.card, .form-card, .stat-card, .studio-focus, .studio-queue-card, .studio-rail, .studio-dock,
.form-auth, .modal, .upload-modal, .notif-menu, .ev-share, .studio-preferences, .studio-search,
.timeline-section, .comments-panel, .studio-shell .dash-live, .booking-form-card, .tp-sheet {
    background: var(--studio-surface);
    border: 1px solid var(--g-line);
    border-radius: var(--r-lg);
    box-shadow: var(--studio-depth);
    -webkit-backdrop-filter: var(--studio-blur); backdrop-filter: var(--studio-blur);
}
.card { padding: 24px; }
.btn, .btn-sm, .btn--sm { min-height: 44px; gap: 8px; border-radius: 15px; font-weight: 600; }
.btn { background: linear-gradient(145deg,#ffffff18,#ffffff05); border: 1px solid #ffffff30; box-shadow: inset 0 1px #ffffff28; }
.btn--primary, .page-content .btn:not(.btn-ghost):not(.btn--ghost):not(.btn-danger):not(.btn--danger):not(.btn-green) {
    background: linear-gradient(160deg,#f64d6d,#b9183e); border: 1px solid #ffffff48;
    box-shadow: inset 0 1px #ffffff4a, 0 4px 0 -1px #690a2870, 0 12px 26px -16px #ed2d60;
}
.btn--ghost, .btn-ghost { background: linear-gradient(145deg,#ffffff14,#ffffff03); color: var(--text); border-color: #ffffff2e; }
.btn--danger, .btn-danger { color: #ff9baf; border-color: #f66c893f; background: #a62b4110; }
.btn-green { color: #d4f9e4; border: 1px solid #9ce5bc66; background: linear-gradient(155deg,#357a56,#25523d); box-shadow: inset 0 1px #d9ffec40, 0 5px 15px -8px #0008; }
.btn:active, .studio-icon-button:active { transform: translateY(1px) scale(.975); }
.studio-icon-button { display: inline-grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; padding: 0; color: var(--text); border: 1px solid #ffffff35; border-radius: 15px; background: linear-gradient(145deg,#ffffff20,#ffffff06),#1b172140; box-shadow: inset 0 1px #ffffff34,0 3px 8px #0002; }
.studio-top-preferences { margin-left: auto; }
.nav-logo { white-space: nowrap; }
.nav { border: 1px solid var(--g-line); background: var(--studio-surface); box-shadow: var(--studio-depth); -webkit-backdrop-filter: var(--studio-blur); backdrop-filter: var(--studio-blur); }
body[data-surface="marketing"] .nav { background: var(--studio-surface); box-shadow: var(--studio-depth); }
.nav--marketing .nav-links { gap: 22px; }
/* Desktop application shell. Existing header stays a real 64px toolbar for the video player. */
.studio-shell { padding-left: 260px; }
.studio-shell > .nav { width: calc(100% - 40px); height: 64px; margin: 18px 20px 0; top: 18px; padding: 0 14px 0 20px; border-radius: 23px; }
.studio-shell > .nav .nav-links { display: none; }
.studio-shell > .nav .nav-logo { font-size: 15px; }
.studio-shell > .nav .nav-toggle { display: none; }
.studio-shell > .nav .studio-current { display: block; font-size: 10px; color: var(--text-2); margin-top: 1px; }
.studio-rail { position: fixed; z-index: 110; left: 20px; top: 18px; bottom: 20px; width: 220px; display: flex; flex-direction: column; padding: 24px 14px 16px; overflow-y: auto; scrollbar-width: thin; }
.studio-brand { display: flex; align-items: center; gap: 12px; padding: 0 6px 25px; }
.studio-brand strong { display: block; font: 700 16px/1.25 var(--font-display); }
.studio-brand small { display: block; font: 8px/1.5 var(--font-mono); letter-spacing: .12em; color: var(--text-2); margin-top: 4px; }
.studio-mark { width: 44px; height: 44px; flex: 0 0 44px; display: inline-grid; place-items: center; border: 1px solid #ffffff40; border-radius: 16px; background: linear-gradient(135deg,#ffffff28,#ffffff06); box-shadow: inset 0 1px #ffffff50, 0 4px 10px #0003; }
.studio-brand .studio-mark { transform: rotate(-6deg); position: relative; }
.studio-brand .studio-mark::before { content: ''; position: absolute; inset: -4px; z-index: -1; border: 1px solid #ffffff25; border-radius: 16px; transform: rotate(12deg); }
.studio-nav-label { margin: 0 10px 10px; font: 8px/1.4 var(--font-mono); letter-spacing: .13em; color: var(--text-3); }
.studio-rail-links { display: grid; gap: 5px; }
.studio-rail-links a { display: flex; align-items: center; gap: 11px; padding: 11px 12px; min-height: 44px; border: 1px solid transparent; border-radius: 15px; font-size: 12px; color: var(--text-2); }
.studio-rail-links a.is-active { color: #fff; border-color: #ffffff2d; background: linear-gradient(130deg,#ffffff1c,#ffffff04); box-shadow: inset 0 1px #ffffff2b; }
.studio-rail-links a.is-active .icon { color: #ffacc2; }
.studio-rail-footer { margin-top: auto; padding-top: 24px; }
.studio-preferences-link, .studio-web-link, .studio-logout { display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 10px; min-height: 44px; font-size: 11px; color: var(--text-2); border-radius: 12px; }
.studio-identity { display: flex; align-items: center; gap: 10px; padding: 18px 8px 8px; margin-top: 12px; border-top: 1px solid #ffffff17; }
.studio-identity strong { font-size: 11px; display: block; overflow-wrap: anywhere; }
.studio-identity small { font-size: 9px; color: var(--text-2); }
.studio-avatar { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; background: #ffffff0d; border: 1px solid #ffffff25; border-radius: 12px; }
.studio-logout { font-size: 10px; }
.studio-dock { display: none; }
.studio-shell .page-content, .studio-shell > .container { max-width: 1240px; padding-inline: 24px; }
.studio-shell .section-title { font-size: clamp(28px,3.3vw,42px); letter-spacing: -.05em; margin-bottom: 18px; }
.studio-eyebrow { font: 9px/1.5 var(--font-mono); letter-spacing: .14em; color: var(--text-2); margin-bottom: 10px; }
.studio-page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.studio-page-heading .section-title { margin-bottom: 12px; }
.studio-page-lead { color: var(--text-2); font-size: 12px; }
.studio-work-queue { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-bottom: 26px; }
.studio-queue-card { padding: 20px; display: flex; align-items: center; gap: 14px; min-width: 0; }
.studio-queue-card > span:nth-child(2) { flex: 1; min-width: 0; }
.studio-queue-card strong { display: block; font: 700 28px/1.2 var(--font-display); letter-spacing: -.04em; }
.studio-queue-card small { display: block; font-size: 10px; line-height: 1.5; color: var(--text-2); margin-top: 4px; }
.studio-queue-card > .icon { color: var(--text-2); width: 14px; }
.studio-focus { display: flex; align-items: center; gap: 18px; padding: 24px; margin: 0 0 28px; }
.studio-focus > div { flex: 1; }
.studio-focus h2 { font-size: 22px; letter-spacing: -.04em; }
.studio-focus p:not(.studio-eyebrow) { color: var(--text-2); font-size: 12px; margin-top: 6px; }
.studio-focus .studio-eyebrow { font-size: 8px; margin-bottom: 5px; }
.dash-header { margin-bottom: 24px; }
.dash-title { font-size: clamp(29px,3.8vw,42px); letter-spacing: -.05em; }
.dash-grid { gap: 20px; }
.dash-grid .card { padding: 0; }
.dash-grid .media-item img { object-position: center 25%; }
.dash-video-body { padding: 20px; }
.dash-section-title { font-size: 21px; margin-bottom: 18px; scroll-margin-top: 115px; }
.dash-section-title .icon { color: #ffafc5; }
.dash-video-thumb, .media-item--wide { background: #201b26; }
.steps { gap: 5px; }
.chip, .code-chip { background: linear-gradient(140deg,#ffffff12,#ffffff04); border-color: #ffffff30; box-shadow: inset 0 1px #ffffff1c; }
.badge, .badge-review, .badge-changes, .badge-approved { border-radius: 10px; font-size: 10px; padding: 5px 9px; }
.badge-review, .badge--review { color: #f6d29d; background: #e9b46112; border: 1px solid #e9b46138; }
.badge-changes, .badge--changes { color: #ffa9bd; background: #e94b6b12; border: 1px solid #e94b6b38; }
.badge-approved, .badge--approved { color: #b1e5cb; background: #71c49c12; border: 1px solid #71c49c38; }
.stat-card { position: relative; padding: 24px; }
.stat-number { font-size: 36px; }
.stats-section-label { font-size: 17px; color: var(--text); margin-bottom: 16px; }
.stat-label { font-size: 11px; }
.form-title { font-size: 20px; letter-spacing: -.035em; }
.form-card, .page-content .card { padding: 24px; }
.form-row { gap: 18px; }
.field-label, .form-label { font-size: 11px; color: #c9c0d2; }
.field input, .field textarea, .field select, .input, .page-content input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), .page-content select, .page-content textarea {
    background: linear-gradient(160deg,#00000030,#ffffff03); border: 1px solid #ffffff30; border-radius: 13px; min-height: 46px; color: var(--text); box-shadow: inset 0 2px 4px #0002,0 1px #ffffff09; font-size: 14px;
}
input::placeholder, textarea::placeholder { color: #a99db7; opacity: 1; }
select option, select optgroup { background: #27222f; color: #fff; }
input:focus-visible, textarea:focus-visible, select:focus-visible { border-color: #f7a2ba; box-shadow: 0 0 0 3px #e8416524; }
.studio-native-switch { -webkit-appearance: none; appearance: none; position: relative; width: 48px; height: 30px; min-width: 48px; flex: 0 0 48px; vertical-align: middle; padding: 3px; margin: 7px 4px; border: 1px solid #ffffff40; border-radius: 99px; background: linear-gradient(#51495c,#352e3e); box-shadow: inset 0 2px 5px #0006; cursor: pointer; }
.studio-native-switch::before { content: ''; position: absolute; inset: -7px -3px; }
.studio-native-switch::after { content: ''; display: block; width: 22px; height: 22px; border-radius: 50%; background: linear-gradient(135deg,#fff,#dcd4e2); box-shadow: 0 2px 5px #0005; transition: transform 180ms var(--g-ease); }
.studio-native-switch:checked { background: linear-gradient(#ee476b,#b6173c); border-color: #ff8da7; }
.studio-native-switch:checked::after { transform: translateX(18px); }
.gl-switch[aria-checked="true"] { background: linear-gradient(160deg,#f15777,#b8173d); border-color: #ff8ea8; box-shadow: inset 0 1px #ffffff4a,0 0 14px #f0446522; }
.studio-create-form { margin-bottom: 24px; }
.studio-create-form > summary { display: flex; align-items: center; gap: 12px; min-height: 48px; cursor: pointer; list-style: none; font-size: 15px; font-weight: 600; }
.studio-create-form > summary::-webkit-details-marker { display: none; }
.studio-create-form > summary::after { content: '+'; margin-left: auto; width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #ffffff25; border-radius: 10px; font-size: 20px; font-weight: 400; color: #ffc3d2; }
.studio-create-form[open] > summary::after { content: '−'; }
.studio-create-form[open] > summary { margin-bottom: 20px; }
.studio-search { display: flex; align-items: center; gap: 10px; padding: 8px 14px; margin: 0 0 18px; border-radius: 17px; max-width: 480px; box-shadow: inset 0 1px #ffffff24; }
.studio-search .icon { color: var(--text-2); }
.studio-search input[type="search"] { min-width: 0; flex: 1; width: 100%; border: 0; padding: 6px 0; box-shadow: none; background: transparent; font-size: 13px; min-height: 30px; }
.studio-search-status { color: var(--text-2); font-size: 11px; margin: -4px 0 16px; }
.table { font-size: 13px; }
.table th { color: var(--text-2); font-size: 10px; letter-spacing: .05em; padding: 16px 12px; font-weight: 500; }
.table td { border-color: #ffffff16; padding: 16px 12px; overflow-wrap: anywhere; }
.table th, .table tr { border-color: #ffffff16; }
.table tbody tr:hover { background: #ffffff04; }
.table td .badge { white-space: normal; }
.upload-zone { border-radius: 23px; min-height: 160px; background: linear-gradient(140deg,#ffffff09,#ffffff02); border: 1px dashed #ffffff48; box-shadow: inset 0 1px #ffffff13; }
.upload-zone:hover, .upload-zone.dragover { border-color: #ffadc3; background: #ed42651a; }
.upload-overlay, .modal-backdrop { background: #09060e99; -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px); }
.upload-modal { min-width: min(400px,100%); }
.alert, .alert-error, .alert-success { border-radius: 16px; font-size: 13px; }
.empty, .empty-state { border-radius: 24px; padding-block: 42px; }
/* Native dialog keeps focus and escape semantics, including when used inside other app flows. */
.studio-preferences { position: fixed; inset: 0; width: min(440px,calc(100% - 24px)); max-height: min(90dvh,700px); margin: auto; padding: 26px; color: var(--text); overflow-y: auto; background: linear-gradient(140deg,#ffffff16,#ffffff04),rgba(37,32,45,.94); }
.studio-preferences::backdrop { background: #07050c80; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.studio-modal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 26px; }
.studio-preferences h2 { font-size: 30px; letter-spacing: -.05em; }
.studio-modal-lead { color: var(--text-2); font-size: 13px; margin-top: 6px; }
.studio-preferences .gl-preference { min-height: 94px; border-color: #ffffff1c; }
.studio-preferences .gl-preference > .icon { background: linear-gradient(140deg,#ffffff1d,#ffffff05); border-color: #ffffff30; box-shadow: inset 0 1px #ffffff20; }
.studio-preferences .gl-preference-copy strong { font-size: 14px; }
.studio-preferences .gl-preference-copy small { font-size: 11px; }
.studio-preference-note { font-size: 10px; color: var(--text-2); line-height: 1.7; margin: 22px 0 0; }
.studio-preference-note .icon { vertical-align: -3px; margin-right: 4px; }
/* Guest and signed-in photo galleries share the same clear media and raised controls. */
.studio-gallery .gallery-head { padding-top: 28px; }
.studio-gallery .gallery-cover { max-height: 330px; border-radius: 24px; }
.studio-gallery .gallery-cover img { object-position: center 28%; }
.studio-gallery .gallery-hint { background: var(--studio-surface); border-color: var(--g-line); border-radius: 20px; }
.studio-gallery .gphoto-cell { border-radius: 15px; box-shadow: inset 0 0 0 1px #ffffff35,0 8px 20px -14px #0009; }
.studio-gallery #galleryGrid .ph-like { width: 38px; height: 38px; right: 5px; bottom: 5px; border-radius: 14px; background: linear-gradient(135deg,#ffffff3c,#ffffff0a),#1a15239c; border: 1px solid #ffffff70; box-shadow: inset 0 1px #ffffff4d,0 4px 8px #0004; -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.studio-gallery #galleryGrid .ph-like::before { content: ''; position: absolute; inset: -4px; }
.studio-gallery #galleryGrid .ph-like.is-active { background: linear-gradient(145deg,#fa6d90de,#bc1642bf); }
.studio-gallery #galleryGrid .ph-like.is-active .heart-ico { color: #fff; background: none; }
.studio-gallery .pick-bar::before { display: none; }
.studio-gallery .pick-bar { padding: 0 12px; bottom: max(12px,env(safe-area-inset-bottom,0px)); }
.studio-gallery .pick-bar-inner { max-width: 760px; min-height: 68px; border-radius: 23px; border: 1px solid var(--g-line); padding: 10px 14px; background: var(--studio-surface); box-shadow: var(--studio-depth); -webkit-backdrop-filter: var(--studio-blur); backdrop-filter: var(--studio-blur); }
.studio-gallery #lightbox .lb-top, .studio-gallery #lightbox .lb-bar { border: 1px solid var(--g-line); border-radius: 23px; background: var(--studio-surface); -webkit-backdrop-filter: var(--studio-blur); backdrop-filter: var(--studio-blur); box-shadow: var(--studio-depth); }
.studio-gallery #lightbox .lb-top { left: 10px; right: 10px; top: max(10px,env(safe-area-inset-top,0px)); padding: 5px; min-height: 56px; }
.studio-gallery #lightbox .lb-bar { left: 10px; right: 10px; bottom: max(10px,env(safe-area-inset-bottom,0px)); padding: 5px; height: 72px; }
.studio-gallery #lightbox .lb-slide { padding-top: calc(82px + env(safe-area-inset-top,0px)); padding-bottom: calc(98px + env(safe-area-inset-bottom,0px)); }
.studio-gallery #lightbox .lb-bar-btn { min-height: 56px; font-size: 11px; border-radius: 18px; }
.studio-gallery #lightbox .lb-btn, .studio-gallery #lightbox .lightbox-nav { border: 1px solid #ffffff45; border-radius: 16px; background: linear-gradient(140deg,#ffffff25,#ffffff08),#201929a6; box-shadow: inset 0 1px #ffffff30; }
.studio-gallery #lightbox { background: #111015f7; }
.studio-gallery .lb-more, .studio-gallery .share-sheet, .studio-gallery .lb-side { background: linear-gradient(140deg,#ffffff12,#ffffff04),#28212ff5; border-color: var(--g-line); }
/* Video review: preserve the actual player and timestamp controls. */
.review-layout { gap: 18px; margin: 20px; min-width: 0; height: var(--reviewH,calc(100dvh - 130px)); }
.review-video-col { padding: 0; }
.review-video-wrap { border: 1px solid #ffffff30; border-radius: 24px; background: #08070a; box-shadow: 0 14px 35px -25px #000; }
.timeline-section { margin-top: 16px; padding: 18px; }
.timeline-bar { background-color: #100c1880; border: 1px solid #ffffff1f; }
.timeline-progress { background: linear-gradient(90deg,#c4274d80,#f0557880); }
.timeline-controls { flex-wrap: wrap; gap: 10px; }
.timeline-controls button { min-height: 36px; border: 1px solid #ffffff30; border-radius: 11px; padding: 6px 10px; background: #ffffff08; color: var(--text-2); }
.comments-panel { border-radius: 24px; width: 360px; min-width: 290px; overflow: hidden; }
.panel-header, .comment-form, .comments-filters { background: #ffffff03; border-color: #ffffff18; }
.comment-item { border-color: #ffffff14; }
.comment-time { color: #ffb3c7; background: #f345661a; border: 1px solid #f345662e; border-radius: 9px; }
.review-mobile-tabs { border-color: #ffffff24; background: var(--studio-surface); -webkit-backdrop-filter: var(--studio-blur); backdrop-filter: var(--studio-blur); border-radius: 15px; }
.review-mobile-tab { border-radius: 12px; font-size: 12px; }
.review-mobile-tab.active { background: #ffffff13; color: #ffc3d5; }
.breadcrumbs { font-size: 11px; padding-inline: 24px; margin-top: 20px; }
.ev-hero { border: 1px solid #ffffff30; border-radius: 26px; margin: 24px; overflow: hidden; }
.ev-hero img { object-position: center 30%; }
.ev-filter, .filter-tabs, .auth-tabs { display: flex; gap: 5px; flex-wrap: wrap; padding: 6px; width: fit-content; max-width: 100%; border: 1px solid var(--g-line); border-radius: 18px; background: var(--studio-surface); box-shadow: inset 0 1px #ffffff25; }
.filter-tab, .auth-tab { min-height: 40px; padding: 9px 15px; border-radius: 13px; border: 1px solid transparent; color: var(--text-2); font-size: 12px; }
.filter-tab.is-active, .auth-tab.active { color: #fff; background: linear-gradient(140deg,#ffffff20,#ffffff06); border-color: #ffffff30; box-shadow: inset 0 1px #ffffff20; }
.ev-share { padding: 24px; margin-bottom: 24px; }
/* Public portfolio, bookings, account entry and editorial pages. */
.work-card { border-radius: 24px; overflow: hidden; border: 1px solid #ffffff30; box-shadow: 0 12px 32px -22px #000; }
.work-overlay { background: linear-gradient(0deg,#17121af2,transparent 76%); }
.work-overlay-meta { padding: 18px; }
.work-cta { border: 1px solid #ffffff40; background: #20182790; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border-radius: 12px; }
.portfolio-lead { font-size: 16px; color: var(--text-2); }
.hero-live-card, .client-zone-preview, .live-demo { background: var(--studio-surface); border-color: var(--g-line); box-shadow: var(--studio-depth); -webkit-backdrop-filter: var(--studio-blur); backdrop-filter: var(--studio-blur); }
.booking-page { max-width: 920px; }
.booking-hero { padding-block: 40px 30px; }
.booking-hero h1 { font-size: clamp(30px,4vw,42px); letter-spacing: -.05em; }
.booking-calendar { padding: 10px; border: 1px solid var(--g-line); border-radius: 24px; background: var(--studio-surface); box-shadow: var(--studio-depth); -webkit-backdrop-filter: var(--studio-blur); backdrop-filter: var(--studio-blur); gap: 6px; }
.cal-day { background: #ffffff07; border: 1px solid #ffffff14; border-radius: 13px; box-shadow: inset 0 1px #ffffff12; }
.cal-day.selected { background: linear-gradient(150deg,#f14c70,#b7183f); border-color: #ff9bb366; box-shadow: inset 0 1px #ffffff4a,0 4px 12px #bd20424d; }
.cal-day.empty { background: none; border: 0; box-shadow: none; }
.cal-header { font-size: 10px; padding: 8px 0; }
.form-auth { width: min(440px,calc(100% - 32px)); margin: 60px auto; padding: 30px; }
.form-auth-title { font-size: 30px; letter-spacing: -.05em; }
.studio-auth-mark { margin: 0 auto 24px; width: 58px; height: 58px; border-radius: 20px; transform: rotate(-6deg); }
.auth-tabs { width: 100%; margin: 24px 0; }
.auth-tab { flex: 1; }
.auth-footer, .auth-divider { font-size: 11px; color: var(--text-2); }
.profile-title { font-size: 38px; letter-spacing: -.05em; }
.footer { margin-top: 40px; padding-block: 40px; border-color: #ffffff1c; background: #ffffff02; }
.footer-links a { font-size: 12px; }
/* Scope interactive depth to a pointer and allow it to be disabled instantly. */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    html:not([data-motion="reduced"]) .studio-queue-card,
    html:not([data-motion="reduced"]) .dash-grid .card { transition: transform 160ms var(--g-ease), border-color 160ms var(--g-ease); }
    html:not([data-motion="reduced"]) .studio-queue-card:hover,
    html:not([data-motion="reduced"]) .dash-grid .card:hover { transform: perspective(900px) rotateX(1.2deg) translateY(-3px); border-color: #ffffff55; }
    .studio-rail-links a:hover, .studio-preferences-link:hover, .studio-web-link:hover { color: #fff; background-color: #ffffff07; }
}
@media (max-width: 1300px) {
    .studio-queue-card { padding: 18px 14px; gap: 10px; }
    .studio-queue-card .studio-mark { display: none; }
    .comments-panel { width: 320px; }
}
@media (max-width: 1099px) {
    .studio-shell { padding-left: 0; padding-bottom: calc(100px + env(safe-area-inset-bottom,0px)); }
    .studio-rail { display: none; }
    .studio-shell > .nav { width: calc(100% - 24px); margin: 12px; top: max(12px,env(safe-area-inset-top,0px)); }
    .studio-shell > .nav .nav-toggle { display: inline-flex; }
    .studio-shell > .nav .nav-links { position: absolute; top: calc(100% + 10px); left: 0; right: 0; width: auto; padding: 16px; border: 1px solid var(--g-line); border-radius: 22px; background: #292330f5; box-shadow: var(--studio-depth); -webkit-backdrop-filter: var(--studio-blur); backdrop-filter: var(--studio-blur); max-height: calc(100dvh - 190px); overflow-y: auto; }
    .studio-shell > .nav .nav-links.open { display: flex; flex-direction: column; align-items: stretch; gap: 4px; }
    .studio-shell .nav-link { min-height: 44px; padding: 10px; border-radius: 13px; }
    .studio-shell .nav-link::after { display: none; }
    .studio-shell .nav-link.is-active { background: #ffffff0e; }
    .studio-shell .nav-logout-form { display: flex; }
    .studio-shell .notif-menu { position: static; width: 100%; max-width: none; margin-block: 10px; }
    .studio-dock { display: flex; position: fixed; z-index: 105; left: 12px; right: 12px; bottom: max(12px,env(safe-area-inset-bottom,0px)); justify-content: space-around; gap: 3px; padding: 7px; border-radius: 25px; background: linear-gradient(140deg,#ffffff18,#ffffff04),#26212dea; }
    .studio-dock > a, .studio-dock > button { display: flex; flex: 1; min-width: 0; min-height: 52px; align-items: center; flex-direction: column; justify-content: center; gap: 3px; color: #c9bdd2; font-size: 9px; border-radius: 17px; padding: 6px 2px; }
    .studio-dock > .is-active { background: #ffffff13; color: #ffb9cd; box-shadow: inset 0 1px #ffffff1c; }
    .studio-gallery.studio-shell .pick-bar { bottom: calc(90px + env(safe-area-inset-bottom,0px)); }
    .studio-shell .toast-wrap { bottom: 96px; }
}
@media (max-width: 900px) {
    .review-layout { margin: 14px 12px; gap: 12px; }
    .comments-panel { width: 100%; min-width: 0; border-radius: 22px; }
    .review-video-col { min-width: 0; }
    .studio-shell.studio-review { padding-bottom: calc(90px + env(safe-area-inset-bottom,0px)); }
    .studio-focus { align-items: flex-start; flex-wrap: wrap; padding: 20px; gap: 14px; }
    .studio-focus .btn { margin-left: 58px; }
}
@media (max-width: 700px) {
    .studio-shell .page-content, .studio-shell > .container { padding-inline: 16px; }
    .studio-shell .page-content { padding-top: 22px; }
    .studio-shell .section-title { font-size: 31px; }
    .studio-page-heading { display: block; }
    .studio-page-heading > .btn { margin-top: 18px; }
    .studio-work-queue { gap: 10px; }
    .studio-queue-card { padding: 16px 10px; display: block; border-radius: 20px; }
    .studio-queue-card strong { font-size: 26px; }
    .studio-queue-card small { font-size: 9px; }
    .studio-queue-card > .icon { display: none; }
    .studio-page-lead { font-size: 12px; }
    .studio-focus .studio-mark { width: 40px; height: 40px; flex-basis: 40px; border-radius: 14px; }
    .studio-focus h2 { font-size: 19px; }
    .studio-focus .btn { margin-left: 54px; }
    .card, .form-card, .page-content .card { padding: 20px; }
    .dash-grid .card { padding: 0; }
    .dash-video-body { padding: 19px; }
    .form-row { grid-template-columns: 1fr; gap: 0; }
    .form-auth { padding: 26px 22px; margin-block: 36px; }
    .table { font-size: 11px; }
    .table td, .table th { padding: 13px 7px; }
    .table .btn { font-size: 10px; padding: 8px; }
    .form-title { font-size: 19px; }
    .studio-shell > .nav { padding-inline: 13px; gap: 8px; }
    .studio-shell > .nav .nav-logo { font-size: 14px; gap: 7px; }
    .studio-shell > .nav .nav-logo-mark { width: 20px; }
    .studio-shell .nav-toggle { padding: 10px; }
    body[data-surface="marketing"] .nav { gap: 8px; padding-inline: 14px; }
    .nav--marketing .studio-top-preferences { width: 38px; height: 38px; flex-basis: 38px; border-radius: 13px; }
    .nav--marketing .nav-logo { font-size: 15px; gap: 7px; }
    .nav--marketing .nav-links { background: #292330f5; }
    .booking-page { padding-inline: 16px; }
    .booking-calendar { padding: 8px; gap: 4px; border-radius: 21px; }
    .cal-day { border-radius: 9px; font-size: 13px; }
    .cal-header { font-size: 9px; }
    .ev-hero { margin: 18px 12px; border-radius: 23px; }
    .studio-gallery .pick-count { font-size: 11px; }
    .studio-gallery .pick-save { padding-inline: 10px; font-size: 11px; }
    .studio-gallery .pick-mine { padding-inline: 8px; font-size: 10px; }
    .studio-gallery .pick-bar-inner { padding: 10px; gap: 6px; }
    .studio-gallery .pick-count > .icon { display: none; }
    .studio-gallery .gphoto-cell { border-radius: 13px; }
    .studio-gallery #galleryGrid .ph-like { width: 36px; height: 36px; }
    .studio-preferences { padding: 24px 20px; }
    .studio-preferences .gl-preference { gap: 10px; }
    .studio-preferences .gl-preference-copy strong { font-size: 13px; }
    .studio-preferences .gl-preference-copy small { font-size: 11px; }
    .studio-preferences .gl-preference .gl-switch { margin-left: 2px; }
}
html[data-glass="solid"] { --studio-surface: #28242f; --studio-blur: none; --studio-depth: 0 6px 22px #0004; }
html[data-glass="solid"] :is(.studio-rail,.studio-dock,.studio-preferences,.card,.form-card,.form-auth,.stat-card,.studio-focus,.studio-queue-card,.notif-menu,.studio-search,.booking-calendar,.timeline-section,.comments-panel) { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background: #28242f !important; }
html[data-glass="solid"] .studio-preferences::backdrop { -webkit-backdrop-filter: none; backdrop-filter: none; }
@media (prefers-reduced-transparency: reduce) {
    :root { --studio-surface: #28242f; --studio-blur: none; }
    :is(.studio-preferences,.studio-dock,.notif-menu) { background: #28242f; }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) { :root { --studio-surface: #28242f; } }
@media print { .studio-rail,.studio-dock,.studio-preferences,.nav { display: none !important; } .studio-shell { padding: 0; } body::before,body::after { display: none; } }
.studio-toolbar-context { color: var(--text-2); font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 45%; }
html:has(#studioPreferences[open]) { overflow: hidden; }
@media (max-width: 700px) { .studio-toolbar-context { display: none; } }

.studio-rail{overflow-y:auto}.studio-rail-links{flex:0 0 auto}.studio-rail-footer{flex-shrink:0;padding-top:20px}

/* Accessible labels and persistent notifications in the application toolbar. */
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.studio-notifications { position:static; display:inline-flex; margin-left:auto; }
.studio-notifications + .studio-top-preferences { margin-left:8px; }
.studio-notifications .notif-menu { position:absolute; top:calc(100% + 12px); right:0; left:auto; width:min(360px,calc(100vw - 40px)); margin:0; max-height:60dvh; overflow-y:auto; }
@media(max-width:1099px) { .studio-notifications .notif-menu { left:0; right:0; width:auto; max-width:none; } }
.studio-review-title { font:600 18px/1.4 var(--font-display); letter-spacing:-.025em; margin:0; }
.studio-review-heading { margin:20px 24px 0; }
.breadcrumb .studio-review-title { display:inline; }
@media(max-width:700px) { .studio-review-heading { margin:16px 14px 0; } .studio-review-title { font-size:16px; } }

/* The admin information architecture follows the two places being managed. */
.studio-nav-group { display:grid; gap:4px; margin-top:15px; }
.studio-nav-group > .studio-nav-label { margin:0 10px 4px; font:500 9px/1.4 var(--font-body); letter-spacing:.06em; text-transform:uppercase; }
.studio-menu-group { display:grid; gap:4px; }
.studio-menu-group + .studio-menu-group { margin-top:12px; }
.studio-menu-group > .studio-nav-label { margin:6px 10px; font-size:10px; text-transform:uppercase; }
.studio-admin-area { font-size:11px; color:var(--text-2); white-space:nowrap; }
.studio-admin-area ~ .studio-toolbar-context { display:none; }
.studio-area-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:28px; }
.studio-area-card { padding:24px; min-width:0; background:var(--studio-surface); border:1px solid var(--g-line); border-radius:var(--r-lg); box-shadow:var(--studio-depth); -webkit-backdrop-filter:var(--studio-blur); backdrop-filter:var(--studio-blur); }
.studio-area-title { display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.studio-area-title h2 { font:600 23px/1.2 var(--font-display); letter-spacing:-.04em; margin:0; }
.studio-area-card p { color:var(--text-2); font-size:12px; line-height:1.7; margin-bottom:20px; }
.studio-area-links { display:flex; flex-wrap:wrap; gap:8px; }
.studio-area-links a { display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:9px 12px; border:1px solid var(--g-line); border-radius:13px; font-size:11px; background:linear-gradient(145deg,#ffffff14,#ffffff03); box-shadow:inset 0 1px #ffffff20; }
.studio-area-links a:hover { border-color:var(--border-strong); color:#ffb9cd; }
.studio-section-intro { color:var(--text-2); font-size:13px; line-height:1.7; margin:-4px 0 24px; max-width:70ch; }
@media(max-width:700px) { .studio-area-cards { grid-template-columns:1fr; gap:14px; } .studio-area-card { padding:20px; } .studio-area-title h2 { font-size:22px; } .studio-admin-area { font-size:10px; max-width:42%; overflow:hidden; text-overflow:ellipsis; } }
@media(max-width:360px) { .studio-admin-area { display:none; } }
html[data-glass="solid"] .studio-area-card { background:#28242f; -webkit-backdrop-filter:none; backdrop-filter:none; }