/* PCDoktor Mannheim – dedicated phone UI v2 (iOS + Android)
   Loaded only up to 900px. Desktop remains controlled by app.css. */
:root{
  --phone-safe-top:env(safe-area-inset-top,0px);
  --phone-safe-bottom:env(safe-area-inset-bottom,0px);
  --phone-header-h:58px;
  --phone-dock-h:70px;
  --phone-bg:#06101a;
  --phone-surface:#0b1926;
  --phone-surface-2:#102233;
  --phone-line:rgba(132,187,224,.16);
  --phone-line-strong:rgba(132,187,224,.26);
  --phone-text:#eff7fc;
  --phone-muted:#91aabd;
  --phone-blue:#4bb9f5;
  --phone-green:#38cf83;
  --phone-red:#ff6b7c;
  --phone-shadow:0 14px 38px rgba(0,0,0,.26);
}

html[data-phone-ui="1"][data-theme="light"]{
  --phone-bg:#eef5fb;
  --phone-surface:#ffffff;
  --phone-surface-2:#f4f8fc;
  --phone-line:rgba(34,89,139,.12);
  --phone-line-strong:rgba(34,89,139,.18);
  --phone-text:#10283d;
  --phone-muted:#60758a;
  --phone-blue:#0677d8;
  --phone-green:#0f9d58;
  --phone-shadow:0 16px 40px rgba(31,62,91,.10);
}

.mobile-app-dock,.mobile-install-banner,.mobile-install-sheet,.mobile-drawer-backdrop,.phone-app-header{display:none}

