/* HPA TERMINAL V22 — mobile-first shell */
:root { --hpa-mobile-bar: 52px; --hpa-mobile-dock: 58px; }

.hpa-mobile-bar,
.hpa-mobile-overlay,
.hpa-mobile-dock { display:none; }

@media (max-width: 900px) {
  html, body { max-width:100%; overflow-x:hidden; }
  body {
    padding-top: var(--hpa-mobile-bar) !important;
    padding-bottom: calc(var(--hpa-mobile-dock) + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Compact command bar */
  .hpa-mobile-bar {
    display:grid;
    grid-template-columns: 44px minmax(0,1fr) 44px;
    align-items:center;
    position:fixed;
    inset:0 0 auto 0;
    height:calc(var(--hpa-mobile-bar) + env(safe-area-inset-top, 0px));
    padding:env(safe-area-inset-top, 0px) 8px 0;
    z-index:5000;
    background:rgba(190,194,197,.96);
    border-bottom:1px solid var(--hpa-line);
    box-shadow:0 6px 18px rgba(18,21,33,.18);
    backdrop-filter: blur(7px);
  }
  .hpa-mobile-bar button {
    width:40px; height:38px; min-height:38px !important;
    padding:0 !important;
    border:1px solid var(--hpa-line) !important;
    background:transparent !important;
    color:var(--hpa-ink) !important;
    font:inherit;
  }
  .hpa-mobile-title {
    min-width:0;
    text-align:center;
    font-size:.78rem;
    font-weight:900;
    letter-spacing:.08em;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .hpa-mobile-title small { display:block; font-size:.56rem; opacity:.65; letter-spacing:.12em; margin-top:2px; }
  .hpa-mobile-theme { font-size:1.05rem !important; }

  /* Off-canvas left terminal */
  .hpa-side-rail {
    position:fixed !important;
    left:0 !important;
    top:0 !important;
    width:min(86vw, 340px) !important;
    height:100dvh !important;
    max-height:none !important;
    margin:0 !important;
    padding:calc(var(--hpa-mobile-bar) + env(safe-area-inset-top, 0px) + 8px) 10px 18px !important;
    overflow-y:auto !important;
    z-index:4900 !important;
    transform:translateX(-105%);
    transition:transform .22s ease;
    background:var(--hpa-bg);
    background-image: radial-gradient(var(--hpa-ink) .45px, transparent .45px);
    background-size:3px 3px;
    box-shadow:10px 0 32px rgba(18,21,33,.34);
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  body.hpa-mobile-nav-open .hpa-side-rail { transform:translateX(0); }
  .hpa-mobile-overlay {
    display:block;
    position:fixed;
    inset:0;
    z-index:4800;
    background:rgba(0,0,0,.54);
    opacity:0;
    pointer-events:none;
    transition:opacity .2s ease;
  }
  body.hpa-mobile-nav-open .hpa-mobile-overlay { opacity:1; pointer-events:auto; }
  body.hpa-mobile-nav-open { overflow:hidden; }
  .hpa-profile-card { grid-template-columns:70px 1fr !important; gap:10px !important; }
  .hpa-avatar-frame { width:70px !important; }
  .hpa-rail-card { padding:11px !important; }
  .hpa-rail-nav a { min-height:44px; padding:11px 8px !important; }

  /* The document becomes a single reading column */
  body.hpa-shell-ready > .container,
  body.hpa-right-rail-ready.hpa-shell-ready > .container,
  body.archive-page.hpa-right-rail-ready.hpa-shell-ready > .container,
  body.newsletter-admin-page.hpa-right-rail-ready.hpa-shell-ready > .container,
  body.admin-composer-page.hpa-shell-ready.hpa-right-rail-ready > .container,
  body.newsletter-admin-page.hpa-shell-ready.hpa-right-rail-ready > .newsletter-admin,
  body.newsletter-admin-page > .newsletter-admin {
    width:calc(100% - 16px) !important;
    max-width:none !important;
    margin:8px auto 18px !important;
    padding:14px !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  body.hpa-shell-ready header { margin-bottom:14px !important; padding-bottom:12px !important; }
  body.hpa-shell-ready header h1,
  .composer-masthead h1,
  .newsletter-header h1 { font-size:clamp(1.5rem, 8vw, 2.15rem) !important; line-height:1.05; overflow-wrap:anywhere; }
  header p, .composer-masthead p, .newsletter-header p { font-size:.72rem !important; }

  .top-nav { display:none !important; }

  /* Ticker gets its own readable mobile lane */
  .ticker-wrap {
    position:relative !important;
    width:100% !important;
    min-height:34px !important;
    height:34px !important;
    overflow:hidden !important;
    border-left:0 !important;
    border-right:0 !important;
  }
  .ticker-title { min-width:64px !important; width:64px !important; font-size:.62rem !important; line-height:1.05 !important; padding:5px 6px !important; }
  .ticker, .news-ticker, #news-ticker { font-size:.69rem !important; line-height:34px !important; }

  /* Cards and dossiers */
  .system-panel,
  .post-card,
  .dossier-link,
  .comment,
  .newsletter-panel,
  .editor-shell { padding:12px !important; min-width:0 !important; }
  .post-card img,
  .dossier-link img,
  .post-image,
  .header-image,
  article img,
  .post-body img { max-width:100% !important; height:auto !important; }
  .author-meta { flex-wrap:wrap; gap:7px !important; }

  /* Right telemetry becomes an inline signal deck */
  .hpa-right-rail {
    position:relative !important;
    inset:auto !important;
    width:calc(100% - 16px) !important;
    max-width:none !important;
    margin:12px auto 18px !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    max-height:none !important;
    overflow:visible !important;
    z-index:1 !important;
  }
  .hpa-right-card { min-width:0 !important; padding:11px !important; }
  .hpa-right-heading { font-size:.7rem !important; }
  .hpa-monitor-grid div { gap:8px !important; }
  .hpa-monitor-grid span, .hpa-monitor-grid strong,
  .hpa-activity-log, .hpa-intercept-meta { font-size:.65rem !important; }
  .hpa-random-thumb { width:100% !important; max-height:150px !important; object-fit:cover; }

  /* Forms become thumb-friendly */
  input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  textarea,
  select,
  button,
  .action-button { font-size:16px !important; max-width:100%; box-sizing:border-box; }
  input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  textarea,
  select { width:100% !important; }
  button, .action-button { min-height:42px !important; }
  .profile-avatar-editor { grid-template-columns:1fr !important; }
  .profile-avatar-preview { width:108px !important; height:108px !important; }

  /* Rich editors: horizontal command strip + large writing surface */
  .editor-toolbar,
  .rich-toolbar,
  .newsletter-toolbar {
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:5px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    padding:7px !important;
    position:sticky;
    top:calc(var(--hpa-mobile-bar) + env(safe-area-inset-top, 0px));
    z-index:60;
  }
  .editor-toolbar > *, .rich-toolbar > *, .newsletter-toolbar > * { flex:0 0 auto !important; }
  .editor-toolbar button, .newsletter-toolbar button { min-height:38px !important; }
  .editor-toolbar select, .newsletter-toolbar select { width:auto !important; min-width:92px; font-size:.72rem !important; }
  .toolbar-sep { display:none !important; }
  .rich-editor,
  #post-editor,
  #newsletter-editor,
  .newsletter-editor {
    min-height:52vh !important;
    height:auto !important;
    padding:16px !important;
    font-size:16px !important;
    line-height:1.55 !important;
    overflow-wrap:anywhere;
  }
  .image-tool-row,
  .upload-row { display:flex !important; flex-wrap:wrap !important; gap:6px !important; }
  .image-tool-row button, .upload-row button { flex:1 1 120px; }

  /* Dossier composer */
  .composer-masthead,
  .newsletter-header,
  .workstation-masthead {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:16px !important;
  }
  .composer-status,
  .workstation-header-actions { width:100% !important; text-align:left !important; box-sizing:border-box; }
  .composer-direct-grid,
  .newsletter-console-grid,
  .newsletter-grid,
  .composer-grid,
  .meta-grid {
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  .composer-side-panel,
  .newsletter-operations-column { order:2; width:auto !important; min-width:0 !important; }
  .newsletter-compose-column { min-width:0 !important; }
  .newsletter-statusbar { overflow-x:auto !important; white-space:nowrap; padding:8px !important; }
  .editor-heading-row { align-items:flex-start !important; gap:8px !important; }
  .editor-heading-row #preview-button { flex:0 0 auto; }
  .operation-card { position:static !important; }
  dialog.newsletter-preview-dialog { width:calc(100vw - 16px) !important; max-width:none !important; height:calc(100dvh - 30px); margin:auto; }

  /* Post page readability */
  article, .post-content, .post-body { min-width:0; overflow-wrap:anywhere; }
  pre, code { max-width:100%; overflow-x:auto; white-space:pre-wrap; word-break:break-word; }
  table { display:block; max-width:100%; overflow-x:auto; }

  /* Bottom command dock */
  .hpa-mobile-dock {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    position:fixed;
    left:8px; right:8px;
    bottom:max(8px, env(safe-area-inset-bottom, 0px));
    min-height:var(--hpa-mobile-dock);
    z-index:4700;
    border:1px solid var(--hpa-line);
    background:rgba(190,194,197,.96);
    box-shadow:0 -8px 24px rgba(18,21,33,.22);
    backdrop-filter:blur(8px);
  }
  .hpa-mobile-dock a {
    display:grid;
    place-items:center;
    min-width:0;
    padding:7px 4px;
    text-align:center;
    text-decoration:none;
    color:var(--hpa-ink);
    border-right:1px dotted var(--hpa-soft-line);
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.04em;
  }
  .hpa-mobile-dock a:last-child { border-right:0; }
  .hpa-mobile-dock a.is-current { background:var(--hpa-ink); color:var(--hpa-bg); }

  /* Dark mobile chrome */
  html.hpa-dark-theme .hpa-mobile-bar,
  html.hpa-dark-theme .hpa-mobile-dock {
    background:rgba(8,10,12,.97) !important;
    border-color:rgba(230,35,42,.62) !important;
    color:#f2f2f2 !important;
  }
  html.hpa-dark-theme .hpa-mobile-bar button { color:#f2f2f2 !important; border-color:rgba(230,35,42,.55) !important; }
  html.hpa-dark-theme .hpa-mobile-dock a { color:#efefef; border-color:rgba(230,35,42,.24); }
  html.hpa-dark-theme .hpa-mobile-dock a.is-current { background:#d71920; color:#fff; }
  html.hpa-dark-theme .hpa-side-rail { background:#080a0c !important; background-image:radial-gradient(rgba(214,31,38,.32) .48px, transparent .52px) !important; }
}

@media (max-width: 560px) {
  body.hpa-shell-ready > .container,
  body.hpa-right-rail-ready.hpa-shell-ready > .container,
  body.newsletter-admin-page > .newsletter-admin { width:calc(100% - 10px) !important; padding:10px !important; }
  .hpa-right-rail { grid-template-columns:1fr !important; width:calc(100% - 10px) !important; }
  .hpa-right-card { padding:10px !important; }
  .system-panel, .post-card, .dossier-link, .comment, .newsletter-panel { padding:10px !important; }
  .composer-masthead, .newsletter-header, .workstation-masthead { padding:12px !important; }
  .composer-status, .workstation-header-actions { font-size:.65rem !important; }
  .editor-heading-row { display:grid !important; grid-template-columns:1fr !important; }
  .editor-heading-row #preview-button { width:100%; }
  .rich-editor, #post-editor, #newsletter-editor, .newsletter-editor { min-height:58vh !important; padding:13px !important; }
  .author-avatar, .comment-avatar { width:28px !important; height:28px !important; }
}

@media (max-width: 360px) {
  .hpa-mobile-title { font-size:.69rem; }
  .hpa-mobile-dock a { font-size:.61rem; }
  .hpa-side-rail { width:92vw !important; }
}


/* HPA V23 // mobile dossier reader */
@media (max-width:900px) {
  body.hpa-post-reader-page.hpa-shell-ready > .container,
  body.hpa-post-reader-page.hpa-right-rail-ready.hpa-shell-ready > .container {
    width:calc(100% - 12px) !important;
    margin:7px auto 16px !important;
    padding:11px !important;
  }
  body.hpa-post-reader-page .hpa-side-rail {
    display:grid !important;
    visibility:visible !important;
    opacity:1 !important;
  }
  body.hpa-post-reader-page .hpa-right-rail {
    display:grid !important;
    visibility:visible !important;
    opacity:1 !important;
    grid-template-columns:1fr !important;
  }
  body.hpa-post-reader-page #post-root > article { padding:12px !important; }
  body.hpa-post-reader-page #post-root > article > h1 { font-size:clamp(1.45rem,8vw,2rem) !important; }
  body.hpa-post-reader-page .post-body { font-size:1rem !important; line-height:1.65 !important; }
}