html[data-glass="on"] {
  --gl-t: 238, 242, 236;                 
  --gl-grain: url(/app/img/chalk-dust.png?v=e71a00af88);

  --gl-clear-bg:
    linear-gradient(180deg, rgba(var(--gl-t), .15) 0%, rgba(var(--gl-t), .05) 46%, rgba(var(--gl-t), .085) 100%),
    linear-gradient(rgba(16, 20, 18, .36), rgba(16, 20, 18, .36));
  --gl-clear-fx: blur(6px) saturate(180%) brightness(1.16);
  --gl-clear-sh:
    inset 0 1px 0 rgba(255, 255, 255, .30),
    inset 0 0 0 1px rgba(var(--gl-t), .09),
    inset 0 12px 20px -14px rgba(255, 255, 255, .26),
    inset 0 -10px 16px -12px rgba(0, 0, 0, .35),
    inset 0 -1px 0 rgba(255, 224, 138, .16),
    0 14px 34px -10px rgba(0, 0, 0, .6),
    0 2px 6px rgba(0, 0, 0, .32);

  --gl-dust-bg:
    var(--gl-grain),
    linear-gradient(180deg, rgba(var(--gl-t), .13) 0%, rgba(30, 38, 34, .46) 30%, rgba(18, 22, 19, .58) 100%);
  --gl-dust-fx: blur(30px) saturate(160%) brightness(1.08);
  --gl-dust-sh:
    inset 0 1px 0 rgba(255, 255, 255, .26),
    inset 0 0 0 1px rgba(var(--gl-t), .08),
    inset 0 22px 30px -24px rgba(255, 255, 255, .20),
    0 24px 60px -16px rgba(0, 0, 0, .7),
    0 2px 8px rgba(0, 0, 0, .3);

  --gl-card-bg:
    linear-gradient(180deg, rgba(var(--gl-t), .105) 0%, rgba(var(--gl-t), .045) 34%, rgba(var(--gl-t), .03) 100%);
  --gl-card-sh:
    inset 0 1px 0 rgba(255, 255, 255, .20),
    inset 0 0 0 1px rgba(var(--gl-t), .07),
    inset 0 18px 26px -22px rgba(255, 255, 255, .16),
    0 12px 30px -16px rgba(0, 0, 0, .55);
  --gl-card-hover:
    linear-gradient(180deg, rgba(var(--gl-t), .15) 0%, rgba(var(--gl-t), .07) 34%, rgba(var(--gl-t), .05) 100%);

  
  --gl-in-bg: rgba(var(--gl-t), .085);
  --gl-in-sh: inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 0 0 1px rgba(var(--gl-t), .06);
  --gl-on-bg: linear-gradient(180deg, rgba(var(--gl-t), .30), rgba(var(--gl-t), .16));
  --gl-on-sh: inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 0 0 1px rgba(var(--gl-t), .18), 0 0 18px rgba(var(--gl-t), .14);
  --gl-on-fg: #ffffff;

  





  --gl-lens-bg: linear-gradient(180deg,
    color-mix(in srgb, var(--accent, #ffd166) 84%, #fff) 0%,
    color-mix(in srgb, var(--accent, #ffd166) 90%, #3d2f08) 48%,
    color-mix(in srgb, var(--accent, #ffd166) 82%, #3d2f08) 100%);
  --gl-lens-sh:
    inset 0 1px 0 rgba(255, 255, 255, .42),
    inset 0 -3px 6px -3px color-mix(in srgb, var(--accent, #ffd166) 40%, rgba(60, 30, 0, .45)),
    inset 0 0 0 1px rgba(255, 244, 210, .22),
    0 0 0 1px rgba(0, 0, 0, .18),
    0 6px 14px -8px color-mix(in srgb, var(--accent, #ffd166) 30%, rgba(0, 0, 0, .6));
  --gl-lens-fg: #2a1f00;

  --gl-scrim: rgba(8, 10, 9, .42);
  --gl-lamp: radial-gradient(120% 72% at 50% -10%, rgba(140, 170, 150, .22) 0%, rgba(140, 170, 150, .06) 40%, transparent 66%);
}


html[data-glass="on"][data-theme-mode="light"] {
  --gl-t: 255, 255, 255;
  --gl-clear-bg:
    linear-gradient(180deg, rgba(255, 255, 255, .78) 0%, rgba(255, 255, 255, .46) 46%, rgba(255, 255, 255, .58) 100%);
  --gl-clear-fx: blur(8px) saturate(170%);
  --gl-clear-sh:
    inset 0 1px 0 rgba(255, 255, 255, .95),
    inset 0 0 0 1px rgba(20, 40, 60, .07),
    inset 0 -8px 14px -10px rgba(20, 40, 60, .12),
    0 12px 30px -12px rgba(20, 40, 60, .28),
    0 1px 3px rgba(20, 40, 60, .12);
  --gl-dust-bg:
    var(--gl-grain),
    linear-gradient(180deg, rgba(255, 255, 255, .86) 0%, rgba(255, 255, 255, .70) 100%);
  --gl-dust-fx: blur(30px) saturate(150%);
  --gl-dust-sh:
    inset 0 1px 0 rgba(255, 255, 255, .95),
    inset 0 0 0 1px rgba(20, 40, 60, .07),
    0 24px 60px -18px rgba(20, 40, 60, .35),
    0 2px 8px rgba(20, 40, 60, .10);
  --gl-card-bg:
    linear-gradient(180deg, rgba(255, 255, 255, .80) 0%, rgba(255, 255, 255, .52) 100%);
  --gl-card-sh:
    inset 0 1px 0 rgba(255, 255, 255, .95),
    inset 0 0 0 1px rgba(20, 40, 60, .06),
    0 10px 26px -16px rgba(20, 40, 60, .30);
  --gl-card-hover:
    linear-gradient(180deg, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .70) 100%);
  --gl-in-bg: rgba(20, 40, 60, .055);
  --gl-in-sh: inset 0 1px 0 rgba(255, 255, 255, .7), inset 0 0 0 1px rgba(20, 40, 60, .06);
  --gl-on-bg: linear-gradient(180deg, rgba(20, 40, 60, .16), rgba(20, 40, 60, .10));
  --gl-on-sh: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 0 0 1px rgba(20, 40, 60, .16);
  --gl-on-fg: var(--text-primary, var(--text-1, #1a3550));
  --gl-scrim: rgba(30, 40, 50, .28);
  --gl-lens-fg: #2a1f00;
  --gl-lamp: radial-gradient(120% 72% at 50% -10%, rgba(255, 255, 255, .55) 0%, transparent 60%);
}


@media (prefers-reduced-transparency: reduce) {
  html[data-glass="on"] {
    --gl-clear-fx: none; --gl-dust-fx: none;
    --gl-clear-bg: var(--bg-elevated, #1d2420);
    --gl-dust-bg: var(--bg-elevated, #1d2420);
    --gl-card-bg: var(--bg-elevated, var(--card, #1d2420));
  }
}




html[data-glass="on"] :is(
  .rail, .rail-horizontal, .page-pill, .menu-btn, .record-btn, .zoom-hud,
  #comm-status, #comm-ptt, #comm-tts-toggle, #phone-pen-tab
),
html[data-glass="on"] body.phone-mode :is(#rail-right.rail, .page-pill, .menu-btn, #phone-pen-tab, #phone-type-pill),
html[data-glass="on"] body.live-on:not(.phone-mode) #phone-type-pill,
html[data-glass="on"] body:not(.phone-mode) #voice-live.active:not(.floating),
html[data-glass="on"] #voice-live.floating.active {
  background: var(--gl-clear-bg);
  -webkit-backdrop-filter: var(--gl-clear-fx);
  backdrop-filter: var(--gl-clear-fx);
  box-shadow: var(--gl-clear-sh);
  border-color: transparent;
}
html[data-glass="on"] .ph-tabbar {
  background: var(--gl-clear-bg) !important;
  -webkit-backdrop-filter: var(--gl-clear-fx);
  backdrop-filter: var(--gl-clear-fx);
  box-shadow: var(--gl-clear-sh);
  border-color: transparent !important;
}




html[data-glass="on"] :is(
  #sidebar, .settings-sheet, .menu-drawer, .login-card, #exit-fb-card,
  .chalk-dlg, .ctx-menu, .modal, .auth-card, .feature-paywall-card, .ct-card
),
html[data-glass="on"] body.phone-mode :is(.menu-drawer, #rail-top.rail-horizontal),
html[data-glass="on"] body.phone-mode.show-more-tools #rail-top,
html[data-glass="on"] body.live-on:not(.phone-mode) #ink-popover,
html[data-glass="on"] body.phone-home #account-panel .modal {
  background: var(--gl-dust-bg);
  -webkit-backdrop-filter: var(--gl-dust-fx);
  backdrop-filter: var(--gl-dust-fx);
  box-shadow: var(--gl-dust-sh);
  border-color: transparent;
}

html[data-glass="on"] :is(.modal-overlay, .settings-backdrop, .menu-backdrop, #exit-fb, .sidebar-backdrop, #phone-backdrop, .chalk-dlg-scrim) {
  background: var(--gl-scrim);
}




html[data-glass="on"] :is(
  .profile-card, .kpi, .activity-section, .lessons-list, .wb-card, .hb-tile, .hb-reco-card,
  .hb-empty-row, .hb-card, .hb-search, .progress-narrative, .progress-day-empty, .mastery-empty,
  .review-empty, .review-list li, .plan-card, .offer-plan, .offer-timeline div, .offer-trial-note, .theme-picker-card,
  .new-btn, .skeleton-card, .topic-block, .mastery-topic, .locked-panel, .lessons-locked, .upsell-card
),
html[data-glass="on"] body.phone-home :is(
  .kpi, .activity-section, .lessons-list, .wb-card, .topic-block, .mastery-topic,
  .locked-panel, .lessons-locked, .upsell-card, .feature-paywall-card
) {
  background: var(--gl-card-bg);
  box-shadow: var(--gl-card-sh);
  border-color: transparent;
}
html[data-glass="on"] body.phone-home .mode-pill {
  background: var(--gl-card-bg) !important;
  box-shadow: var(--gl-card-sh);
  border-color: transparent !important;
}
@media (hover: hover) {
  html[data-glass="on"] :is(.wb-card, .hb-tile, .hb-reco-card, .new-btn, .plan-card, .offer-plan):hover {
    background: var(--gl-card-hover);
  }
}

html[data-glass="on"] .kpi-strip { background: transparent; border-color: transparent; gap: 10px; }
html[data-glass="on"] .kpi { border-radius: var(--radius-md, 14px); }

html[data-glass="on"] :is(.plan-card.plan-lead, .offer-plan.on) {
  background:
    var(--gl-grain),
    linear-gradient(180deg, rgba(255, 209, 102, .20) 0%, rgba(255, 209, 102, .07) 40%, rgba(var(--gl-t), .03) 100%);
  box-shadow: var(--gl-card-sh), inset 0 0 0 1px rgba(255, 209, 102, .55), 0 14px 34px -14px rgba(255, 209, 102, .28);
}




html[data-glass="on"] :is(
  .seg-control, .setting-toggle-group, .menu-toggle-group, .settings-close-btn, .offer-back, .offer-close,
  #action-row button, #chat-input, #swatch-chip, .hb-tile-chip, .lesson-row .lesson-icon, .modal-actions .cancel,
  #crop-cancel, #phone-chat-row, #exit-fb-text, .nav-row .badge, .wb-folder-tag
),
html[data-glass="on"] body.live-on :is(#live-state, #live-mic),
html[data-glass="on"] body.live-on:not(.phone-mode) #swatch-chip,
html[data-glass="on"] body.phone-mode :is(#phone-type-send, .page-pill .page-plus, #rail-right #snapshot-btn),
html[data-glass="on"] :is(.modal, .auth-card, .login-card) input,
html[data-glass="on"] #beta-code-input {
  background: var(--gl-in-bg);
  box-shadow: var(--gl-in-sh);
  border-color: transparent;
}

html[data-glass="on"] :is(
  .tool-btn.active, .rail .tool-btn.active, .rail-horizontal .tool-btn.active, .seg-control button.active,
  .setting-toggle.active, .menu-toggle.active, .nav-row.active, .folder-item.active, #tts-btn.active
),
html[data-glass="on"] body.phone-mode :is(.rail .tool-btn.active, #rail-right .tool-btn.active),
html[data-glass="on"] body.phone-home .seg-control button.active,
html[data-glass="on"] body.phone-mode #action-row button.active {
  background: var(--gl-on-bg) !important;
  box-shadow: var(--gl-on-sh);
  color: var(--gl-on-fg);
  border-color: transparent;
}
html[data-glass="on"] .tool-btn.active::after { background: var(--gl-on-fg); }
html[data-glass="on"] :is(.nav-row.active, .folder-item.active)::before { background: rgba(var(--gl-t), .7); }
html[data-glass="on"][data-theme-mode="light"] :is(.nav-row.active, .folder-item.active)::before { background: rgba(20, 40, 60, .45); }

html[data-glass="on"][data-theme="whiteboard"] { --gl-lens-fg: #ffffff; }




html[data-glass="on"] :is(
  #send-btn, .offer-btn, .modal-actions .confirm, .auth-card button, .login-submit, .feature-paywall-cta,
  .plan-lead .plan-subscribe-btn, #crop-use, #exit-fb-send, #voice-stop, .chalk-dlg .ok:not(.danger),
  .hb-start-chip, .lessons-locked-cta, .ct-next
),
html[data-glass="on"] body.phone-mode :is(#send-btn, #snapshot-btn),
html[data-glass="on"] body.phone-mode #phone-type-pill #comm-node:not(.listening, .thinking, .sending, .speaking, .vocalizing) #comm-ptt,
html[data-glass="on"] body.phone-mode #phone-type-pill.has-text #phone-type-send,
html[data-glass="on"] body.live-on:not(.phone-mode) #phone-type-pill #phone-type-send,
html[data-glass="on"] body.live-on :is(#live-state.talking, #live-mic.talking),
html[data-glass="on"] body.live-on #live-state #live-talk.talking,
html[data-glass="on"] body.phone-home :is(.new-btn, .lessons-locked-cta, .feature-paywall-cta, .course-tab.active) {
  background: var(--gl-lens-bg);
  box-shadow: var(--gl-lens-sh);
  color: var(--gl-lens-fg);
  border-color: transparent;
}
html[data-glass="on"] body.phone-home .feature-paywall-cta { background: var(--gl-lens-bg) !important; }







html[data-glass="on"] body.glass-room {
  background:
    url(/app/img/ghost-chalk.svg?v=716cc677b2) 50% 0 / 760px auto repeat,
    radial-gradient(ellipse 70% 50% at 80% 0%, var(--accent-soft), transparent 60%),
    var(--bg);
}
html[data-glass="on"][data-theme-mode="light"] body.glass-room {
  background:
    url(/app/img/ghost-ink.svg?v=dab872936e) 50% 0 / 760px auto repeat,
    radial-gradient(ellipse 70% 50% at 80% 0%, var(--accent-soft), transparent 60%),
    var(--bg);
}

html[data-glass="on"] .sidebar {
  background: linear-gradient(180deg, rgba(var(--gl-t), .07) 0%, rgba(var(--gl-t), .025) 40%, rgba(var(--gl-t), .02) 100%);
  box-shadow: inset -1px 0 0 rgba(var(--gl-t), .09), inset 0 1px 0 rgba(255, 255, 255, .10);
  border-color: transparent;
}
html[data-glass="on"] .top-bar {
  background: linear-gradient(180deg, rgba(var(--gl-t), .06), rgba(var(--gl-t), .015));
  box-shadow: inset 0 -1px 0 rgba(var(--gl-t), .08);
  border-color: transparent;
}
html[data-glass="on"] body.phone-home .top-bar {
  background: var(--gl-clear-bg);
  -webkit-backdrop-filter: var(--gl-clear-fx);
  backdrop-filter: var(--gl-clear-fx);
  box-shadow: inset 0 -1px 0 rgba(var(--gl-t), .10), 0 10px 24px -14px rgba(0, 0, 0, .5);
}
html[data-glass="on"] body.phone-home #account-panel.modal-overlay { background: var(--bg, #151a17) !important; }


html[data-glass="on"] .hb-start {
  background: var(--gl-card-bg);
  box-shadow: var(--gl-card-sh), 0 18px 44px -24px rgba(255, 209, 102, .16);
  border-color: transparent;
  color: var(--text-1, #eef2ec);
}
html[data-glass="on"] .hb-start:hover { background: var(--gl-card-hover); }
html[data-glass="on"] .hb-start-chip { width: 52px; height: 52px; }
html[data-glass="on"] .hb-start-sub { color: var(--text-2, #c9d0c8); }
html[data-glass="on"] .hb-start-arrow { color: var(--text-2, #c9d0c8); }
html[data-glass="on"] .hb-avatar {
  background: var(--gl-on-bg); box-shadow: var(--gl-on-sh); color: var(--text-1, #eef2ec);
}
html[data-glass="on"] .hb-pill {
  background: var(--gl-in-bg); box-shadow: var(--gl-in-sh); border-color: transparent;
}
html[data-glass="on"] .wb-menu-btn {
  background: var(--gl-clear-bg); box-shadow: var(--gl-in-sh);
  -webkit-backdrop-filter: var(--gl-clear-fx); backdrop-filter: var(--gl-clear-fx);
}
html[data-glass="on"] .bar-graph .bar { background: rgba(var(--gl-t), .10); }
html[data-glass="on"][data-theme-mode="light"] .bar-graph .bar { background: rgba(20, 40, 60, .10); }
html[data-glass="on"] .bar-graph .bar.has-activity {
  background: var(--gl-lens-bg);   
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4);
}
html[data-glass="on"] .offer-pane[data-pane="plans"] .offer-foot { background: linear-gradient(to top, var(--bg) 40%, transparent); }








html[data-glass="on"][data-theme="chalkboard"] #paper-surface {
  background-image:
    radial-gradient(circle, var(--canvas-grid-color, rgba(255, 255, 255, 0.035)) 1px, transparent 1px),
    var(--gl-lamp);
  background-size: var(--canvas-grid-size, 28px) var(--canvas-grid-size, 28px), 100% var(--sheet-page-px, 100%);
  background-repeat: repeat, no-repeat;
}




@media (max-width: 700px) {
  html[data-glass="on"][data-theme="chalkboard"] #desk {
    background-image: var(--gl-lamp);
    background-repeat: no-repeat;
  }
  html[data-glass="on"][data-theme="chalkboard"] #paper-surface {
    background-color: transparent;
    background-image: radial-gradient(circle, var(--canvas-grid-color, rgba(255, 255, 255, 0.035)) 1px, transparent 1px);
    background-size: var(--canvas-grid-size, 28px) var(--canvas-grid-size, 28px);
    background-repeat: repeat;
  }
}
html[data-glass="on"] :is(.rail-sep, .rail-hsep) { background: rgba(var(--gl-t), .16); }
html[data-glass="on"][data-theme-mode="light"] :is(.rail-sep, .rail-hsep) { background: rgba(20, 40, 60, .12); }
html[data-glass="on"] #chat-input-area,
html[data-glass="on"] body.phone-mode #chat-input-area { background: rgba(var(--gl-t), .04); border-color: rgba(var(--gl-t), .08); }
html[data-glass="on"] .message.assistant { background: var(--gl-in-bg); box-shadow: var(--gl-in-sh); }
html[data-glass="on"] .message.user { background: var(--gl-on-bg); box-shadow: var(--gl-on-sh); color: var(--text-primary, #eef2ec); }


html[data-glass="on"] body[data-chalk-live="listening"] #phone-type-pill {
  box-shadow: var(--gl-clear-sh), inset 0 -14px 22px -12px rgba(255, 209, 102, .40), 0 18px 40px -12px rgba(255, 209, 102, .34);
}
html[data-glass="on"] body[data-chalk-live="speaking"] #phone-type-pill {
  box-shadow: var(--gl-clear-sh), inset 0 -14px 22px -12px rgba(126, 200, 227, .34), 0 18px 40px -12px rgba(126, 200, 227, .26);
}




html[data-glass="on"] :is(.opt, .chip, .lesson, .card),
html[data-glass="on"] .field input,
html[data-glass="on"] .feat .dot,
html[data-glass="on"] #back {
  background: var(--gl-card-bg);
  box-shadow: var(--gl-card-sh);
  border-color: transparent;
}
html[data-glass="on"] :is(.opt[aria-checked="true"], .chip[aria-pressed="true"]) {
  background:
    var(--gl-grain),
    linear-gradient(180deg, rgba(255, 209, 102, .20) 0%, rgba(255, 209, 102, .07) 40%, rgba(var(--gl-t), .03) 100%);
  box-shadow: var(--gl-card-sh), inset 0 0 0 1px rgba(255, 209, 102, .55);
}
html[data-glass="on"] .opt .ico { background: var(--gl-in-bg); box-shadow: var(--gl-in-sh); }
html[data-glass="on"] :is(.btn-primary, .card button[type="submit"], .opt[aria-checked="true"] .ico) {
  background: var(--gl-lens-bg);
  box-shadow: var(--gl-lens-sh);
  color: var(--gl-lens-fg);
  border-color: transparent;
}
html[data-glass="on"] .card input { background: var(--gl-in-bg); box-shadow: var(--gl-in-sh); border-color: transparent; }





html[data-glass="on"] #account-panel .modal > div[style*="border:1px solid"],
html[data-glass="on"] #account-panel .account-card {
  background: var(--gl-card-bg) !important;
  box-shadow: var(--gl-card-sh);
  border-color: transparent !important;
}
html[data-glass="on"] #ap-avatar {
  background: var(--gl-on-bg) !important; box-shadow: var(--gl-on-sh); color: var(--text-1, #eef2ec) !important;
}
html[data-glass="on"] .profile-card .avatar,
html[data-glass="on"] .profile-card [class*="avatar"] {
  background: var(--gl-on-bg); box-shadow: var(--gl-on-sh); color: var(--text-1, #eef2ec);
}






html[data-glass="on"] #lesson-panel {
  background: var(--gl-clear-bg) !important;
  -webkit-backdrop-filter: var(--gl-clear-fx) !important;
  backdrop-filter: var(--gl-clear-fx) !important;
  box-shadow: var(--gl-clear-sh) !important;
  border-color: transparent !important;
}
html[data-glass="on"] div[style*="background:var(--bg-glass-thick)"] {
  background: var(--gl-dust-bg) !important;
  -webkit-backdrop-filter: var(--gl-dust-fx) !important;
  backdrop-filter: var(--gl-dust-fx) !important;
  box-shadow: var(--gl-dust-sh) !important;
  border-color: transparent !important;
}
html[data-glass="on"] [data-voice] {
  background: var(--gl-in-bg) !important;
  box-shadow: var(--gl-in-sh);
}
html[data-glass="on"] [data-voice][style*="var(--accent"] {
  background: var(--gl-on-bg) !important;
  box-shadow: var(--gl-on-sh);
  border-color: transparent !important;
}
html[data-glass="on"] [data-preview] {
  background: var(--gl-in-bg) !important;
  box-shadow: var(--gl-in-sh);
  border-color: transparent !important;
}








html[data-glass="on"] :is(.field input, .card input, .modal input, .auth-card input, .login-card input,
  #beta-code-input, #exit-fb-text):focus {
  outline: 2px solid var(--accent, #ffd166);
  outline-offset: 2px;
}




html[data-glass="on"] :is(#chat-input, #phone-type-input):focus {
  outline: none;
}
html[data-glass="on"] .field input.bad {
  box-shadow: var(--gl-card-sh), inset 0 0 0 1.5px var(--bad, #ff6363);
}
html[data-glass="on"] .plan-card.plan-beta-tester {
  box-shadow: var(--gl-card-sh), inset 0 0 0 1px var(--teal, #3a6fb0);
}
html[data-glass="on"] #account-panel .modal > button[style*="border:1px solid var(--border)"],
html[data-glass="on"] #account-panel #ap-rate-app {
  background: var(--gl-card-bg) !important;
  box-shadow: var(--gl-card-sh);
  border-color: transparent !important;
}
@media (hover: hover) {
  html[data-glass="on"] :is(.offer-btn, .auth-card button, .login-submit, .modal-actions .confirm, .feature-paywall-cta,
    .plan-lead .plan-subscribe-btn, .ct-next, .btn-primary, #send-btn, #back):hover:not(:disabled),
  html[data-glass="on"] body.live-on :is(#live-state, #live-mic):hover,
  html[data-glass="on"] .bar-graph .bar:hover {
    filter: brightness(1.08);
  }
}
html[data-glass="on"] :is(.offer-btn, .auth-card button, .login-submit, .btn-primary):disabled { filter: saturate(.55) brightness(.8); }


















html[data-glass="on"] .seg-control button { position: relative; }
html[data-glass="on"] .seg-control button::after {
  content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 44px; transform: translateY(-50%);
}
html[data-glass="on"] body.phone-mode #back-home.menu-btn { width: 44px; height: 44px; }





@media (pointer: coarse) and (min-width: 701px) and (min-height: 600px) {
  html[data-glass="on"] body.live-on:not(.phone-mode) :is(.rail, .rail-horizontal) .tool-btn,
  html[data-glass="on"] body.live-on:not(.phone-mode) #swatch-chip { width: 44px; height: 44px; }
  html[data-glass="on"] body.live-on:not(.phone-mode) .menu-btn { width: 44px; height: 44px; }
  html[data-glass="on"] body.live-on:not(.phone-mode) #ink-popover .color-btn { width: 32px; height: 32px; }
}





html[data-glass="on"] body.phone-home #account-panel .modal { padding-left: 18px !important; padding-right: 18px !important; }
@media (max-width: 700px) {
  html[data-glass="on"] .offer-pane { padding-left: 18px; padding-right: 18px; }
}
html[data-glass="on"] body.phone-mode #rail-right.rail { left: 12px; right: 12px; }



html[data-glass="on"] .hb-start-chip { border-radius: 14px; }



html[data-glass="on"] :is(.kpi-label, .section-h, .bar-graph-axis .label, #account-plan, #ap-reset, #ap-hours-hint) { font-size: 11px !important; }