@media(max-width:900px){
  html[data-phone-ui="1"]{
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
    scroll-behavior:auto;
    background:var(--phone-bg);
  }
  html[data-phone-ui="1"] body{
    min-height:100dvh;
    overflow-x:hidden;
    overscroll-behavior-x:none;
    background:var(--phone-bg)!important;
    color:var(--phone-text);
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
  }
  html[data-phone-ui="1"] *,html[data-phone-ui="1"] *::before,html[data-phone-ui="1"] *::after{box-sizing:border-box}
  html[data-phone-ui="1"] img{max-width:100%;height:auto}
  html[data-phone-ui="1"] input,
  html[data-phone-ui="1"] select,
  html[data-phone-ui="1"] textarea{font-size:16px!important}
  html[data-phone-ui="1"] button,
  html[data-phone-ui="1"] .btn,
  html[data-phone-ui="1"] a.btn{touch-action:manipulation}
  html[data-phone-ui="1"] .container,
  html[data-phone-ui="1"] .narrow{width:100%!important;max-width:none!important;padding-inline:14px;margin-inline:0}

  /* Dedicated top bar */
  html[data-phone-ui="1"] .phone-app-header{
    position:fixed;z-index:92;left:0;right:0;top:0;
    display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;
    min-height:calc(var(--phone-header-h) + var(--phone-safe-top));
    padding:calc(6px + var(--phone-safe-top)) 12px 6px;
    border-bottom:1px solid var(--phone-line);
    background:rgba(6,16,26,.96);
    box-shadow:0 6px 22px rgba(0,0,0,.16)
  }
  html[data-phone-ui="1"][data-mobile-os="ios"] .phone-app-header{
    background:rgba(7,18,29,.88);
    -webkit-backdrop-filter:saturate(1.4) blur(14px);
    backdrop-filter:saturate(1.4) blur(14px)
  }
  .phone-app-header>button,.phone-header-actions>*{
    display:grid;place-items:center;width:42px;height:42px;min-height:42px;padding:0;border:1px solid var(--phone-line);border-radius:14px;background:var(--phone-surface);color:var(--phone-text);font:inherit
  }
  html[data-mobile-os="ios"] .phone-app-header>button,
  html[data-mobile-os="ios"] .phone-header-actions>*{border-radius:50%}
  .phone-app-header i{font-size:19px}
  .phone-app-brand{display:flex;align-items:center;gap:9px;min-width:0}
  .phone-app-brand .brand-mark{flex:0 0 40px;width:40px;height:40px;border-radius:13px;box-shadow:none}
  .phone-app-brand .brand-mark i{font-size:20px}.phone-app-brand .brand-mark em{width:17px;height:17px;right:-3px;top:-4px;font-size:11px}
  .phone-app-brand strong,.phone-app-brand small{display:block}.phone-app-brand strong{font-size:15px;letter-spacing:-.025em}.phone-app-brand small{margin-top:1px;color:var(--phone-muted);font-size:9px;text-transform:uppercase;letter-spacing:.12em;font-weight:800}
  .phone-header-actions{display:flex;gap:7px;justify-content:flex-end}
  .phone-public-header{grid-template-columns:minmax(0,1fr) auto}
  .phone-page-title{display:grid;min-width:0;text-align:center;line-height:1.08}
  .phone-page-title small{overflow:hidden;color:var(--phone-blue);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.08em;text-overflow:ellipsis;white-space:nowrap}
  .phone-page-title strong{overflow:hidden;margin-top:3px;font-size:14px;text-overflow:ellipsis;white-space:nowrap}
  .phone-header-bell{position:relative;display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--phone-line);border-radius:14px;background:var(--phone-surface)}
  .phone-header-bell b{position:absolute;right:-2px;top:-2px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:var(--phone-red);color:#fff;font-size:8px}

  /* Bottom app navigation */
  .mobile-app-dock{
    position:fixed;z-index:90;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:end;
    left:8px;right:8px;bottom:max(7px,var(--phone-safe-bottom));min-height:64px;padding:5px;
    border:1px solid var(--phone-line-strong);border-radius:22px;background:rgba(7,18,29,.96);box-shadow:0 16px 44px rgba(0,0,0,.38)
  }
  html[data-mobile-os="ios"] .mobile-app-dock{background:rgba(9,21,34,.84);-webkit-backdrop-filter:saturate(1.35) blur(16px);backdrop-filter:saturate(1.35) blur(16px)}
  html[data-mobile-os="android"] .mobile-app-dock{left:0;right:0;bottom:0;border-width:1px 0 0;border-radius:20px 20px 0 0;padding-bottom:max(5px,var(--phone-safe-bottom));background:#071521}
  .mobile-app-dock a,.mobile-app-dock button{
    position:relative;display:grid;place-items:center;align-content:center;gap:4px;min-width:0;min-height:54px;padding:4px 2px;border:0;border-radius:15px;background:transparent;color:var(--phone-muted);font:800 9px/1.05 Inter,system-ui,sans-serif;text-decoration:none
  }
  .mobile-app-dock i{font-size:20px;line-height:1}.mobile-app-dock span{overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap}
  .mobile-app-dock a.active{color:var(--phone-blue);background:rgba(75,185,245,.1)}
  .mobile-app-dock b{position:absolute;right:11%;top:3px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:var(--phone-red);color:#fff;font-size:8px}
  .mobile-app-dock .mobile-dock-primary{transform:translateY(-7px);color:#fff}
  .mobile-app-dock .mobile-dock-primary i{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,#178edb,#21bf78);box-shadow:0 8px 20px rgba(16,139,187,.3)}
  .mobile-app-dock .mobile-dock-primary.active{background:transparent}


  html[data-phone-ui="1"][data-theme="light"] .phone-app-header{
    background:rgba(255,255,255,.92);
    box-shadow:0 8px 28px rgba(31,62,91,.08);
  }
  html[data-phone-ui="1"][data-theme="light"][data-mobile-os="ios"] .phone-app-header{
    background:rgba(255,255,255,.84);
  }
  html[data-phone-ui="1"][data-theme="light"] .phone-app-brand strong,
  html[data-phone-ui="1"][data-theme="light"] .phone-page-title strong{color:#10283d}
  html[data-phone-ui="1"][data-theme="light"] .phone-app-brand small,
  html[data-phone-ui="1"][data-theme="light"] .mobile-install-copy small{color:#60758a}
  html[data-phone-ui="1"][data-theme="light"] .phone-app-header>button,
  html[data-phone-ui="1"][data-theme="light"] .phone-header-actions>* ,
  html[data-phone-ui="1"][data-theme="light"] .phone-header-bell{
    background:#f3f8fc;
    border-color:rgba(34,89,139,.14);
    color:#0a78d1;
  }
  html[data-phone-ui="1"][data-theme="light"] .mobile-app-dock{
    background:rgba(255,255,255,.94);
    border-color:rgba(34,89,139,.16);
    box-shadow:0 14px 34px rgba(31,62,91,.12);
  }
  html[data-phone-ui="1"][data-theme="light"][data-mobile-os="ios"] .mobile-app-dock{
    background:rgba(255,255,255,.84);
  }
  html[data-phone-ui="1"][data-theme="light"] .mobile-app-dock a,
  html[data-phone-ui="1"][data-theme="light"] .mobile-app-dock button{color:#5b7185}
  html[data-phone-ui="1"][data-theme="light"] .mobile-app-dock a.active{background:#e8f3fd;color:#0677d8}
  /* Remove desktop chrome before first paint */
  html[data-phone-ui="1"][data-site-zone="public"] .site-header{display:none!important}
  html[data-phone-ui="1"][data-site-zone="public"] .floating-wa{display:none!important}
  html[data-phone-ui="1"][data-site-zone="public"] .page-main,
  html[data-phone-ui="1"][data-site-zone="public"] .glass-site,
  html[data-phone-ui="1"][data-site-zone="public"] .premium-site{
    margin-top:calc(var(--phone-header-h) + var(--phone-safe-top));
    padding-bottom:calc(var(--phone-dock-h) + var(--phone-safe-bottom) + 34px)
  }

  /* Portal/admin canvas */
  html[data-phone-ui="1"][data-site-zone="customer"] .dash-layout,
  html[data-phone-ui="1"][data-site-zone="admin"][data-admin-style="admin-classic"] .dash-layout{display:block!important;min-height:100dvh;padding:0!important;background:var(--phone-bg)!important}
  html[data-phone-ui="1"][data-site-zone="customer"] .dash-main,
  html[data-phone-ui="1"][data-site-zone="admin"][data-admin-style="admin-classic"] .dash-main{
    width:100%;min-width:0;min-height:100dvh;overflow:visible!important;
    padding:calc(var(--phone-header-h) + var(--phone-safe-top) + 14px) 12px calc(var(--phone-dock-h) + var(--phone-safe-bottom) + 22px)!important
  }
  html[data-phone-ui="1"][data-site-zone="customer"] .dash-sidebar,
  html[data-phone-ui="1"][data-site-zone="admin"][data-admin-style="admin-classic"] .dash-sidebar{
    position:fixed!important;z-index:110!important;inset:0 auto 0 0!important;width:min(88vw,340px)!important;height:100dvh!important;max-height:none!important;
    padding-top:max(16px,var(--phone-safe-top))!important;padding-bottom:max(18px,var(--phone-safe-bottom))!important;overflow-y:auto!important;
    transform:translate3d(-108%,0,0);transition:transform .2s ease;background:#081725!important;box-shadow:22px 0 55px rgba(0,0,0,.46)!important
  }
  body.mobile-drawer-open{overflow:hidden}
  body.mobile-drawer-open .dash-sidebar{transform:translate3d(0,0,0)!important}
  .mobile-drawer-backdrop{position:fixed;z-index:105;inset:0;border:0;background:rgba(0,7,14,.64)}
  body.mobile-drawer-open .mobile-drawer-backdrop{display:block}

  /* Liquid admin: retain its dedicated nav but remove expensive desktop glass on phones */
  html[data-phone-ui="1"][data-site-zone="admin"][data-admin-style="admin-liquid-glass-beta"] .dash-main{
    width:100%!important;min-width:0!important;padding:calc(66px + var(--phone-safe-top)) 12px calc(82px + var(--phone-safe-bottom))!important
  }
  html[data-phone-ui="1"][data-site-zone="admin"][data-admin-style="admin-liquid-glass-beta"] .liquid-admin-mobile-head{
    top:0!important;left:0!important;right:0!important;min-height:calc(58px + var(--phone-safe-top))!important;padding:calc(6px + var(--phone-safe-top)) 12px 6px!important;border-radius:0!important;border-width:0 0 1px!important;background:rgba(7,18,29,.96)!important;box-shadow:0 6px 22px rgba(0,0,0,.16)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important
  }
  html[data-mobile-os="ios"][data-phone-ui="1"][data-site-zone="admin"][data-admin-style="admin-liquid-glass-beta"] .liquid-admin-mobile-head{background:rgba(7,18,29,.88)!important;-webkit-backdrop-filter:saturate(1.35) blur(14px)!important;backdrop-filter:saturate(1.35) blur(14px)!important}
  html[data-phone-ui="1"][data-site-zone="admin"][data-admin-style="admin-liquid-glass-beta"] .liquid-admin-mobile-dock{
    left:8px!important;right:8px!important;bottom:max(7px,var(--phone-safe-bottom))!important;border-radius:22px!important;background:rgba(7,18,29,.96)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important
  }
  html[data-mobile-os="android"][data-phone-ui="1"][data-site-zone="admin"][data-admin-style="admin-liquid-glass-beta"] .liquid-admin-mobile-dock{left:0!important;right:0!important;bottom:0!important;border-radius:20px 20px 0 0!important;padding-bottom:max(5px,var(--phone-safe-bottom))!important}

  /* Global mobile content rhythm */
  html[data-phone-ui="1"] .dash-top{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin:0 0 14px!important;align-items:start!important}
  html[data-phone-ui="1"] .dash-top h1{margin:4px 0 0!important;font-size:26px!important;line-height:1.05!important;letter-spacing:-.045em!important}
  html[data-phone-ui="1"] .dash-lead,.dash-subtitle{margin-top:6px!important;font-size:13px!important;line-height:1.45!important}
  html[data-phone-ui="1"] .section-kicker{min-height:24px!important;padding:0 10px!important;font-size:9px!important;letter-spacing:.09em!important}
  html[data-phone-ui="1"] .dash-top-actions,
  html[data-phone-ui="1"] .dashboard-quick-create{
    display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;gap:8px!important;max-width:100%;overflow-x:auto;padding:2px 1px 4px;scrollbar-width:none;scroll-snap-type:x proximity
  }
  html[data-phone-ui="1"] .dash-top-actions::-webkit-scrollbar,
  html[data-phone-ui="1"] .dashboard-quick-create::-webkit-scrollbar{display:none}
  html[data-phone-ui="1"] .dash-top-actions .btn,
  html[data-phone-ui="1"] .dashboard-quick-create .btn{flex:0 0 auto;min-height:40px!important;padding:0 13px!important;border-radius:12px!important;font-size:11px!important;box-shadow:none!important;scroll-snap-align:start}

  html[data-phone-ui="1"] .panel{
    width:100%;min-width:0;margin-bottom:12px!important;padding:15px!important;border:1px solid var(--phone-line)!important;border-radius:18px!important;background:var(--phone-surface)!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important
  }
  html[data-phone-ui="1"] .panel-head{gap:10px!important;margin-bottom:13px!important}
  html[data-phone-ui="1"] .panel-head h2{margin-top:5px!important;font-size:20px!important;line-height:1.08!important;letter-spacing:-.035em!important}
  html[data-phone-ui="1"] .panel-icon{flex:0 0 40px!important;width:40px!important;height:40px!important;border-radius:12px!important;font-size:19px!important}
  html[data-phone-ui="1"] .count-badge{min-width:36px!important;height:36px!important;padding:0 9px!important;border-radius:11px!important;font-size:16px!important}
  html[data-phone-ui="1"] .helper-text{font-size:12px!important;line-height:1.5!important}
  html[data-phone-ui="1"] .empty-state{padding:28px 12px!important}

  /* Forms are phone-native, never desktop grids */
  html[data-phone-ui="1"] :where(.form-grid,.filter-grid,.three-cols,.profile-grid,.detail-grid,.customer-admin-grid,.message-detail-grid,.settings-grid,.content-admin-grid,.request-workspace,.customer-request-grid,.account-grid,.report-grid-two,.workshop-tools-grid,.document-finance-grid,.appointment-change-grid){grid-template-columns:1fr!important;gap:11px!important}
  html[data-phone-ui="1"] .form{gap:12px!important}
  html[data-phone-ui="1"] .form label{gap:6px!important;font-size:11px!important}
  html[data-phone-ui="1"] .form input,
  html[data-phone-ui="1"] .form select,
  html[data-phone-ui="1"] .form textarea{
    min-height:46px!important;padding:11px 12px!important;border-radius:13px!important;border-color:var(--phone-line-strong)!important;background:#07131f!important;color:var(--phone-text)!important;box-shadow:none!important
  }
  html[data-phone-ui="1"] .form textarea{min-height:110px!important}
  html[data-phone-ui="1"] .btn{min-height:44px!important;padding:0 15px!important;border-radius:13px!important;font-size:12px!important;box-shadow:none!important}
  html[data-phone-ui="1"] .btn.small{min-height:38px!important;padding:0 11px!important;font-size:10px!important}
  html[data-phone-ui="1"] .row-actions{display:flex!important;flex-wrap:wrap!important;gap:7px!important}
  html[data-phone-ui="1"] .icon-action{width:40px!important;height:40px!important;border-radius:12px!important}
  html[data-phone-ui="1"] .check{align-items:flex-start!important}

  /* Filters feel like a mobile control surface */
  html[data-phone-ui="1"] .filter-form{padding:12px!important;border-radius:16px!important}
  html[data-phone-ui="1"] .filter-form .filter-search{grid-column:1/-1!important}
  html[data-phone-ui="1"] .filter-actions{display:flex!important;gap:8px!important;overflow-x:auto;scrollbar-width:none}
  html[data-phone-ui="1"] .filter-actions>*{flex:0 0 auto}

  /* Mobile tables become readable record cards. JS adds data-label from TH text. */
  html[data-phone-ui="1"] .table-wrap.phone-table-ready{overflow:visible!important;border:0!important;background:transparent!important}
  html[data-phone-ui="1"] .phone-table-ready .data-table{display:block!important;width:100%!important;min-width:0!important;overflow:visible!important;border:0!important}
  html[data-phone-ui="1"] .phone-table-ready .data-table thead{display:none!important}
  html[data-phone-ui="1"] .phone-table-ready .data-table tbody{display:grid!important;gap:10px!important;width:100%!important}
  html[data-phone-ui="1"] .phone-table-ready .data-table tbody tr{
    display:grid!important;grid-template-columns:1fr!important;gap:0!important;width:100%!important;overflow:hidden!important;border:1px solid var(--phone-line)!important;border-radius:16px!important;background:var(--phone-surface-2)!important;box-shadow:none!important
  }
  html[data-phone-ui="1"] .phone-table-ready .data-table tbody td{
    display:grid!important;grid-template-columns:minmax(92px,34%) minmax(0,1fr)!important;align-items:center!important;gap:10px!important;width:100%!important;min-width:0!important;min-height:42px!important;padding:9px 11px!important;border:0!important;border-bottom:1px solid rgba(132,187,224,.10)!important;white-space:normal!important;word-break:break-word!important;text-align:left!important
  }
  html[data-phone-ui="1"] .phone-table-ready .data-table tbody td:last-child{border-bottom:0!important}
  html[data-phone-ui="1"] .phone-table-ready .data-table tbody td::before{content:attr(data-label);color:var(--phone-muted);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.06em}
  html[data-phone-ui="1"] .phone-table-ready .data-table tbody td[data-label=""]::before,
  html[data-phone-ui="1"] .phone-table-ready .data-table tbody td[colspan]::before{display:none}
  html[data-phone-ui="1"] .phone-table-ready .data-table tbody td[colspan]{display:block!important;padding:16px!important;text-align:center!important}
  html[data-phone-ui="1"] .phone-table-ready .data-table .row-actions{justify-content:flex-start!important}
  html[data-phone-ui="1"] .phone-table-ready .data-table .status{justify-self:start}

  /* Dashboard numbers: compact 2-up cards rather than a long desktop list */
  html[data-phone-ui="1"] :where(.action-center-grid,.stat-grid,.portal-stat-grid,.appointment-stat-grid,.task-stat-grid){grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  html[data-phone-ui="1"] .action-center-card{min-height:108px!important;padding:12px!important;border-radius:16px!important;gap:9px!important}
  html[data-phone-ui="1"] .action-center-card>i{width:36px!important;height:36px!important;border-radius:11px!important;font-size:17px!important}
  html[data-phone-ui="1"] .action-center-card strong{font-size:25px!important}
  html[data-phone-ui="1"] .action-center-card em{font-size:9px!important;line-height:1.25!important}
  html[data-phone-ui="1"] .stat-card,
  html[data-phone-ui="1"] .portal-stat-card,
  html[data-phone-ui="1"] .appointment-stat,
  html[data-phone-ui="1"] .task-stat-card{min-height:86px!important;padding:12px!important;border-radius:15px!important;box-shadow:none!important}
  html[data-phone-ui="1"] .dashboard-work-grid{grid-template-columns:1fr!important;gap:12px!important}
  html[data-phone-ui="1"] .stack-panels{gap:12px!important}

  /* Lists and detail screens */
  html[data-phone-ui="1"] .request-summary-card{grid-template-columns:36px minmax(0,1fr) 16px!important;gap:9px!important;padding:11px!important;border-radius:15px!important}
  html[data-phone-ui="1"] .request-summary-icon{width:36px!important;height:36px!important;border-radius:11px!important}
  html[data-phone-ui="1"] .request-summary-copy h3{font-size:13px!important;line-height:1.3!important}
  html[data-phone-ui="1"] .request-summary-copy p,
  html[data-phone-ui="1"] .request-summary-copy small{font-size:10px!important}
  html[data-phone-ui="1"] .detail-list{margin:7px 0 14px!important}
  html[data-phone-ui="1"] .detail-list div{grid-template-columns:1fr!important;gap:3px!important;padding:9px 0!important}
  html[data-phone-ui="1"] .detail-list dt{font-size:9px!important;text-transform:uppercase;letter-spacing:.06em}
  html[data-phone-ui="1"] .detail-list dd{font-size:13px!important}
  html[data-phone-ui="1"] .message-full{min-height:0!important;padding:13px!important;border-radius:14px!important;font-size:13px!important;line-height:1.55!important}
  html[data-phone-ui="1"] .timeline article{padding-left:16px!important}
  html[data-phone-ui="1"] .qr-preview{grid-template-columns:92px minmax(0,1fr)!important;gap:12px!important}
  html[data-phone-ui="1"] .qr-preview img{width:92px!important;height:92px!important;border-radius:14px!important}
  html[data-phone-ui="1"] .signature-pad-wrap canvas{width:100%!important;max-width:100%!important}
  html[data-phone-ui="1"] .conversation-message{max-width:92%!important}
  html[data-phone-ui="1"] .money-summary{grid-template-columns:1fr!important}

  /* Appointments */
  html[data-phone-ui="1"] .appointment-day-heading{position:sticky!important;top:calc(var(--phone-header-h) + var(--phone-safe-top));z-index:8;padding:9px 0!important;background:var(--phone-bg)!important}
  html[data-phone-ui="1"] .appointment-list-card{grid-template-columns:74px minmax(0,1fr)!important;gap:9px!important;padding:11px!important;border-radius:15px!important}
  html[data-phone-ui="1"] .appointment-actions{grid-column:1/-1!important;display:flex!important;gap:7px!important;overflow-x:auto!important}
  html[data-phone-ui="1"] .appointment-actions>*{flex:0 0 auto}

  /* Kanban remains horizontal by design, but optimized for one-handed swiping */
  html[data-phone-ui="1"] .kanban-main{padding-inline:8px!important}
  html[data-phone-ui="1"] .kanban-filter{grid-template-columns:1fr!important;gap:8px!important}
  html[data-phone-ui="1"] .kanban-board{grid-auto-columns:min(84vw,340px)!important;gap:10px!important;padding-bottom:12px!important;scroll-snap-type:x mandatory!important}
  html[data-phone-ui="1"] .kanban-column{min-height:470px!important;border-radius:17px!important;scroll-snap-align:center!important}
  html[data-phone-ui="1"] .kanban-mobile-form{display:grid!important}

  /* Public website becomes a purpose-built mobile landing experience */
  html[data-phone-ui="1"][data-site-zone="public"] .glass-liquid-orb,
  html[data-phone-ui="1"][data-site-zone="public"] .premium-orb,
  html[data-phone-ui="1"][data-site-zone="public"] .glass-float{display:none!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-hero{
    min-height:0!important;padding:24px 0 20px!important;background:linear-gradient(180deg,#081827,#06101a)!important
  }
  html[data-phone-ui="1"][data-site-zone="public"] .glass-hero-grid{display:block!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-hero-copy{padding:0 14px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-hero-copy h1{margin:14px 0 12px!important;font-size:clamp(35px,11vw,48px)!important;line-height:.98!important;letter-spacing:-.06em!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-hero-copy p{font-size:14px!important;line-height:1.55!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-eyebrow{font-size:9px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-hero-visual{display:none!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:18px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-btn{min-height:46px!important;padding:0 12px!important;border-radius:14px!important;font-size:11px!important;justify-content:center!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-trust-row{display:flex!important;flex-wrap:nowrap!important;gap:7px!important;margin-top:14px!important;overflow-x:auto!important;scrollbar-width:none!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-trust-row span{flex:0 0 auto!important;padding:8px 10px!important;border:1px solid var(--phone-line)!important;border-radius:999px!important;background:var(--phone-surface)!important;font-size:9px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-section{padding:30px 0!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-section-soft{background:#081521!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-section-heading{display:grid!important;gap:10px!important;padding-inline:14px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-section-heading h2,
  html[data-phone-ui="1"][data-site-zone="public"] .glass-process-layout h2,
  html[data-phone-ui="1"][data-site-zone="public"] .glass-faq-layout h2{font-size:28px!important;line-height:1.05!important}
  html[data-phone-ui="1"][data-site-zone="public"] :where(.glass-service-overview,.glass-process-layout,.glass-review-grid,.glass-faq-layout){grid-template-columns:1fr!important;gap:11px!important;padding-inline:14px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-service-card,
  html[data-phone-ui="1"][data-site-zone="public"] .glass-review-grid article,
  html[data-phone-ui="1"][data-site-zone="public"] .glass-process-list article,
  html[data-phone-ui="1"][data-site-zone="public"] .glass-faq-list details{border-radius:17px!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-service-card{min-height:0!important;padding:17px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-service-card h3{font-size:19px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-service-card p{font-size:12px!important;line-height:1.5!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-process-layout{gap:18px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-process-list article{padding:14px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-review-grid p{min-height:0!important;font-size:13px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-final-card{margin:0 14px!important;padding:22px 18px!important;border-radius:22px!important;box-shadow:none!important}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-final-card .glass-actions{width:100%!important}
  html[data-phone-ui="1"][data-site-zone="public"] .site-footer{padding:28px 0 calc(94px + var(--phone-safe-bottom))!important;background:#050e17!important}
  html[data-phone-ui="1"][data-site-zone="public"] .footer-grid{grid-template-columns:1fr!important;gap:15px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .footer-grid>div:first-child{display:none!important}
  html[data-phone-ui="1"][data-site-zone="public"] .footer-grid h3{margin-bottom:7px!important;font-size:13px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .footer-grid p{margin:5px 0!important;font-size:11px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .footer-bottom{margin-top:16px!important;font-size:10px!important}

  /* Auth/public forms */
  html[data-phone-ui="1"][data-site-zone="public"] .auth-main{padding:22px 0 calc(95px + var(--phone-safe-bottom))!important}
  html[data-phone-ui="1"][data-site-zone="public"] .auth-grid,
  html[data-phone-ui="1"][data-site-zone="public"] .contact-grid{grid-template-columns:1fr!important;gap:12px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .auth-copy{padding:0 2px!important}
  html[data-phone-ui="1"][data-site-zone="public"] .auth-copy h1{margin:11px 0 9px!important;font-size:34px!important;line-height:1!important}
  html[data-phone-ui="1"][data-site-zone="public"] .auth-copy p{font-size:13px!important;line-height:1.5!important}

  /* Cookie UI does not cover the whole phone */
  html[data-phone-ui="1"] .cookie-banner{left:8px!important;right:8px!important;bottom:calc(var(--phone-dock-h) + var(--phone-safe-bottom) + 12px)!important;display:grid!important;grid-template-columns:36px minmax(0,1fr)!important;gap:9px!important;padding:12px!important;border-radius:18px!important}
  html[data-phone-ui="1"] .cookie-banner[hidden],html[data-phone-ui="1"] .cookie-modal[hidden]{display:none!important}
  html[data-phone-ui="1"] .cookie-banner-copy h2{font-size:15px!important}
  html[data-phone-ui="1"] .cookie-banner-copy p{font-size:10px!important;line-height:1.45!important}
  html[data-phone-ui="1"] .cookie-banner-actions{grid-column:1/-1!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important}
  html[data-phone-ui="1"] .cookie-banner-actions .cookie-btn:first-child{display:none!important}
  html[data-phone-ui="1"] .cookie-dialog{width:calc(100% - 14px)!important;max-height:calc(100dvh - var(--phone-safe-top) - var(--phone-safe-bottom) - 14px)!important;padding:16px!important;border-radius:22px!important}
  html[data-phone-ui="1"] .cookie-category{min-height:76px!important;padding:11px!important}

  /* Install prompt */
  .mobile-install-banner{
    position:fixed;z-index:130;left:8px;right:8px;bottom:calc(var(--phone-dock-h) + var(--phone-safe-bottom) + 12px);
    grid-template-columns:40px minmax(0,1fr) auto 30px;align-items:center;gap:8px;padding:9px;
    border:1px solid var(--phone-line-strong);border-radius:18px;background:#0a1a28;color:var(--phone-text);box-shadow:var(--phone-shadow)
  }
  .mobile-install-banner.is-visible{display:grid}
  html[data-site-zone="admin"][data-admin-style="admin-liquid-glass-beta"] .mobile-install-banner{bottom:calc(78px + var(--phone-safe-bottom))}
  .mobile-install-icon{display:grid;place-items:center;width:40px;height:40px;overflow:hidden;border-radius:12px;background:#020914}
  .mobile-install-icon img{width:100%;height:100%;object-fit:cover}
  .mobile-install-copy{display:grid;gap:2px;min-width:0}.mobile-install-copy strong{font-size:11px}.mobile-install-copy small{color:var(--phone-muted);font-size:8px;line-height:1.3}
  .mobile-install-primary{min-height:34px!important;padding:0 10px;border:1px solid rgba(75,185,245,.32);border-radius:11px;background:rgba(75,185,245,.12);color:#e9f8ff;font-weight:850;font-size:9px}
  .mobile-install-close{display:grid;place-items:center;width:30px;height:30px!important;min-height:30px!important;border:0;border-radius:10px;background:transparent;color:var(--phone-muted)}
  .mobile-install-sheet.is-visible{position:fixed;z-index:150;inset:0;display:block}
  .mobile-sheet-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(0,6,13,.66)}
  .mobile-sheet-card{position:absolute;left:7px;right:7px;bottom:max(7px,var(--phone-safe-bottom));padding:9px 14px 18px;border:1px solid var(--phone-line-strong);border-radius:25px;background:#0a1a28;color:var(--phone-text);box-shadow:0 24px 70px rgba(0,0,0,.52)}
  .mobile-sheet-handle{display:block;width:40px;height:5px;margin:0 auto 11px;border-radius:999px;background:rgba(255,255,255,.2)}
  .mobile-sheet-head{display:grid;grid-template-columns:40px 1fr 36px;align-items:center;gap:9px}.mobile-sheet-head>div:nth-child(2){display:grid;gap:2px}.mobile-sheet-head small{color:var(--phone-blue);font-size:8px;font-weight:850;text-transform:uppercase}.mobile-sheet-head strong{font-size:13px}.mobile-sheet-head>button{display:grid;place-items:center;width:36px;height:36px;min-height:36px;border:0;border-radius:11px;background:var(--phone-surface-2);color:var(--phone-text)}
  .mobile-ios-steps{display:grid;gap:8px;margin:14px 0 0;padding:0;list-style:none}.mobile-ios-steps li{display:grid;grid-template-columns:36px 1fr;align-items:center;gap:9px;padding:10px;border:1px solid var(--phone-line);border-radius:14px;background:var(--phone-surface)}.mobile-ios-steps li>span{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:rgba(75,185,245,.1);color:var(--phone-blue);font-size:17px}.mobile-ios-steps li>div{display:grid;gap:2px}.mobile-ios-steps strong{font-size:11px}.mobile-ios-steps small{color:var(--phone-muted);font-size:9px;line-height:1.35}
  body.mobile-sheet-open{overflow:hidden}
  body.phone-keyboard-open .mobile-app-dock,
  body.phone-keyboard-open .liquid-admin-mobile-dock,
  body.phone-keyboard-open .mobile-install-banner{transform:translateY(140%)!important;opacity:0!important;pointer-events:none!important}


  /* For now the install banner stays hidden on phones to avoid covering content. */
  html[data-phone-ui="1"] .mobile-install-banner{display:none!important}
  html[data-phone-ui="1"] .mobile-install-banner.is-visible{display:none!important}
  html[data-phone-ui="1"] .mobile-install-sheet.is-visible{display:block}

  /* Safari can reserve too much space with content-visibility on card sections. */
  html[data-phone-ui="1"][data-site-zone="public"] .glass-section,
  html[data-phone-ui="1"][data-site-zone="public"] .premium-section{
    content-visibility:visible!important;
    contain-intrinsic-size:auto!important;
  }

  html[data-phone-ui="1"] :where(.glass-device-window,.glass-service-card,.glass-review-grid article,.panel,.action-center-card){transition:none!important}
}

@media(max-width:520px){
  html[data-phone-ui="1"] :where(.action-center-grid,.stat-grid,.portal-stat-grid,.appointment-stat-grid,.task-stat-grid){grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html[data-phone-ui="1"] .filter-grid{grid-template-columns:1fr!important}
  html[data-phone-ui="1"] .mobile-install-copy small{display:none}
  html[data-phone-ui="1"] .mobile-install-banner{grid-template-columns:38px minmax(0,1fr) auto}.mobile-install-close{display:none}
  html[data-phone-ui="1"][data-site-zone="public"] .glass-actions{grid-template-columns:1fr!important}
}

@media(max-width:370px){
  html[data-phone-ui="1"] :where(.action-center-grid,.stat-grid,.portal-stat-grid,.appointment-stat-grid,.task-stat-grid){grid-template-columns:1fr!important}
  .mobile-app-dock a,.mobile-app-dock button{font-size:8px}
  .mobile-app-dock i{font-size:18px}
}

@media(prefers-reduced-motion:reduce){
  html[data-phone-ui="1"] *,html[data-phone-ui="1"] *::before,html[data-phone-ui="1"] *::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}