/* Clinical instrument system. Shared screen UI; calculations and print layouts are independent. */
@media screen {
  :root, [data-theme="light"] {
    --bg-color: #edf3f6; --panel-bg: #ffffff; --wheel-bg: #ffffff;
    --text-primary: #173345; --text-secondary: #476171; --line-base: #b8c9d3;
    --line-week: #657f8f; --line-month: #344f60; --line-year: #173345;
    --accent-color-1: #dfeaf0; --accent-color-2: #f9fcfd;
    --arrow-um: #14618a; --arrow-dpp: #98500e; --forecast-accent: #116c62; --forecast-accent-hover: #0a514a;
    --toggle-bg: #e5eef3; --surface-input: #f4f8fa; --clinical-border: #c5d4dd; --clinical-shadow: 0 8px 24px #1733450c;
    --sidebar-bg: #ffffff; --sidebar-text: #173345; --sidebar-accent: #14618a; --sidebar-secondary-bg: #edf3f6; --sidebar-border: #c5d4dd;
    --magnifier-bg: #ffffff; --magnifier-border: #14618a; --magnifier-shadow: 0 7px 12px #17334526;
    --dp-background: #ffffff; --dp-text-primary: #173345; --dp-text-secondary: #526e7e; --dp-accent-background: #14618a; --dp-accent-text: #fff; --dp-hover-background: #e5eef3;
    --action-bg: #14618a; --action-text: #ffffff; --danger-text: #ac2938;
  }
  :root { --input-bg: var(--surface-input); --btn-primary: var(--action-bg); --btn-text: var(--action-text); }
  [data-theme="dark"] {
    --bg-color: #142633; --panel-bg: #213847; --wheel-bg: #213847;
    --text-primary: #f0f6fa; --text-secondary: #bed0db; --line-base: #5d7889;
    --line-week: #9db4c2; --line-month: #c3d3de; --line-year: #f0f6fa;
    --accent-color-1: #365465; --accent-color-2: #284352;
    --arrow-um: #8bcef2; --arrow-dpp: #ffc37d; --forecast-accent: #86dfd0; --forecast-accent-hover: #b5eee4;
    --toggle-bg: #304d5e; --surface-input: #192e3c; --clinical-border: #547181; --clinical-shadow: 0 8px 24px #00000018;
    --sidebar-bg: #213847; --sidebar-text: #f0f6fa; --sidebar-accent: #8bcef2; --sidebar-secondary-bg: #192e3c; --sidebar-border: #547181;
    --magnifier-bg: #213847; --magnifier-border: #8bcef2; --magnifier-shadow: 0 7px 12px #00000055;
    --dp-background: #213847; --dp-text-primary: #f0f6fa; --dp-text-secondary: #bed0db; --dp-accent-background: #8bcef2; --dp-accent-text: #142633; --dp-hover-background: #365465;
    --action-bg: #8bcef2; --action-text: #142633; --danger-text: #ffacb5;
  }
  [data-theme="glass"] {
    --bg-color: #e6f0f3; --panel-bg: rgba(255,255,255,.94); --wheel-bg: #f9fcfd;
    --text-primary: #173345; --text-secondary: #476171; --line-base: #b8c9d3;
    --line-week: #657f8f; --line-month: #344f60; --line-year: #173345;
    --accent-color-1: #dfeaf0; --accent-color-2: #f9fcfd;
    --arrow-um: #14618a; --arrow-dpp: #98500e; --forecast-accent: #116c62; --forecast-accent-hover: #0a514a;
    --toggle-bg: #e5eef3; --surface-input: #f4f8fa; --clinical-border: #aec7d3; --clinical-shadow: 0 8px 24px #17334512;
    --sidebar-bg: #f8fbfd; --sidebar-text: #173345; --sidebar-accent: #14618a; --sidebar-secondary-bg: #edf3f6; --sidebar-border: #aec7d3;
    --magnifier-bg: #f9fcfd; --magnifier-border: #14618a; --magnifier-shadow: 0 7px 12px #17334526;
    --dp-background: #f9fcfd; --dp-text-primary: #173345; --dp-text-secondary: #526e7e; --dp-accent-background: #14618a; --dp-accent-text: #fff; --dp-hover-background: #e5eef3;
    --action-bg: #14618a; --action-text: #ffffff; --danger-text: #ac2938;
  }
  html, body { font-family: 'Poppins', 'Segoe UI', sans-serif; color: var(--text-primary); background: var(--bg-color); }
  [data-theme="glass"] body { background: radial-gradient(ellipse at top left,#d5e9ef,transparent 65%),var(--bg-color); }
  button, input, select, textarea { font-family: inherit; }
  button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
  button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--arrow-um); outline-offset: 3px; }
  button svg { flex-shrink: 0; }
  .icon-btn { border-radius: 10px; border: 1px solid var(--clinical-border); background: var(--panel-bg); color: var(--text-primary); box-shadow: none; }
  .icon-btn:hover { transform: none; background: var(--accent-color-1); }
  .icon-btn::before { flex-shrink: 0; background-color: currentColor; mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; }
  /* SVG icons must not compete with the generic unmasked pseudo-element. */
  .icon-btn:has(> svg)::before { display: none; }
  .icon-btn > svg, #toggle-filters-btn > svg { width: 22px; height: 22px; flex-shrink: 0; }
  #lock-wheel-btn, #toggle-reset-click-btn { background: var(--panel-bg); color: var(--text-primary); }
  #lock-wheel-btn::before, #toggle-reset-click-btn::before { background: currentColor; }
  #lock-wheel-btn.active, #toggle-reset-click-btn.active, .zoom-option-btn.active { background: var(--action-bg); color: var(--action-text); border-color: var(--action-bg); }
  #lock-wheel-btn.active::before, #toggle-reset-click-btn.active::before { background: currentColor; }
  #forecast-mode-btn.active { background: var(--action-bg); color: var(--action-text); }
  #forecast-mode-btn.active::before { background: currentColor; }
  #main-panel, #pregnancy-details, .modal-content, #zoom-popup, .exam-filter-dropdown, .datepicker-panel, #login-container, .policy-container { border: 1px solid var(--clinical-border); box-shadow: var(--clinical-shadow); background: var(--panel-bg); color: var(--text-primary); }
  #info-panel, [data-theme="glass"] #info-panel { background: transparent; border: 0; box-shadow: none; backdrop-filter: none; transform: none; }
  [data-theme="glass"] .modal-content, [data-theme="glass"] #zoom-popup, [data-theme="glass"] .sidebar-content { backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: var(--clinical-shadow); border-color: var(--clinical-border); }
  #main-panel, #pregnancy-details { border-radius: 16px; }
  .info-label { text-transform: none; font-size: 13px; font-weight: 600; color: var(--text-secondary); }
  .hybrid-date-picker { background: var(--surface-input); border: 1px solid var(--clinical-border); padding: 9px 12px; min-height: 48px; }
  .hybrid-date-picker input { color: var(--text-primary); font-size: 24px; font-variant-numeric: tabular-nums; letter-spacing: -.5px; min-width: 0; }
  .hybrid-date-picker .calendar-icon { opacity: 1; color: var(--arrow-um); }
  .info-item:has(#dpp-input) .calendar-icon { color: var(--arrow-dpp); }
  .info-item:has(#um-input) { border-left: 3px solid var(--arrow-um); padding-left: 14px; }
  .info-item:has(#dpp-input) { border-left: 3px solid var(--arrow-dpp); padding-left: 14px; }
  #toggle-exams-btn, .calc-actions .btn-primary, #login-btn, .btn-primary, .modal-footer button { background: var(--action-bg); color: var(--action-text); box-shadow: none; }
  #toggle-exams-btn { min-height: 44px; font-size: 14px; border-radius: 8px; }
  .calc-actions .btn-secondary { background: var(--surface-input); color: var(--text-primary); border: 1px solid var(--clinical-border); }
  input::placeholder { color: var(--text-secondary); opacity: 1; }
  .calc-group input[type="number"], input[type="email"], input[type="password"], input[type="date"], select, textarea { background: var(--surface-input); color: var(--text-primary); border-color: var(--clinical-border); }
  #gest-reference-mode, #gest-reference-date { display: block; box-sizing: border-box; width: 100%; min-width: 0; min-height: 46px; padding: 10px; border: 1px solid var(--clinical-border); border-radius: 6px; font: inherit; font-size: 16px; color-scheme: light; }
  [data-theme="dark"] #gest-reference-mode, [data-theme="dark"] #gest-reference-date { color-scheme: dark; }
  #gest-reference-mode { appearance: none; background: var(--surface-input) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23526e7e' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center; padding-right: 32px; }
  [data-theme="dark"] #gest-reference-mode { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23bed0db' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
  #gest-reference-group[hidden] { display: none; }
  .project-date-control { position: relative; }
  #gest-reference-date { padding-right: 48px; }
  .project-calendar-button { position: absolute; right: 1px; top: 1px; width: 44px; height: 44px; padding: 9px; border: 0; border-radius: 6px; background: transparent; color: var(--text-primary); cursor: pointer; }
  #gest-reference-datepicker { left: 0; right: 0; top: calc(100% + 6px); width: 100%; max-width: none; box-sizing: border-box; }
  .datepicker-panel { background: var(--wheel-bg); }
  #mf-calendar-button { background: var(--surface-input); color: var(--text-primary); border-color: var(--clinical-border); }
  #mobile-forecast-modal:has(#mf-datepicker.visible) .mf-content.modern-layout { min-height: min(510px,calc(100dvh - 120px)); }
  #mf-datepicker { left: auto; right: 0; top: calc(100% + 6px); width: min(300px,calc(100vw - 64px)); max-width: none; max-height: min(420px,calc(100dvh - 210px)); overflow-y: auto; box-sizing: border-box; }
  .dp-grid button.dp-cell { appearance: none; border: 0; padding: 0; background: transparent; color: var(--dp-text-primary); font: inherit; font-size: 12px; }
  .dp-grid button.dp-cell:hover { background: var(--dp-hover-background); }
  .dp-grid button.dp-cell.today { box-shadow: inset 0 0 0 1px var(--dp-accent-background); }
  .dp-grid button.dp-cell.selected { background: var(--dp-accent-background); color: var(--dp-accent-text); }
  .dp-grid button.dp-cell:disabled { opacity: .35; cursor: default; background: transparent; box-shadow: none; }
  .dp-close { width: 100%; min-height: 44px; margin-top: 8px; padding: 8px; border: 1px solid var(--clinical-border); border-radius: 6px; background: var(--surface-input); color: var(--text-primary); font: inherit; font-size: 12px; cursor: pointer; }
  .flatpickr-calendar, .flatpickr-months, .flatpickr-weekdays, .flatpickr-day, .flatpickr-current-month .flatpickr-monthDropdown-months { background: var(--panel-bg); color: var(--text-primary); }
  .flatpickr-calendar { border: 1px solid var(--clinical-border); box-shadow: var(--clinical-shadow); }
  .flatpickr-months .flatpickr-month, span.flatpickr-weekday, .flatpickr-current-month input.cur-year { color: var(--text-primary); }
  .flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month { fill: var(--text-primary); color: var(--text-primary); }
  .flatpickr-day:hover { background: var(--accent-color-1); border-color: var(--clinical-border); }
  .flatpickr-day.selected { background: var(--action-bg); color: var(--action-text); border-color: var(--action-bg); }
  .flatpickr-day.prevMonthDay, .flatpickr-day.nextMonthDay { color: var(--text-secondary); }
  .gest-date-hint, #gest-reference-summary { display: block; font-size: 12px; line-height: 1.7; color: var(--text-secondary); }
  #gest-reference-summary:empty { display: none; }
  #gest-calculator .error-msg { color: var(--danger-text); }
  .results-area, .calendar-container-sidebar { background: var(--surface-input); color: var(--text-primary); border-color: var(--clinical-border); }
  .results-area strong, .calc-group label, .user-info-item strong { color: var(--text-primary); }
  .exam-dates-secondary, .exam-dates-primary, .exam-title { color: var(--text-primary); }
  .exam-item { border-color: var(--clinical-border); }
  #exam-filter-btn { color: var(--text-primary); width: 44px; height: 44px; }
  #filter-options { max-height: min(320px,45dvh); }
  .filter-option input[type="checkbox"] { accent-color: var(--action-bg); }
  .filter-option label { line-height: 1.5; }
  .modal-overlay, [data-theme="glass"] .modal-overlay { background: #0d2538a6; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
  .modal-header h1 { font-size: clamp(22px,2.5vw,30px); color: var(--text-primary); letter-spacing: -.6px; }
  .tab-btn, .tab-link { min-height: 40px; }
  .close-button { min-width: 44px; min-height: 44px; }
  #utility-sidebar { border-right: 1px solid var(--clinical-border); box-shadow: 5px 0 30px #17334518; }
  .sidebar-menu-btn { border-color: var(--clinical-border); border-radius: 8px; color: var(--text-primary); }
  .sidebar-menu-btn.active { color: var(--arrow-um); background: var(--accent-color-1); }
  #sidebar-footer-content { background: var(--surface-input); }
  #sidebar-footer-toggle, #sidebar-policy-links a.lang-tag { color: var(--text-primary); }
  #sidebar-handle, [data-theme="glass"] #sidebar-handle { background: var(--panel-bg); color: var(--text-primary); border: 1px solid var(--clinical-border); box-shadow: none; }
  .theme-toggle-label { display: none; }
  .theme-choices { display: flex; gap: 4px; margin: 0; padding: 4px; border: 1px solid var(--clinical-border); border-radius: 10px; background: var(--panel-bg); }
  .theme-choices legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .theme-choices button { flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px; background: transparent; color: var(--text-primary); border: 1px solid transparent; border-radius: 6px; padding: 9px; font-size: 12px; cursor: pointer; }
  .theme-choices button[aria-pressed="true"] { background: var(--action-bg); color: var(--action-text); }
  .theme-choices svg { width: 18px; height: 18px; }
  #obstetric-wheel { background: transparent; overflow: hidden; filter: drop-shadow(0 3px 3px #102d4020); }
  .wheel-container { background: transparent; }
  #outer-disk { filter: drop-shadow(0 2px 2px #102d4018); }
  #inner-disk { filter: drop-shadow(0 1px 1px #102d4020); }
  .pulse-shape-inner, .pulse-shape-outer, .heartbeat-shape { opacity: 0 !important; animation: none !important; }
  .um-sector-highlight { opacity: .1; mix-blend-mode: normal; }
  .month-label, .week-number, .day-number { text-shadow: none !important; }
  .frosted-glass-cta { background: var(--panel-bg); border: 1px solid var(--clinical-border); backdrop-filter: none; box-shadow: none; }
  .frosted-glass-cta p { color: var(--text-primary); text-shadow: none; font-size: 16px; }
  #hand-guide-animation { display: none; }
  /* Two joined circles: contact ring at the pointer, readable lens above it. */
  #magnifier-lens.magnifier { position: fixed; width: 160px; height: 230px; max-width: none; max-height: none; border: 0; border-radius: 0; background: none; box-shadow: none; overflow: visible; backdrop-filter: none; -webkit-backdrop-filter: none; z-index: 950; transform-origin: 80px 204px; transform: rotate(var(--lens-angle,0deg)) scale(var(--lens-scale,1)); transition: opacity 100ms ease,visibility 100ms ease; }
  #magnifier-lens.visible { transform: rotate(var(--lens-angle,0deg)) scale(var(--lens-scale,1)); }
  .magnifier-shell { position: absolute; inset: 0; width: 160px; height: 230px; overflow: visible; filter: drop-shadow(0 5px 7px #102d4038); }
  .magnifier-shell path { fill: var(--magnifier-bg); stroke: var(--magnifier-border); stroke-width: 2; }
  #magnifier-content { position: absolute; top: 6px; left: 6px; width: 148px; height: 148px; border-radius: 50%; clip-path: circle(50%); background: var(--wheel-bg); transform-origin: center; overflow: hidden; }
  .magnifier-pointer { position: absolute; width: 16px; height: 16px; top: 196px; left: 72px; border: 1px solid var(--magnifier-border); border-radius: 50%; opacity: .8; }
  #login-container { padding: 36px; max-width: 420px; border-radius: 16px; }
  #login-container h1 { color: var(--text-primary); font-size: 28px; letter-spacing: -.9px; }
  #login-container .form-group input { min-height: 48px; background: var(--surface-input); border-color: var(--clinical-border); }
  #login-container button { min-height: 44px; }
  .login-footer a { color: var(--text-secondary); }
  .policy-container { border-radius: 14px; }
  .policy-header { background: var(--panel-bg); color: var(--text-primary); border-bottom: 1px solid var(--clinical-border); }
  .policy-header h1, .tab-content h2 { color: var(--text-primary); }
  .tab-content { line-height: 1.8; }
  .tab-content p, .tab-content li { max-width: 75ch; }
  .policy-tabs, .policy-footer { background: var(--surface-input); }
  .policy-tabs .tab-link { color: var(--text-secondary); }
  .policy-tabs .tab-link.active { color: var(--arrow-um); border-color: var(--arrow-um); }
  .desktop-heading { display: none; }
  @media (min-width:769px) {
    body:has(#app-container) { overflow: auto; }
    .desktop-heading { display: flex; align-items: center; gap: 12px; position: absolute; left: 32px; top: 22px; }
    .desktop-heading svg { width: 34px; height: 34px; color: var(--arrow-um); }
    .desktop-heading h1 { margin: 0; font-size: 20px; font-weight: 600; letter-spacing: -.5px; }
    .desktop-heading p { margin: 2px 0 0; color: var(--text-secondary); font-size: 12px; }
    #app-container, .focus-mode #app-container, .dashboard-visible #app-container { display: grid; grid-template-columns: minmax(300px,1fr) minmax(320px,400px); align-items: center; gap: 32px; width: min(1320px,100%); min-height: 100dvh; height: auto; margin: auto; padding: 106px 48px 108px; overflow: visible; }
    .wheel-container, .focus-mode .wheel-container, .dashboard-visible .wheel-container { width: 100%; height: auto; aspect-ratio: 1; max-width: 740px; max-height: none; transform: none; }
    #info-panel, .focus-mode #info-panel, .dashboard-visible #info-panel { width: 100%; max-width: none; max-height: none; transform: none; opacity: 1; }
    #main-panel { padding: 28px; }
    #pregnancy-details { padding: 24px; }
    #collapsible-panel > div { max-height: min(480px,55dvh); }
    #top-left-controls { top: auto; bottom: 24px; left: 32px; flex-direction: row; }
    #wheel-joystick-panel { background: var(--panel-bg); border: 1px solid var(--clinical-border); border-radius: 10px; padding: 8px; box-shadow: var(--clinical-shadow); }
    #zoom-popup { top: auto; bottom: calc(100% + 12px); }
    #global-controls { flex-direction: row; top: 24px; right: 32px; gap: 8px; }
    #global-controls .theme-choices { position: absolute; top: 0; right: calc(100% + 12px); width: 245px; }
    #global-controls .icon-btn { width: 42px; height: 42px; }
    #app-copyright { position: absolute; right: 32px; bottom: 20px; font-size: 10px; }
    #forecast-info-panel { top: auto; bottom: 26px; max-width: 320px; padding: 10px 16px; }
    #forecast-info-panel.visible { transform: translateX(-50%); }
  }
  @media (min-width:769px) and (max-width:1100px) {
    .desktop-heading p { display: none; }
    .desktop-heading h1 { font-size: 16px; }
    #app-container, .focus-mode #app-container { gap: 22px; padding-inline: 32px; grid-template-columns: minmax(270px,1fr) minmax(290px,340px); }
    #global-controls .theme-choices { top: 52px; right: 0; }
  }
  .mobile-ui { --mobile-border: var(--clinical-border) !important; }
  .mobile-ui .mobile-header, .mobile-ui .mobile-nav { background: var(--panel-bg); }
  .mobile-ui .mobile-nav, .mobile-ui #utility-sidebar, .mobile-ui .mobile-menu-header { background: var(--wheel-bg); }
  .mobile-ui .mobile-menu-header { flex-shrink: 0; }
  .mobile-ui .mobile-menu-close { width: auto; padding: 0 12px; gap: 7px; font: inherit; font-size: 13px; }
  .mobile-ui #utility-sidebar .sidebar-content { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; }
  .mobile-ui #utility-sidebar[data-mobile-menu-page="tools"] #sidebar-footer,
  .mobile-ui #utility-sidebar[data-mobile-menu-page="tools"] #global-controls,
  .mobile-ui #utility-sidebar[data-mobile-menu-page="tools"] .pwa-tools,
  .mobile-ui #utility-sidebar[data-mobile-menu-page="more"] #sidebar-menu,
  .mobile-ui #utility-sidebar[data-mobile-menu-page="more"] #tool-container { display: none !important; }
  .mobile-ui #utility-sidebar .sidebar-content #sidebar-footer { flex-shrink: initial; margin: 0; padding-bottom: 0; border: 1px solid var(--clinical-border); border-radius: 10px; overflow: hidden; }
  .mobile-ui #utility-sidebar .sidebar-content #sidebar-footer.expanded #sidebar-footer-content { max-height: none; }
  .mobile-ui #sidebar-footer-toggle { min-height: 52px; }
  .mobile-ui #sidebar-footer .logout-btn-styled { width: calc(100% - 40px); }
  .mobile-ui #current-week:empty::after { content: 'Inserisci U.M. o D.P.P.'; font-size: 14px; font-weight: 400; color: var(--text-secondary); }
  .mobile-ui .mobile-summary { border-radius: 8px; border: 0; border-left: 3px solid var(--arrow-um); background: var(--accent-color-1); }
  .mobile-ui #main-panel { padding: 20px; border-radius: 12px; }
  .mobile-ui .info-item:has(#um-input), .mobile-ui .info-item:has(#dpp-input) { padding-left: 12px; }
  .mobile-ui .mobile-wheel-stage { padding: 0; background: var(--panel-bg); border: 1px solid var(--clinical-border); border-radius: 12px; }
  .manual-toggle { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 80px; padding: 17px; text-align: left; border: 0; border-radius: 12px; background: transparent; color: var(--text-primary); cursor: pointer; }
  .manual-toggle > svg { width: 28px; height: 28px; color: var(--arrow-um); }
  .manual-toggle span { flex: 1; }
  .manual-toggle strong { display: block; font-size: 15px; font-weight: 600; }
  .manual-toggle small { display: block; color: var(--text-secondary); font-size: 12px; line-height: 1.5; margin-top: 5px; }
  .manual-toggle .manual-chevron { width: 20px; height: 20px; transition: transform 240ms ease; }
  .manual-open .manual-chevron { transform: rotate(180deg); }
  .manual-reveal { display: grid; grid-template-rows: 0fr; visibility: hidden; opacity: 0; transition: grid-template-rows 300ms ease,opacity 250ms ease,visibility 300ms; }
  .manual-open .manual-reveal { grid-template-rows: 1fr; visibility: visible; opacity: 1; }
  .manual-body { min-height: 0; overflow: hidden; }
  .manual-open .manual-body { padding: 0 10px 14px; }
  .mobile-ui .mobile-wheel-hint { margin: 0 7px 10px; }
  .mobile-ui .wheel-container { aspect-ratio: 1; background: var(--wheel-bg); }
  .mobile-ui #obstetric-wheel #overlay-quarter, .mobile-ui #obstetric-wheel #overlay-third { fill: var(--wheel-bg); }
  .mobile-ui .manual-body { background: var(--wheel-bg); }
  .mobile-ui #obstetric-wheel { aspect-ratio: 1; }
  .mobile-ui #global-controls .theme-toggle-label { display: inline; font-size: 13px; }
  .mobile-ui .theme-choices { width: 100%; min-width: 0; }
  .mobile-ui .theme-choices button { min-height: 48px; flex-direction: column; gap: 5px; }
  .mobile-ui .theme-choices legend { position: static; width: auto; height: auto; clip-path: none; padding: 0 6px; font-size: 13px; font-weight: 600; }
  .mobile-ui #global-controls .icon-btn, .mobile-ui #joystick-main-controls .icon-btn { color: var(--text-primary); background: var(--surface-input); }
  .mobile-ui #global-controls .icon-btn.active, .mobile-ui #joystick-main-controls .icon-btn.active { background: var(--action-bg); color: var(--action-text); }
  .mobile-ui #global-controls .icon-btn::before, .mobile-ui #joystick-main-controls .icon-btn::before { background: currentColor; }
  .mobile-ui #joystick-main-controls .mobile-control-label { color: inherit; }
  .mobile-ui #forecast-mode-btn.active { background: var(--action-bg) !important; border-color: var(--action-bg) !important; }
  .mobile-ui .calc-actions .btn-primary { background: var(--action-bg); color: var(--action-text); }
  .mobile-ui #pregnancy-details { border-radius: 12px; }
  .mobile-ui .desktop-heading { display: none; }
  .mobile-ui #mobile-forecast-btn { background: var(--panel-bg); color: var(--forecast-accent); border-color: var(--clinical-border); border-radius: 10px; }
  .mobile-ui .mobile-intro h1 { font-size: 26px; letter-spacing: -.7px; }
  .btn-primary-admin, #certificate-modal #cert_next-btn, #certificate-modal #cert_print-btn, .filter-view-pane .trimester-filters button.active, .filter-view-pane .status-filters button.active { background: var(--action-bg); color: var(--action-text); }
  .btn-action-admin.toggle-status-btn[data-status="attivo"], .btn-action-admin.delete-announcement-btn { background: #a82738; color: #ffffff; }
  .btn-action-admin.toggle-status-btn[data-status="disabilitato"] { background: #226b47; color: #ffffff; }
  .btn-action-admin.reset-pass-btn { background: #8a4914; color: #ffffff; }
  .mf-header-modern { background: var(--panel-bg); color: var(--text-primary); border-bottom: 1px solid var(--clinical-border); }
  .mf-header-modern h3 { text-transform: none; letter-spacing: 0; opacity: 1; }
  .mf-header-modern .calendar-icon-btn-header { background: var(--surface-input); color: var(--text-primary); border-color: var(--clinical-border); }
  .mf-result-box { background: var(--accent-color-1); color: var(--text-primary); border-color: var(--clinical-border); }
  .mf-result-value.error { color: var(--danger-text); }
  .mf-date-offset { margin: 12px 0 0; color: var(--danger-text); font-size: 13px; font-weight: 600; line-height: 1.6; }
  .dp-month-year { display: flex; align-items: center; justify-content: center; gap: 5px; min-height: 44px; padding: 6px; border: 0; border-radius: 6px; background: transparent; font: inherit; font-size: 13px; font-weight: 600; color: var(--dp-text-primary); cursor: pointer; }
  .dp-month-year:hover { background: var(--dp-hover-background); }
  .dp-header { padding: 0; gap: 2px; }
  .dp-nav { min-width: 36px; min-height: 44px; padding: 5px; display: flex; align-items: center; justify-content: center; }
  .dp-month-hint { margin: 8px 0; font-size: 11px; line-height: 1.5; color: var(--text-secondary); }
  .dp-month-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; }
  .dp-month-option { min-height: 44px; padding: 8px 3px; border: 1px solid var(--clinical-border); border-radius: 6px; background: var(--surface-input); color: var(--text-primary); font: inherit; font-size: 12px; cursor: pointer; }
  .dp-month-option[aria-pressed="true"] { background: var(--action-bg); color: var(--action-text); border-color: var(--action-bg); }
  .mf-content.modern-layout, .mf-body-modern { background: var(--panel-bg); }
  .mf-label-small, .mf-result-value small { opacity: 1; }
  [data-theme="glass"] .hybrid-date-picker input { background: transparent; border: 0; box-shadow: none; }
  .ql-toolbar.ql-snow { background: #edf3f6; color: #173345; }
  .ql-container.ql-snow { color: #173345; background: #ffffff; }
  .mobile-ui #app-copyright { position: static; }
  button:disabled { cursor: not-allowed; opacity: .55; }
  #show-calculated-wheel-btn { width: 100%; min-height: 46px; margin-top: 8px; border: 0; border-radius: 8px; font-weight: 600; }
  .mobile-ui .mobile-nav { z-index: 1400; }
  html:has(body.mobile-ui) { scroll-padding-bottom: calc(100px + env(safe-area-inset-bottom)); }
  .mobile-ui .modal-overlay, .mobile-ui #mobile-forecast-modal { bottom: calc(84px + env(safe-area-inset-bottom)); height: calc(100dvh - 84px - env(safe-area-inset-bottom)); }
  .mobile-ui #utility-sidebar, .mobile-ui #utility-sidebar.open { height: calc(100dvh - 71px - env(safe-area-inset-bottom)); }
  .mobile-ui .modal-content { height: 100%; max-height: 100%; }
  .mobile-ui .mf-content.modern-layout { max-height: 100%; }
  .mobile-ui .magnifier-shell { filter: none; }
  .mobile-ui #joystick-main-controls { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
  .mobile-ui #top-left-controls { margin: 14px 4px 0; }
  .mobile-ui #zoom-controls-container { justify-content: stretch; }
  .mobile-ui #zoom-controls-container .zoom-control-btn { flex: 1; width: auto; min-height: 46px; height: auto; padding: 8px; gap: 5px; background: var(--surface-input); color: var(--text-primary); border-color: var(--clinical-border); }
  .mobile-projection-controls { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 10px; padding-top: 12px; border-top: 1px solid var(--clinical-border); margin-top: 4px; }
  .mobile-projection-controls #forecast-mode-btn { width: 110px; min-height: 48px; height: auto; display: flex; gap: 7px; border-radius: 8px; }
  .projection-hint { margin: 0; font-size: 12px; line-height: 1.5; color: var(--text-secondary); }
  .projection-full-view { grid-column: 2; padding: 10px; min-height: 44px; background: var(--action-bg); color: var(--action-text); border: 0; border-radius: 8px; font-weight: 600; }
  .projection-full-view[hidden] { display: none; }
  .mobile-ui .forecast-hit-area { r: 65; }
  .mobile-ui .forecast-arrow { stroke: var(--text-primary); stroke-width: 1.5; }
  #focus-tooltip.active { pointer-events: auto; }
  .tutorial-progress { display: block; font-size: 12px; font-weight: 600; color: var(--text-secondary); }
  #focus-tooltip p { margin: 10px 0 16px; line-height: 1.6; }
  .tutorial-actions { display: flex; gap: 10px; }
  .tutorial-actions button { flex: 1; padding: 10px 14px; min-height: 44px; border: 1px solid var(--clinical-border); border-radius: 8px; background: var(--surface-input); color: var(--text-primary); }
  .tutorial-actions button:last-child { background: var(--action-bg); color: var(--action-text); }
  .mobile-ui #focus-tooltip { max-width: 380px; margin: auto; font-size: 14px; }
  .pwa-tools { border-top: 1px solid var(--clinical-border); padding-top: 16px; margin-top: 16px; color: var(--text-secondary); }
  .pwa-update-banner { position: fixed; z-index: 1600; bottom: calc(84px + env(safe-area-inset-bottom)); left: 16px; right: 16px; max-width: 520px; margin-inline: auto; padding: 16px; border: 1px solid var(--clinical-border); border-radius: 12px; background: var(--wheel-bg); color: var(--text-primary); box-shadow: 0 8px 28px #0003; }
  .pwa-update-banner[hidden] { display: none; }
  .pwa-version-status:empty { display: none; }
  .pwa-update-banner p { margin: 0 0 12px; font-size: 14px; line-height: 1.5; }
  .pwa-update-banner > div { display: flex; gap: 10px; }
  .pwa-update-banner button { flex: 1; min-height: 44px; padding: 8px 12px; border: 1px solid var(--clinical-border); border-radius: 8px; background: var(--surface-input); color: var(--text-primary); font: inherit; font-size: 13px; cursor: pointer; }
  .pwa-update-banner .pwa-apply-update { color: var(--action-text); background: var(--action-bg); }
  .pwa-tools p { font-size: 12px; line-height: 1.6; margin: 8px 0; }
  .pwa-tools button, #continue-session-btn { min-height: 44px; padding: 10px 14px; border: 1px solid var(--clinical-border); border-radius: 8px; background: var(--surface-input); color: var(--text-primary); font-size: 13px; cursor: pointer; }
  #continue-session-btn { width: 100%; margin-top: 10px; }
  #continue-session-btn[hidden], .pwa-tools button[hidden] { display: none; }
  .pwa-install-help { width: min(440px,calc(100vw - 56px)); max-height: 75dvh; overflow: auto; border: 1px solid var(--clinical-border); border-radius: 14px; background: var(--panel-bg); color: var(--text-primary); padding: 24px; font-size: 14px; line-height: 1.7; }
  .pwa-install-help h2 { font-size: 20px; line-height: 1.3; }
  .pwa-install-help button { padding: 12px 20px; min-height: 44px; border: 0; border-radius: 8px; color: var(--action-text); background: var(--action-bg); }
  .pwa-install-help::backdrop { background: #0d2538a6; }
  .app-offline .mobile-brand::after { content: 'Offline'; font-size: 10px; padding: 3px 6px; border: 1px solid var(--clinical-border); border-radius: 5px; color: var(--text-secondary); }
  body:has(#login-container) { overflow-y: auto; height: auto; min-height: 100dvh; padding-block: 64px; box-sizing: border-box; }
  .mobile-ui #global-controls .pwa-tools { grid-column: 1/-1; }
  @media (prefers-reduced-motion:reduce) {
    .manual-reveal, .manual-chevron, .magnifier, .wheel-container, #info-panel { transition: none !important; }
    .forecast-pulse-circle.pulsing { animation: none; opacity: .6; }
  }
}