/* Intentionally inert on desktop/iPad. Only the phone controller enables this scope. */
#phone-workspace[hidden], #phone-sheet[hidden], #phone-workspace [hidden] { display:none !important; }
.phone-plan-edit { display:none; }
.phone-layout { --phone-height:100dvh; --phone-top:0px; --phone-keyboard:0px; --phone-reserve:0px; --phone-dock:calc(62px + env(safe-area-inset-bottom,0px)); }
.phone-layout, .phone-layout body { height:100%; overflow:hidden; overscroll-behavior:none; }
.phone-layout body > header, .phone-layout body > main, .phone-layout body > footer, .phone-layout .secondary-content, .phone-layout .sidebar-drawer-toggle { display:none !important; }
.phone-layout #phone-workspace { position:fixed; inset:var(--phone-top) 0 auto; height:var(--phone-height); z-index:40; display:flex; flex-direction:column; background:var(--bg-primary); color:var(--color-text-primary); overflow:hidden; }
.phone-layout .phone-header { flex:none; background:var(--bg-secondary); border-bottom:1px solid var(--border-glass-active); padding:0 12px 8px; padding-top:env(safe-area-inset-top,0px); }
.phone-layout .phone-top { display:flex; align-items:center; justify-content:space-between; height:44px; }
.phone-layout .logo-container { gap:8px; }
.phone-layout .nutramedix-mark { width:26px; height:26px; border-radius:7px; }
.phone-layout .bioesthetic-wordmark { font-size:19px; }
.phone-layout .logo-tag { display:none; }
.phone-layout .phone-settings { width:44px; height:44px; display:grid; place-items:center; background:none; color:var(--color-text-secondary); border:0; border-radius:10px; }
.phone-layout .phone-choices { display:flex; align-items:center; gap:8px; }
.phone-layout #phone-model { flex:0 0 auto; }
.phone-layout .anatomy-variant-switch { padding:2px; border-radius:10px; }
.phone-layout .anatomy-variant-btn { font-size:13px; padding:8px; min-height:42px; }
.phone-layout .anatomy-variant-status { position:absolute; top:98px; left:8px; font-size:12px; z-index:9; background:var(--bg-secondary); }
.phone-layout #phone-mode { flex:1; min-width:0; }
.phone-layout .mode-tabs { display:flex; margin:0; padding:2px; gap:2px; border-radius:10px; }
.phone-layout .mode-btn { min-height:42px; flex:1; gap:0; padding:6px; font-size:13px; white-space:normal; border-radius:7px; }
.phone-layout .mode-btn svg { display:none; }
.phone-layout #phone-stage { position:relative; flex:1; min-height:60px; margin-bottom:var(--phone-reserve); overflow:hidden; }
.phone-layout #visualizer-view { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; min-height:0 !important; max-height:none !important; margin:0 !important; padding:0 !important; border:0; border-radius:0; }
.phone-layout #canvas-holder { position:absolute; inset:0; width:100%; height:100%; }
.phone-layout #canvas-holder canvas { display:block; width:100% !important; height:100% !important; touch-action:none; }
.phone-layout .visualizer-toolbar, .phone-layout .legend-card { display:none !important; }
.phone-layout .phone-stage-actions { position:absolute; z-index:8; right:8px; top:8px; }
.phone-layout #btn-reset-cam { width:44px; height:44px; border:1px solid var(--border-glass-active); background:var(--bg-glass); border-radius:12px; }
.phone-layout .phone-hint { position:absolute; z-index:7; bottom:9px; left:0; right:0; text-align:center; pointer-events:none; font-size:12px; color:var(--color-text-secondary); margin:0; text-shadow:0 1px 3px var(--bg-primary); }
.phone-layout .phone-hint.has-plan { color:#4ade80; }
.phone-layout .phone-dock { flex:none; display:grid; grid-template-columns:repeat(4,1fr); min-height:var(--phone-dock); padding:4px 8px env(safe-area-inset-bottom,0px); background:var(--bg-secondary); border-top:1px solid var(--border-glass-active); }
.phone-layout .phone-dock button { position:relative; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:3px; height:54px; border:0; border-radius:10px; background:transparent; color:var(--color-text-secondary); font:inherit; font-size:12px; }
.phone-layout .phone-dock button.active, .phone-layout .phone-settings.active { background:rgba(6,182,212,.13); color:#22d3ee; }
.phone-layout #phone-plan-count { position:absolute; top:2px; left:calc(50% + 9px); border-radius:12px; min-width:18px; padding:1px 4px; font-size:11px; font-weight:700; background:#22d3ee; color:#052330; }
.phone-layout #phone-sheet, .phone-layout #sites-panel.is-open { position:fixed !important; z-index:70; inset:auto 0 calc(var(--phone-keyboard) + var(--phone-dock)) !important; width:100% !important; height:var(--phone-sheet-height) !important; max-height:calc(var(--phone-height) - 130px) !important; min-height:0; margin:0 !important; border:1px solid var(--border-glass-active); border-bottom:0; border-radius:20px 20px 0 0; background:var(--bg-secondary); box-shadow:0 -6px 28px rgba(0,0,0,.22); padding:0; overflow:hidden; display:flex; flex-direction:column; box-sizing:border-box; }
.phone-layout .phone-sheet-heading { display:flex; align-items:center; justify-content:space-between; padding:7px 16px; border-bottom:1px solid var(--border-glass); flex-shrink:0; }
.phone-layout .phone-sheet-heading h2 { font-size:17px; margin:0; }
.phone-layout .phone-sheet-heading button { min-height:44px; padding:0 8px; border:0; background:none; color:#22d3ee; font:inherit; font-size:15px; }
.phone-layout .phone-sheet-content { flex:1; min-height:0; padding:12px 16px 20px; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
.phone-layout .phone-sheet-content .panel-card { margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; }
.phone-layout .phone-sheet-content .panel-title { font-size:15px; }
.phone-layout .phone-sheet-content .panel-subtitle { font-size:13px; line-height:1.5; }
.phone-layout .phone-sheet-content details { border-top:1px solid var(--border-glass-active); margin-top:12px; }
.phone-layout .phone-sheet-content summary { padding:14px 0; min-height:48px; font-size:15px; cursor:pointer; }
.phone-layout .phone-sheet-content label, .phone-layout .phone-sheet-content .layer-name { font-size:14px; }
.phone-layout .phone-sheet-content .layer-desc { font-size:12px; }
.phone-layout .phone-sheet-content input:not([type=checkbox]):not([type=range]), .phone-layout .phone-sheet-content select { font-size:16px; min-height:46px; max-width:100%; }
.phone-layout .phone-sheet-content input[type=range] { min-height:36px; touch-action:pan-y; }
.phone-layout #phone-presets { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.phone-layout #phone-presets button { min-height:46px; padding:8px; font-size:14px; }
.phone-layout #phone-layers > .panel-card > .panel-title, .phone-layout #phone-layers > .panel-card > .panel-subtitle { display:none; }
.phone-layout #phone-layers .layer-control { padding:10px; margin:8px 0; }
.phone-layout #phone-layers .layer-opacity-control { display:none; }
.phone-layout #phone-layers .layer-control:has(input[type=checkbox]:checked) .layer-opacity-control { display:block; }
.phone-layout #phone-preferences { display:flex; gap:16px; margin:10px 0 20px; flex-wrap:wrap; }
.phone-layout #phone-preferences button { min-height:44px; font-size:14px; }
.phone-layout #phone-expression-select { width:100%; margin:6px 0 10px; background:var(--bg-primary); color:var(--color-text-primary); border:1px solid var(--border-glass-active); border-radius:10px; padding:8px; }
.phone-layout .phone-expression-hidden { display:none !important; }
.phone-layout #phone-movement .anatomy-animation-card > .panel-title, .phone-layout #phone-movement #treatment-simulation-subtitle, .phone-layout #phone-movement #expression-pose-hint { display:none; }
.phone-layout #phone-movement .simulation-evidence-notice { font-size:12px; padding:8px; margin:4px 0 10px; }
.phone-layout #phone-movement .expression-pose-switch button { min-height:44px; }
.phone-layout #phone-totals .panel-title, .phone-layout #phone-plan #planned-injections > .panel-title > span { display:none; }
.phone-layout #phone-totals .planner-summary-box { margin:0 0 14px; padding:12px; }
.phone-layout #phone-plan #planned-injections > .panel-title { display:flex; justify-content:flex-end; margin-bottom:8px; padding:0; border:0; }
.phone-layout #phone-plan .plan-list-container { max-height:none; overflow:visible; }
.phone-layout #phone-plan .plan-item { display:grid; grid-template-columns:minmax(0,1fr) auto; padding:12px 10px; gap:6px; }
.phone-layout #phone-plan .plan-item-title { font-size:14px; white-space:normal; }
.phone-layout #phone-plan .plan-item-sub { font-size:12px; }
.phone-layout #phone-plan .phone-plan-edit .plan-item-title, .phone-layout #phone-plan .phone-plan-edit .plan-item-sub { display:block; }
.phone-layout #phone-plan #btn-clear-plan { min-height:44px; padding:8px 12px; }
.phone-layout #phone-plan .plan-item-amount { font-size:13px; }
.phone-layout #phone-plan .plan-item-del { width:44px; height:44px; font-size:23px; }
.phone-layout #phone-plan .phone-plan-edit { display:block; background:transparent; border:0; color:var(--color-text-primary); padding:6px 0; text-align:left; font:inherit; min-height:44px; width:100%; }
.phone-layout #phone-plan .plan-item-info { display:none; }
.phone-layout #phone-plan .plan-empty { font-size:14px; padding:18px 10px; }
.phone-layout #phone-plan #btn-export-plan { min-height:50px; font-size:14px; margin-top:16px; }
.phone-layout #phone-undo { min-height:44px; padding:8px 12px; width:100%; border:1px solid var(--border-glass-active); border-radius:10px; color:#22d3ee; background:none; margin-bottom:10px; }
.phone-layout #sites-panel .sites-panel-chrome { flex-shrink:0; padding:8px 14px; cursor:default; }
.phone-layout #sites-panel .sites-panel-heading { font-size:15px; }
.phone-layout #sites-panel .sites-panel-meta { display:none; }
.phone-layout #sites-panel .sites-panel-filter { padding:0 14px 8px; }
.phone-layout #sites-panel input { min-height:44px; font-size:16px; }
.phone-layout #sites-panel .sites-panel-list { flex:1; max-height:none; overflow-y:auto; padding:0 14px 14px; }
.phone-layout #sites-panel .sites-panel-list button { min-height:46px; font-size:13px; white-space:normal; }
.phone-layout #sites-panel .sites-panel-close, .phone-layout #anatomy-popover .popover-close { min-width:44px; min-height:44px; }
.phone-layout #sites-panel .overlay-drag-edge, .phone-layout #anatomy-popover .overlay-drag-edge { display:none; }
.phone-layout #anatomy-popover { position:fixed !important; z-index:90; inset:auto 0 calc(var(--phone-keyboard) + var(--phone-dock)) !important; margin:0; width:100% !important; max-width:none; max-height:var(--phone-sheet-height) !important; min-height:0; border-radius:20px 20px 0 0; padding:14px 16px; box-sizing:border-box; overflow-y:auto; overscroll-behavior:contain; background:var(--bg-secondary); }
.phone-layout #anatomy-popover .popover-header { cursor:default; flex-shrink:0; }
.phone-layout #anatomy-popover .popover-title { font-size:16px; }
.phone-layout #anatomy-popover .popover-desc { font-size:12px; margin:0; }
.phone-layout #anatomy-popover .popover-actions { flex-shrink:0; }
.phone-layout #anatomy-popover input { font-size:18px; min-height:48px; }
.phone-layout #anatomy-popover .popover-btn { min-height:48px; font-size:16px; }
.phone-layout #anatomy-popover .popover-unit-reference { font-size:12px; }
.phone-layout #anatomy-popover .popover-header > div { min-width:0; }
.phone-layout #ha-point-placement-editor { position:fixed !important; inset:auto 0 calc(var(--phone-keyboard) + var(--phone-dock)) !important; width:100% !important; max-width:none !important; max-height:calc(var(--phone-height) - 115px); box-sizing:border-box; overflow:auto; border-radius:20px 20px 0 0 !important; }
.phone-layout #ha-point-placement-editor button { min-height:44px; }
.phone-layout #ha-point-placement-editor select { font-size:16px; min-height:44px; }
.phone-layout #ha-point-placement-editor .overlay-drag-edge { display:none; }
.phone-layout #phone-notice { position:fixed; bottom:calc(var(--phone-keyboard) + var(--phone-dock) + 9px); left:50%; transform:translateX(-50%); z-index:100; pointer-events:none; padding:0; font-size:14px; color:#4ade80; background:var(--bg-secondary); border-radius:10px; white-space:nowrap; }
.phone-layout #phone-notice:not(:empty) { padding:9px 15px; border:1px solid #4ade8060; }
.phone-layout.phone-keyboard-open .phone-top { display:none; }
.phone-layout.phone-compact-sheet #phone-stage { margin-bottom:0; min-height:0; }
.phone-layout.phone-compact-sheet #phone-sheet, .phone-layout.phone-compact-sheet #sites-panel.is-open { max-height:var(--phone-sheet-height) !important; }
@media (max-height:500px) and (min-width:641px) { .phone-layout .phone-header { padding:0 12px; display:flex; gap:12px; align-items:center; } .phone-layout .phone-top { flex:1; } .phone-layout .phone-choices { flex:2; } .phone-layout .phone-hint { display:none; } }

/* Plan and Points expand from their headers; lists retain native scrolling. */
.phone-layout[data-phone-panel="plan"] #phone-sheet { max-height:var(--phone-expanded-height) !important; transition:height 180ms ease; }
.phone-layout[data-phone-panel="plan"] .phone-sheet-heading { touch-action:none; user-select:none; -webkit-user-select:none; cursor:grab; display:grid; grid-template-columns:1fr 64px 1fr; }
.phone-layout[data-phone-panel="plan"] #phone-sheet-done { justify-self:end; cursor:pointer; }
.phone-layout #phone-plan-resize { width:64px; height:44px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; cursor:pointer; border-radius:8px; }
.phone-layout #phone-plan-resize:focus-visible { outline:2px solid #22d3ee; outline-offset:1px; }
.phone-layout .phone-grip { width:34px; height:4px; border-radius:4px; background:var(--color-text-secondary); }
.phone-layout #phone-plan-resize[aria-expanded="true"] svg { transform:rotate(180deg); }
.phone-layout.phone-plan-expanded #phone-sheet { border-radius:0; }
.phone-layout.phone-plan-expanded .phone-sheet-heading { padding-top:max(7px,env(safe-area-inset-top,0px)); }
.phone-layout.phone-plan-dragging #phone-sheet { transition:none; }
.phone-layout.phone-plan-dragging .phone-sheet-heading { cursor:grabbing; }
@media (prefers-reduced-motion:reduce) { .phone-layout[data-phone-panel="plan"] #phone-sheet { transition:none; } }

/* Each selected layer keeps its original slider beside the phone toggles. */
.phone-layout #phone-presets .phone-slider-selected {border-color:#22d3ee;color:#22d3ee;background:rgba(6,182,212,.12);}
.phone-layout .phone-selected-layer {margin-top:12px;padding:10px 12px 2px;border:1px solid var(--border-glass-active);border-radius:10px;background:var(--bg-glass);}
.phone-layout .phone-selected-layer-name {font-size:14px;font-weight:600;margin-bottom:6px;}
.phone-layout .phone-selected-layer .layer-opacity-control,.phone-layout .phone-selected-layer .layer-opacity-slider {--layer-accent:var(--phone-selected-accent) !important;}
.phone-layout .phone-selected-layer .layer-opacity-control,.phone-layout .phone-selected-layer .reveal-control {display:block;border:0;margin:0;padding:0;}
.phone-layout .phone-selected-layer input[type=range] {width:100%;min-height:44px;margin:0;touch-action:pan-y;}
.phone-layout .phone-selected-layer .layer-opacity-heading,.phone-layout .phone-selected-layer .reveal-copy {font-size:13px;}

/* Desktop preset highlighting must not imply exclusive selection on phones. */
.phone-layout #phone-presets .view-preset-btn:not(.phone-slider-selected) {border-color:var(--border-glass);color:var(--color-text-secondary);background:var(--bg-glass);box-shadow:none;}

/* The Points header also supports swipe up/down and an accessible size toggle. */
#phone-points-resize { display:none; }
.phone-layout #phone-points-resize:not([hidden]) { display:flex; flex:0 0 44px; width:44px; height:44px; flex-direction:column; align-items:center; justify-content:center; gap:3px; border:0; border-radius:8px; padding:0; background:none; color:#22d3ee; cursor:pointer; }
.phone-layout #phone-points-resize:focus-visible { outline:2px solid #22d3ee; outline-offset:1px; }
.phone-layout #phone-points-resize .phone-grip { width:26px; }
.phone-layout #phone-points-resize[aria-expanded="true"] svg { transform:rotate(180deg); }
.phone-layout[data-phone-panel="points"] #sites-panel.is-open { max-height:var(--phone-expanded-height) !important; transition:height 180ms ease; }
.phone-layout #sites-panel .sites-panel-chrome { touch-action:none; user-select:none; -webkit-user-select:none; cursor:grab; }
.phone-layout #sites-panel .sites-panel-chrome::before { display:none; }
.phone-layout #sites-panel .sites-panel-heading-copy { flex:1; }
.phone-layout #sites-panel .sites-panel-close { flex-shrink:0; }
.phone-layout #sites-panel .sites-panel-list { min-height:0; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; touch-action:pan-y; }
.phone-layout.phone-points-expanded #sites-panel.is-open { border-radius:0; }
.phone-layout.phone-points-expanded #sites-panel .sites-panel-chrome { padding-top:max(8px,env(safe-area-inset-top,0px)); }
.phone-layout.phone-points-dragging #sites-panel.is-open { transition:none; }
.phone-layout.phone-points-dragging #sites-panel .sites-panel-chrome { cursor:grabbing; }
@media (prefers-reduced-motion:reduce) { .phone-layout[data-phone-panel="points"] #sites-panel.is-open { transition:none; } }