/* Approved journey appearance, applied to real application screens.
   Screen-only: preserve authored SVG geometry, export renderers and print typography.
   The latest approved neutral design supersedes the previous purple/gold shell. */
@media screen{
 :root[data-theme]{
  --shell:#e1e6ea;--bg:var(--shell);--surface:#f4f6f8;--paper:var(--surface);--surface-raised:#e9ecef;
  --ink:#202426;--secondary:#5e666b;--edge:#d2d8dd;--control-edge:#7f8991;
  --hover:#dfe4e8;--selected:#202426;--selected-ink:#fff;--accent:#1d5fbf;
  --gold:var(--accent);--purple:var(--accent);--pale:var(--hover);--line:var(--edge);--muted:var(--secondary);
  --green:#226c4a;--warning-bg:#fbf6ec;--warning-ink:#79551e;--warning-edge:#cbb88d;
  --mandatory-surface:var(--warning-bg);--mandatory-ink:var(--warning-ink);
  --atc:#235d83;--atc-bg:#f1f6fa;--private:#923c35;--private-bg:#fcf3f1;
  --ui-focus:#1d5fbf;--ui-danger:#a12c35;--ui-danger-bg:#fbefef;--ui-radius:6px;
  --radius-card:8px;--radius-control:6px;--control-radius:6px;
  background:var(--shell);color:var(--ink);
 }
 :root[data-theme=dark]{
  --shell:#111214;--surface:#191b1e;--surface-raised:#222529;--ink:#f4f5f6;--secondary:#b6bdc3;
  --edge:#363b41;--control-edge:#737d86;--hover:#2b3035;--selected:#eef1f3;--selected-ink:#181b1e;
  --accent:#9abfff;--green:#8bd0a8;--warning-bg:#302a20;--warning-ink:#edcd94;--warning-edge:#8a7146;
  --atc:#a3c9e6;--atc-bg:#202b34;--private:#efb0a7;--private-bg:#332521;
  --ui-focus:#9abfff;--ui-danger:#ffb8b5;--ui-danger-bg:#332426;
 }
 [data-theme] body{background:var(--shell);background-image:none;background-attachment:initial;color:var(--ink)}
 [data-theme] :is(.topbar,.nav){background:var(--surface);color:var(--ink);box-shadow:none;border-color:var(--edge)}
 [data-theme] button{font-weight:500;border-radius:6px;box-shadow:none}
 [data-theme] :is(button.primary,.pdf-download,.topbar .pdf-preview){background:var(--selected);border-color:var(--selected);color:var(--selected-ink)}
 [data-theme] :is(button.primary,.topbar .pdf-preview):hover{filter:none;opacity:.9}
 [data-theme] :is(.brandmark,.nav-context){color:var(--ink)}
 [data-theme] .topbar .badge{background:transparent;color:var(--ink);font-size:13px}
 [data-theme] .topbar .title strong{font-weight:600;letter-spacing:-.02em}
 [data-theme] .topbar .title small{color:var(--secondary)}
 [data-theme] .topbar .save{color:var(--secondary)}
 [data-theme] .topbar .save[data-save-state=error]{color:var(--ui-danger)}
 [data-theme] .nav .nav-tabs button.active{background:transparent;color:var(--ink);font-weight:600}
 [data-theme] .nav .nav-tabs button.active:after{height:2px;background:var(--ink)}
 [data-theme] .nav .nav-tabs button:hover{background:var(--surface-raised)}
 [data-theme] :is(.paper,.editor,.sectioncard,.fleet-panel,.cloud-workspace){background:var(--surface);border-color:var(--edge);border-radius:8px;box-shadow:none}
 [data-theme] .heading{background:transparent;border:0;box-shadow:none}
 [data-theme] .heading :is(h1,.eyebrow){color:var(--ink)}
 [data-theme] .heading .actions button.primary{background:var(--selected);color:var(--selected-ink);border-color:var(--selected)}
 [data-theme] :is(.summary,.quick-setup,.setup-overview,.lesson-switcher){background:var(--surface);color:var(--ink);border-color:var(--edge)}
 [data-theme] .lesson-switcher .lesson-choice[aria-pressed=true]{background:var(--hover);border-bottom-color:var(--ink);color:var(--ink)}
 [data-theme] .lesson-switcher .lesson-add{color:var(--ink)}
 [data-theme] .lesson-table thead{background:var(--surface);color:var(--secondary);letter-spacing:0}
 [data-theme] .lesson-table th{font-size:12px;letter-spacing:0;font-weight:500}
 [data-theme] .lesson-table tbody tr:hover{background:var(--surface-raised)}
 [data-theme] .lesson-table tr.selected,[data-theme] .lesson-table tbody tr.selected:hover{background:var(--hover);color:var(--ink);box-shadow:inset 2px 0 var(--accent)}
 [data-theme] .lesson-table tr.selected td:first-child{box-shadow:none}
 [data-theme] .lesson-table tr.selected :is(.lesson-title,.lesson-title small,.scenario){color:var(--ink)}
 [data-theme] .lesson-table tr.selected :is(.time,.ref,.com,.parameterline){color:var(--secondary)}
 [data-theme] .lesson-table tr.selected :is(.m,.mode){color:var(--ink)}
 [data-theme] .lesson-table tr.selected td.mode:before{color:var(--secondary)}
 [data-theme] .lesson-table tr.selected .annotation.atc{color:var(--atc)}
 [data-theme] .lesson-table tr.selected .annotation.private{color:var(--private)}
 [data-theme] .lesson-table tr.selected .mode-tag{background:var(--surface);color:var(--ink)}
 [data-theme] .lesson-table tr.selected td.mode{background:transparent}
 [data-theme] .lesson-table :is(td,.mode){border-color:var(--edge);color:var(--ink)}
 [data-theme] .lesson-table .lesson-title{font-weight:600}
 [data-theme] .lesson-table :is(.time,.parameterline,.exercise-reference-tags){color:var(--secondary)}
 [data-theme] :is(.exercise-toolbar,.tools,.editor-head,.edit-nav,.editor-actions){background:var(--surface-raised);color:var(--ink);border-color:var(--edge)}
 [data-theme] .editor .edit-nav button.active{background:var(--hover);color:var(--ink);font-weight:600}
 [data-theme] .editor .edit-body{background:var(--surface)}
 [data-theme] :is(.field input,.field select,.field textarea,.selection-control,.selection-value,.selection-menu){border-radius:6px;box-shadow:none}
 [data-theme] .field>span:first-child{font-weight:500}
 [data-theme] :is(.field .hint,.field .field-issue){line-height:1.45}
 [data-theme] .field input[readonly]{background:var(--surface-raised);border-style:solid}
 [data-theme] .flow-modes button[aria-pressed=true],[data-theme] .suggestion-chips button[aria-pressed=true]{background:var(--selected);color:var(--selected-ink)}
 [data-theme] :is(.profile,.profile>summary){background:var(--surface);color:var(--ink);border-color:var(--edge);box-shadow:none}
 [data-theme] .profile>summary{border-radius:6px}
 /* SVG artwork, sizes and event coordinate transforms deliberately stay in the profile renderer. */
 [data-theme] :is(.cloud-notice,.cloud-catchup,.fleet-return){background:var(--surface);border:1px solid var(--edge);border-radius:8px;color:var(--ink)}
 [data-theme] .cloud-catchup{border-left:3px solid var(--accent)}
 [data-theme] .cloud-revision{font-size:14px;border-radius:6px;padding:12px;gap:5px}
 [data-theme] .cloud-revision.is-selected{background:var(--hover);border-color:var(--edge)}
 [data-theme] .cloud-state,[data-theme] .fleet-state{display:inline-flex;align-items:center;border-radius:4px;background:var(--hover);padding:2px 7px;font-size:12px;font-weight:400;color:var(--ink);white-space:nowrap;max-width:100%}
 [data-theme] .fleet-state[data-state=approved],[data-theme] .fleet-state[data-state=issued]{background:var(--surface-raised);color:var(--green)}
 [data-theme] .cloud-title h1{font-size:24px;font-weight:600;letter-spacing:-.02em}
 [data-theme] :is(.cloud-detail h2,.cloud-history h2,.cloud-discussion h3,.cloud-catchup h3){font-size:18px;font-weight:600}
 [data-theme] :is(.cloud-title p,.cloud-detail-heading p,.cloud-comment,.cloud-diff){font-size:14px}
 [data-theme] :is(.cloud-before,.cloud-after){color:var(--ink)}
 [data-theme] .cloud-before{color:var(--secondary)}
 [data-theme] .cloud-after{border-left:2px solid var(--accent)}
 [data-theme] .cloud-comment{border-color:var(--edge)}
 [data-theme] :is(.foot,.fleet-footer){background:transparent;border:0;border-top:1px solid var(--edge);border-radius:0;box-shadow:none;color:var(--secondary);font-size:12px;line-height:1.5}
 [data-theme] dialog{background:var(--surface);color:var(--ink);border:1px solid var(--control-edge);border-radius:8px;box-shadow:0 16px 56px #0002}
 [data-theme] dialog::backdrop{background:#11182766;backdrop-filter:none}
 [data-theme] dialog h2{font-size:22px;font-weight:600}
 [data-theme] :is(dialog p,dialog .field){font-size:14px}
 [data-theme] .google-member{border-color:var(--edge)}
 [data-theme] .google-member h3{font-size:16px;font-weight:600}
 [data-theme] .google-member p{font-size:13px}
 /* Same single-header shell as the approved preview. Canvas: 1200 - 2×24 = 1152px. */
 [data-theme] .fleet-shell{display:block;min-height:100dvh;background:var(--shell);font-size:14px}
 [data-theme] .fleet-sidebar{display:grid;grid-template-columns:180px 100px minmax(0,1fr) auto;align-items:center;gap:20px;padding:14px max(24px,calc((100vw - 1152px)/2));border:0;border-bottom:1px solid var(--edge);background:var(--surface)}
 [data-theme] .fleet-brand{position:relative;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;line-height:1.3}
 .fleet-brand-symbol{width:28px;height:28px;flex:none}
 [data-theme] .fleet-brand small{font-size:12px;font-weight:400;color:var(--secondary);margin-top:3px}
 [data-theme] .fleet-sidebar>label{font-size:12px;gap:3px;color:var(--secondary);min-width:0}
 [data-theme] .fleet-sidebar select{min-height:32px;border:1px solid var(--control-edge);border-radius:6px;background:var(--surface);font-size:13px;padding:4px 8px;color:var(--ink);font-weight:400}
 [data-theme] .fleet-sidebar nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px}
 [data-theme] .fleet-sidebar nav button{border:0;background:transparent;font-size:13px;padding:7px 9px;min-height:36px;border-radius:6px;white-space:nowrap}
 [data-theme] .fleet-sidebar nav button[aria-current=page]{background:var(--hover);color:var(--ink);font-weight:500}
 [data-theme] .fleet-sidebar .fleet-account{margin:0;display:grid;grid-template-columns:auto auto;gap:0 12px;align-items:center;font-size:13px}
 [data-theme] .fleet-account strong{font-weight:500;max-width:160px;overflow-wrap:anywhere}
 [data-theme] .fleet-account small{font-size:12px;grid-column:1}
 [data-theme] .fleet-account button{grid-column:2;grid-row:1/3;margin:0;font-size:12px;min-height:32px;padding:4px 8px}
 [data-theme] .fleet-account>span{max-width:150px;font-size:12px;color:var(--secondary)}
 [data-theme] .fleet-sidebar .fleet-menu-toggle{display:none}
 [data-theme] .fleet-canvas{width:100%;max-width:1200px;margin:0 auto;padding:24px;min-width:0}
 [data-theme] .fleet-heading{margin-bottom:24px;gap:16px;align-items:center}
 [data-theme] .fleet-heading h1{font-size:26px;font-weight:600;letter-spacing:-.025em;margin:8px 0}
 [data-theme] .fleet-heading p{font-size:14px;color:var(--secondary)}
 [data-theme] .fleet-heading>label{font-size:13px;font-weight:400;margin:0}
 [data-theme] .fleet-panel{margin-bottom:16px}
 [data-theme] .fleet-panel-heading{padding:16px 20px;border-bottom:1px solid var(--edge)}
 [data-theme] .fleet-panel h2{font-size:16px;font-weight:600}
 [data-theme] .fleet-packages{font-size:14px}
 [data-theme] .fleet-packages th{font-size:12px;letter-spacing:0}
 [data-theme] .fleet-packages td,[data-theme] .fleet-packages th{padding:16px 20px;border-color:var(--edge)}
 [data-theme] .fleet-packages strong{font-weight:500}
 [data-theme] .fleet-packages small{font-size:12px;color:var(--secondary)}
 [data-theme] .fleet-packages button{font-size:13px;min-height:36px;padding:7px 10px}
 [data-theme] .fleet-home-actions{gap:8px;margin:16px 0}
 [data-theme] .fleet-freshness{font-size:12px}
 [data-theme] .fleet-return{padding:16px 20px;gap:16px}
 [data-theme] .fleet-return p{font-size:13px}
 [data-theme] .fleet-compare{background:var(--surface);border-color:var(--edge);padding:20px;gap:16px}
 [data-theme] .fleet-compare strong{font-weight:500;font-size:20px}
 [data-theme] .fleet-canvas .active-package-heading{margin-bottom:20px}
 [data-theme] .fleet-footer{padding:16px 0;margin-top:24px}
 /* Real sign-in method stays rendered by signinMarkup; no email/passkey promises here. */
 [data-theme] .fleet-signin{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px;max-width:940px;margin:28px auto;background:transparent;border:0;border-radius:0;overflow:visible;padding:0}
 [data-theme] .signin-main{background:var(--surface);border:1px solid var(--edge);border-radius:8px;padding:30px;min-width:0}
 [data-theme] .signin-main h1{font-size:26px;letter-spacing:-.025em;line-height:1.25;margin:12px 0}
 [data-theme] .signin-main p{color:var(--secondary);margin:0 0 22px}
 .signin-icon{display:block;width:40px;height:40px;margin-bottom:20px;color:var(--ink)}
 .signin-step{font-size:12px;color:var(--secondary);margin-bottom:20px}
 [data-theme] .signin-main .field{gap:7px;margin-bottom:16px}
 [data-theme] .signin-main .field input{min-height:42px}
 [data-theme] .signin-main form button{width:100%;justify-self:stretch;min-height:40px;font-size:14px}
 [data-theme] .signin-main .field>span:first-child{font-size:13px}
 [data-theme] .signin-local{background:transparent;border:0;padding:20px 0;min-width:0}
 [data-theme] .signin-local h2{font-size:24px;line-height:1.3;letter-spacing:-.02em;margin-bottom:16px}
 [data-theme] .signin-local p{color:var(--secondary);font-size:14px;line-height:1.55}
 .signin-path{display:flex;align-items:center;gap:12px;border-block:1px solid var(--edge);padding:16px 0;margin:24px 0;font-size:12px;color:var(--secondary)}
 .signin-path span{white-space:nowrap}
 #email-journey .signin-main>button{margin:8px 8px 0 0;min-height:40px}
 #email-journey .signin-main>button.primary{display:block;width:100%;margin:16px 0 8px}
 #email-journey .signin-main h1{overflow-wrap:anywhere}
 .email-identity{margin:18px 0;border-block:1px solid var(--edge)}
 .email-identity p{display:flex;justify-content:space-between;gap:16px;padding:10px 0;margin:0!important;font-size:13px!important;border-bottom:1px solid var(--edge)}
 .email-identity p:last-child{border:0}
 .email-identity strong{font-weight:500;color:var(--ink);text-align:right;overflow-wrap:anywhere;min-width:0}
 .email-check{display:inline-flex;align-items:center;gap:8px;margin:8px 12px 12px 0;font-size:14px}
 .email-check input{width:18px;height:18px;accent-color:var(--selected)}
 .email-admin-grid{display:grid;grid-template-columns:minmax(280px,1fr) minmax(0,1.5fr);gap:16px;align-items:start}
 .email-panel{padding:20px;min-width:0}
 .email-panel h2{margin-bottom:16px}
 .email-panel fieldset{border:1px solid var(--edge);padding:12px;border-radius:6px;margin:16px 0}
 .email-panel legend{font-size:13px;padding:0 5px}
 .email-panel form>.primary{min-height:40px;margin-top:8px}
 .email-member{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:16px 0;border-bottom:1px solid var(--edge);font-size:14px}
 .email-member:last-child{border:0}
 .email-member>div{min-width:0}
 .email-member strong{font-weight:500}
 .email-member p{font-size:13px;margin:4px 0;overflow-wrap:anywhere}
 .email-member small{font-size:12px;color:var(--secondary)}
 .email-member .actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
 [data-theme] .signin-local .signin-recovery-note{font-size:12px;line-height:1.5;margin-top:16px}
 [data-theme] .fleet-shell:has(.fleet-signin) .fleet-sidebar>label{visibility:hidden}
 [data-theme] button:disabled{opacity:1;color:var(--secondary);background:var(--surface-raised)}
 /* iPhone/iPad: reveal a text action by swiping; never show a standing trash icon.
    Keyboard focus still exposes the action for attached keyboards. */
 :root[data-theme][data-touch-input=true] #table-wrap tr[data-row]{touch-action:pan-y pinch-zoom;--exercise-swipe-offset:0px}
 /* Tablet rows use table layout: touch-action must be on cells/blocks, not only tr. */
 :root[data-theme][data-touch-input=true] #table-wrap :is(td,.lesson-title){touch-action:pan-y pinch-zoom}
 :root[data-theme][data-touch-input=true] #table-wrap .row-drag-handle{touch-action:none}
 :root[data-theme][data-touch-input=true] .lesson-table .row-delete-button{opacity:var(--exercise-delete-reveal,0);pointer-events:none;color:#fff;background:#b51f36;border-color:#b51f36;padding:3px;font-size:12px;transform:translateX(12px)}
 :root[data-theme][data-touch-input=true] .lesson-table .row-delete-button svg{display:none}
 :root[data-theme][data-touch-input=true] .lesson-table .row-delete-button:after{content:'Delete'}
 :root[data-theme][data-touch-input=true] .lesson-table .swipe-delete-open .row-delete-button,
 :root[data-theme][data-touch-input=true] .lesson-table .row-delete-button:focus-visible{opacity:1;pointer-events:auto;transform:none}
 :root[data-theme][data-touch-input=true] #table-wrap tr.swipe-delete-open{--exercise-swipe-offset:-48px}
 :root[data-theme][data-touch-input=true] #table-wrap tr[data-row]>td.time,
 :root[data-theme][data-touch-input=true] #table-wrap tr[data-row]>.exercise-content{translate:var(--exercise-swipe-offset) 0;transition:translate 180ms cubic-bezier(.2,.7,.2,1)}
 :root[data-theme][data-touch-input=true] #table-wrap tr.exercise-swiping>td.time,
 :root[data-theme][data-touch-input=true] #table-wrap tr.exercise-swiping>.exercise-content{transition:none}
 /* Preserve the established compact editor insets and phone exercise/chart views. */
 @media(min-width:1500px){[data-theme] .workspace{max-width:1600px}}
 @media(min-width:651px) and (max-width:1150px){
  [data-theme] .fleet-sidebar{grid-template-columns:180px 100px 1fr;gap:12px;padding:12px 24px}
  [data-theme] .fleet-sidebar nav{grid-column:1/-1;grid-row:2;justify-content:flex-start}
  [data-theme] .fleet-account{justify-self:end}
  [data-theme] .fleet-packages td,[data-theme] .fleet-packages th{padding:12px}
  [data-theme] .fleet-signin{gap:28px}
  .email-admin-grid{grid-template-columns:1fr}
 }
 @media(any-pointer:coarse),(max-width:650px){
  [data-theme] :is(.fleet-sidebar nav button,.fleet-account button,.fleet-packages button,.fleet-home-actions button,.fleet-return button,.signin-main form button){min-height:44px}
  [data-theme] :is(.field input,.field select,.field textarea){font-size:16px}
 }
 @media(max-width:650px){
  :root[data-theme][data-touch-input=true] .lesson-table td.row-delete-cell .row-delete-button{pointer-events:none}
  :root[data-theme][data-touch-input=true] .lesson-table .swipe-delete-open td.row-delete-cell .row-delete-button,
  :root[data-theme][data-touch-input=true] .lesson-table td.row-delete-cell .row-delete-button:focus-visible{pointer-events:auto}
  :root[data-theme][data-touch-input=true] .lesson-table tbody tr[data-row]:not(.swipe-delete-open):not(:has(.row-delete-button:focus-visible)){padding-bottom:8px}
  :root[data-theme][data-touch-input=true] .lesson-table tbody tr[data-row]:has(.mode-tags):not(.swipe-delete-open):not(:has(.row-delete-button:focus-visible)){padding-bottom:48px}
  :root[data-theme][data-touch-input=true] .lesson-table tbody tr[data-row]:not(.swipe-delete-open):not(:has(.row-delete-button:focus-visible)) .mode-tags{right:var(--panel-inset)}
  [data-theme] .fleet-sidebar{display:flex;flex-wrap:wrap;gap:12px;padding:12px 16px}
  [data-theme] .fleet-sidebar .fleet-brand{width:100%;justify-content:flex-start;gap:9px}
  [data-theme] .fleet-sidebar .fleet-brand>span{flex:1}
  [data-theme] .fleet-sidebar .fleet-menu-toggle{display:inline-flex;min-height:44px;align-items:center;font-size:13px;border:1px solid var(--control-edge);padding:6px 12px}
  [data-theme] .fleet-sidebar>label{flex:1 1 100%;width:100%}
  [data-theme] .fleet-sidebar select{min-height:44px;font-size:16px;padding:8px}
  [data-theme] .fleet-sidebar nav{width:100%;justify-content:flex-start;gap:4px;white-space:normal;overflow:visible}
  [data-theme] .fleet-sidebar nav button{font-size:13px;padding:8px}
  [data-theme] .fleet-sidebar .fleet-account{width:100%;padding-top:8px;border-top:1px solid var(--edge)}
  [data-theme] .fleet-shell:has(.fleet-signin) .fleet-sidebar>label{display:none}
  [data-theme] .fleet-canvas{padding:16px}
  [data-theme] .fleet-heading{align-items:flex-start;margin-bottom:18px;gap:12px}
  [data-theme] .fleet-heading h1{font-size:23px}
  [data-theme] .fleet-heading>label{display:grid;gap:4px;font-size:12px;flex:none}
  [data-theme] .fleet-heading input{min-height:44px;width:85px;font-size:16px;padding:6px}
  [data-theme] .fleet-panel-heading{padding:14px}
  [data-theme] .fleet-packages tr{padding:14px;gap:8px}
  [data-theme] .fleet-packages td{padding:0}
  [data-theme] .fleet-state{font-size:12px;white-space:normal}
  [data-theme] .fleet-home-actions button{font-size:13px}
  [data-theme] .fleet-compare{padding:16px;gap:12px}
  [data-theme] .fleet-compare strong{font-size:17px}
  [data-theme] .fleet-signin{display:block;margin:8px auto;max-width:480px}
  [data-theme] .signin-main{padding:24px 20px}
  [data-theme] .signin-main h1{font-size:23px}
  [data-theme] .signin-local{padding:24px 4px 0}
  [data-theme] .signin-local h2{font-size:21px}
  [data-theme] .signin-local button{min-height:44px;width:100%;font-size:13px}
  [data-theme] .signin-path{gap:10px;flex-wrap:wrap;margin:20px 0}
  [data-theme] .fleet-footer{font-size:12px;margin-top:20px}
  [data-theme] .cloud-title h1{font-size:23px}
  .email-admin-grid{grid-template-columns:1fr}
  .email-panel{padding:16px}
  .email-member{align-items:flex-start;flex-wrap:wrap}
  .email-member .actions{justify-content:flex-start}
  #email-journey button{min-height:44px}
 }
 @media(prefers-reduced-motion:reduce){[data-theme] button{transition:none}
  :root[data-theme][data-touch-input=true] #table-wrap tr[data-row]>td.time,
  :root[data-theme][data-touch-input=true] #table-wrap tr[data-row]>.exercise-content{transition:none;translate:none}
 }
}
