/* === ASTERRVN phone typography (<=640px): boot / about / folders — no hero, tag, topbar, illusion === */
@media (max-width: 640px) {
  /* Scrollable shell: keep last folder rows clear of mobile browser chrome */
  body.asterrvn-viewer-narrow #content,
  body.asterrvn-phone #content {
    box-sizing: border-box;
    padding-bottom: max(72px, calc(64px + env(safe-area-inset-bottom, 0px))) !important;
  }

  body.asterrvn-viewer-narrow #termBody.terminal-body,
  body.asterrvn-phone #termBody.terminal-body {
    --ast-phone-mono: clamp(11px, 3.05vw, 13px);
    --ast-phone-lh: 1.35;
    --ast-phone-small: clamp(9px, 2.45vw, 11px);
    font-size: var(--ast-phone-mono) !important;
    line-height: var(--ast-phone-lh) !important;
    letter-spacing: 0;
  }
  body.asterrvn-viewer-narrow #termBody .term-line,
  body.asterrvn-phone #termBody .term-line {
    font-size: inherit;
    line-height: inherit;
    letter-spacing: 0;
  }
  body.asterrvn-viewer-narrow #termBody .term-line .ru,
  body.asterrvn-phone #termBody .term-line .ru {
    font-size: inherit !important;
    line-height: inherit !important;
    letter-spacing: 0;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.tools-subline,
  body.asterrvn-phone #termBody .term-line.tools-subline {
    padding-left: 2px !important;
    letter-spacing: 0 !important;
    font-size: inherit !important;
    line-height: inherit !important;
  }
  /* Replace jittery ASCII divider text with a single dotted rule (content hidden) */
  body.asterrvn-viewer-narrow #termBody .term-line.divider,
  body.asterrvn-phone #termBody .term-line.divider {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 6px 0 !important;
    padding: 4px 0 3px !important;
    font-size: 0 !important;
    line-height: 0 !important;
    letter-spacing: 0 !important;
    color: transparent !important;
    text-shadow: none !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    border: none !important;
    border-top: 1px dotted rgba(255, 255, 255, 0.14) !important;
    background: none !important;
  }
  body.asterrvn-viewer-narrow #termBody .folder-list,
  body.asterrvn-phone #termBody .folder-list {
    font-size: clamp(11px, 3vw, 13px) !important;
    line-height: var(--ast-phone-lh) !important;
    letter-spacing: 0;
  }
  body.asterrvn-viewer-narrow #termBody .folder-row,
  body.asterrvn-phone #termBody .folder-row {
    font-size: inherit !important;
    line-height: inherit !important;
    background-size: 100% 1px !important;
    background-position: 0 100% !important;
  }
  body.asterrvn-viewer-narrow #termBody .folder-row .ico,
  body.asterrvn-phone #termBody .folder-row .ico {
    font-size: var(--ast-phone-small) !important;
  }
  body.asterrvn-viewer-narrow #termBody .folder-row .name,
  body.asterrvn-phone #termBody .folder-row .name {
    font-size: inherit !important;
    letter-spacing: 0.015em;
  }
  body.asterrvn-viewer-narrow #termBody .folder-row .meta,
  body.asterrvn-viewer-narrow #termBody .folder-row .size,
  body.asterrvn-phone #termBody .folder-row .meta,
  body.asterrvn-phone #termBody .folder-row .size {
    font-size: var(--ast-phone-small) !important;
    letter-spacing: 0.015em;
  }
  body.asterrvn-viewer-narrow #termBody .terminal-section-divider,
  body.asterrvn-phone #termBody .terminal-section-divider {
    margin: 7px 0 4px !important;
    font-size: clamp(9px, 2.45vw, 11px) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
  }

  body.asterrvn-viewer-narrow .about-view .aboutme-view,
  body.asterrvn-phone .about-view .aboutme-view {
    --ast-phone-mono: clamp(11px, 3.05vw, 13px);
    --ast-phone-lh: 1.35;
    --ast-phone-small: clamp(9px, 2.45vw, 11px);
    --ast-phone-section: clamp(10px, 2.85vw, 12px);
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .about-section .section-title,
  body.asterrvn-phone .about-view .aboutme-view .about-section .section-title {
    font-size: var(--ast-phone-section);
    line-height: var(--ast-phone-lh);
    letter-spacing: 0.04em;
    gap: 8px;
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .id-card-head,
  body.asterrvn-phone .about-view .aboutme-view .id-card-head {
    font-size: var(--ast-phone-small);
    line-height: var(--ast-phone-lh);
    letter-spacing: 0.04em;
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .id-card-body,
  body.asterrvn-phone .about-view .aboutme-view .id-card-body {
    font-size: var(--ast-phone-mono);
    line-height: var(--ast-phone-lh);
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .id-card-body .id-row,
  body.asterrvn-phone .about-view .aboutme-view .id-card-body .id-row {
    grid-template-columns: minmax(64px, 0.36fr) minmax(0, 1fr) !important;
    gap: 6px 10px !important;
    align-items: start !important;
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .id-row .k,
  body.asterrvn-phone .about-view .aboutme-view .id-row .k {
    font-size: var(--ast-phone-small);
    letter-spacing: 0.04em;
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .id-row .v,
  body.asterrvn-viewer-narrow .about-view .aboutme-view .id-row .v.ru,
  body.asterrvn-phone .about-view .aboutme-view .id-row .v,
  body.asterrvn-phone .about-view .aboutme-view .id-row .v.ru {
    font-size: var(--ast-phone-mono) !important;
    line-height: var(--ast-phone-lh) !important;
    letter-spacing: 0;
    min-width: 0 !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    hyphens: manual;
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .manifesto,
  body.asterrvn-phone .about-view .aboutme-view .manifesto {
    font-size: var(--ast-phone-mono);
    line-height: var(--ast-phone-lh);
    letter-spacing: 0;
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .manifesto p,
  body.asterrvn-phone .about-view .aboutme-view .manifesto p {
    font-size: inherit;
    line-height: inherit;
    letter-spacing: 0;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    white-space: normal;
    text-wrap: pretty;
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .theme-tag,
  body.asterrvn-viewer-narrow .about-view .aboutme-view .theme-tag.ru,
  body.asterrvn-phone .about-view .aboutme-view .theme-tag,
  body.asterrvn-phone .about-view .aboutme-view .theme-tag.ru {
    font-size: var(--ast-phone-small) !important;
    line-height: var(--ast-phone-lh) !important;
    letter-spacing: 0.02em;
  }
  body.asterrvn-viewer-narrow .about-view .aboutme-view .channel .ch-name,
  body.asterrvn-viewer-narrow .about-view .aboutme-view .channel .ch-handle,
  body.asterrvn-phone .about-view .aboutme-view .channel .ch-name,
  body.asterrvn-phone .about-view .aboutme-view .channel .ch-handle {
    font-size: var(--ast-phone-small);
    line-height: var(--ast-phone-lh);
  }

  /* LOAD user_profile — vertical mobile composition (name / role / studio / tools) */
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv,
  body.asterrvn-phone #termBody .term-line.profile-kv {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.12rem 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0.12rem 0 0.32rem;
    box-sizing: border-box;
    font-size: clamp(11px, 3vw, 13px) !important;
    line-height: 1.36 !important;
    letter-spacing: 0.01em !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv > .ru,
  body.asterrvn-phone #termBody .term-line.profile-kv > .ru {
    display: contents;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv .profile-k,
  body.asterrvn-phone #termBody .term-line.profile-kv .profile-k {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    font-size: clamp(9px, 2.5vw, 11px) !important;
    line-height: 1.28 !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    opacity: 0.7 !important;
    margin: 0 !important;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv .profile-sep,
  body.asterrvn-phone #termBody .term-line.profile-kv .profile-sep {
    display: none !important;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv .profile-v,
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv .profile-role-stack,
  body.asterrvn-phone #termBody .term-line.profile-kv .profile-v,
  body.asterrvn-phone #termBody .term-line.profile-kv .profile-role-stack {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0 !important;
    font-size: inherit !important;
    line-height: 1.36 !important;
    letter-spacing: 0 !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv .profile-role-stack,
  body.asterrvn-phone #termBody .term-line.profile-kv .profile-role-stack {
    margin-top: 0.1rem;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv .profile-role-stack .profile-role-line,
  body.asterrvn-phone #termBody .term-line.profile-kv .profile-role-stack .profile-role-line {
    display: block;
    width: 100%;
    min-width: 0;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv .profile-role-stack .profile-role-line + .profile-role-line,
  body.asterrvn-phone #termBody .term-line.profile-kv .profile-role-stack .profile-role-line + .profile-role-line {
    margin-top: 0.1rem;
    opacity: 0.9;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.profile-kv .profile-role-stack .profile-role-line:first-child::after,
  body.asterrvn-phone #termBody .term-line.profile-kv .profile-role-stack .profile-role-line:first-child::after {
    content: none !important;
  }

  body.asterrvn-viewer-narrow #termBody .term-line.tools-icons,
  body.asterrvn-phone #termBody .term-line.tools-icons {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    column-gap: 6px !important;
    row-gap: 5px !important;
    margin-top: 4px !important;
    margin-bottom: 6px !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.tools-icons .label,
  body.asterrvn-phone #termBody .term-line.tools-icons .label {
    display: inline !important;
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    font-size: clamp(9px, 2.5vw, 11px) !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    opacity: 0.7 !important;
    margin: 0 !important;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.tools-icons .tools-chips,
  body.asterrvn-phone #termBody .term-line.tools-icons .tools-chips {
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 4px !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    flex: 0 1 auto !important;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.tools-icons .tool-icon,
  body.asterrvn-phone #termBody .term-line.tools-icons .tool-icon {
    width: 25px !important;
    height: 25px !important;
    font-size: 7.5px !important;
    letter-spacing: 0.04em !important;
    flex-shrink: 0;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.tools-icons .tool-ai,
  body.asterrvn-phone #termBody .term-line.tools-icons .tool-ai {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: none !important;
    flex-basis: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    margin-left: 4px !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    color: var(--accent-bright) !important;
    white-space: nowrap !important;
    font-size: clamp(9px, 2.45vw, 11px) !important;
    letter-spacing: 0.02em !important;
    line-height: 1.2 !important;
    font-weight: normal !important;
  }
  body.asterrvn-viewer-narrow #termBody .term-line.tools-icons .tool-ai::before,
  body.asterrvn-phone #termBody .term-line.tools-icons .tool-ai::before {
    content: "/" !important;
    margin-right: 5px !important;
    opacity: 0.75 !important;
    color: var(--text-dim) !important;
  }
}

/* === Mobile gallery filters: compact inline rows (.gallery-view only; beats density grid !important) === */
@media (max-width: 1024px) {
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls,
  body.asterrvn-tablet .gallery-view .gallery-controls,
  body.asterrvn-phone .gallery-view .gallery-controls {
    display: grid;
    gap: 6px;
    margin-bottom: 8px;
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
  }

  /* CATEGORY / YEAR: [ LABEL ]: chip chip … (DOM: .label + .filter-btn, no .filter-options) */
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density),
  body.asterrvn-tablet .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density),
  body.asterrvn-phone .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density) {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    gap: 6px;
    margin: 0 !important;
    padding: 0;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: auto;
    scrollbar-width: none;
  }
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density)::-webkit-scrollbar,
  body.asterrvn-tablet .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density)::-webkit-scrollbar,
  body.asterrvn-phone .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density)::-webkit-scrollbar {
    display: none;
  }
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density) > .label,
  body.asterrvn-tablet .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density) > .label,
  body.asterrvn-phone .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density) > .label {
    flex: 0 0 auto;
    width: auto;
    min-width: 116px;
    white-space: nowrap;
    margin: 0;
    position: static;
    font-size: 8px;
    letter-spacing: 0.12em;
    color: var(--text-dim);
  }
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density) > .filter-btn,
  body.asterrvn-tablet .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density) > .filter-btn,
  body.asterrvn-phone .gallery-view .gallery-controls > .filters.filter-row:not(.mobile-gallery-density) > .filter-btn {
    flex: 0 0 auto;
    width: auto;
    min-width: 34px;
    min-height: 28px;
    height: auto;
    padding: 0 8px;
    font-size: 10px;
    line-height: 1;
    letter-spacing: 0.04em;
    touch-action: manipulation;
  }

  /* GRID: [ GRID ]: 1 2 3 4 5 */
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls > .mobile-gallery-density,
  body.asterrvn-tablet .gallery-view .gallery-controls > .mobile-gallery-density,
  body.asterrvn-phone .gallery-view .gallery-controls > .mobile-gallery-density {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    gap: 6px;
    margin: 0 !important;
    padding: 0;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
  }
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls > .mobile-gallery-density > .mobile-gallery-density__label,
  body.asterrvn-tablet .gallery-view .gallery-controls > .mobile-gallery-density > .mobile-gallery-density__label,
  body.asterrvn-phone .gallery-view .gallery-controls > .mobile-gallery-density > .mobile-gallery-density__label {
    flex: 0 0 auto;
    width: auto;
    min-width: 116px;
    white-space: nowrap;
    margin: 0;
    font-size: 8px;
    letter-spacing: 0.12em;
    color: var(--text-dim);
  }
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls > .mobile-gallery-density .mobile-gallery-density__options,
  body.asterrvn-tablet .gallery-view .gallery-controls > .mobile-gallery-density .mobile-gallery-density__options,
  body.asterrvn-phone .gallery-view .gallery-controls > .mobile-gallery-density .mobile-gallery-density__options {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: nowrap;
  }
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls > .mobile-gallery-density .mobile-gallery-density__btn,
  body.asterrvn-tablet .gallery-view .gallery-controls > .mobile-gallery-density .mobile-gallery-density__btn,
  body.asterrvn-phone .gallery-view .gallery-controls > .mobile-gallery-density .mobile-gallery-density__btn {
    flex: 0 0 auto;
    box-sizing: border-box;
    min-width: 34px;
    width: 34px;
    min-height: 28px;
    height: auto;
    padding: 0;
    font-size: 10px;
    line-height: 1;
    letter-spacing: 0.04em;
    touch-action: manipulation;
  }

  body.asterrvn-viewer-narrow .gallery-view .gallery-controls .filter-btn.active,
  body.asterrvn-tablet .gallery-view .gallery-controls .filter-btn.active,
  body.asterrvn-phone .gallery-view .gallery-controls .filter-btn.active {
    background: var(--accent-pale);
    border-color: var(--accent);
    color: var(--accent-bright);
  }
  body.asterrvn-viewer-narrow .gallery-view .gallery-controls .mobile-gallery-density__btn[aria-pressed="true"],
  body.asterrvn-tablet .gallery-view .gallery-controls .mobile-gallery-density__btn[aria-pressed="true"],
  body.asterrvn-phone .gallery-view .gallery-controls .mobile-gallery-density__btn[aria-pressed="true"] {
    color: var(--accent-bright);
    border-color: var(--accent-bright);
    box-shadow: 0 0 10px rgba(80, 140, 255, 0.25);
    background: rgba(42, 109, 255, 0.12);
  }
}

@media (max-width: 390px) {
  body.asterrvn-phone .gallery-view .gallery-controls > .filters.filter-row,
  body.asterrvn-phone .gallery-view .gallery-controls > .mobile-gallery-density {
    gap: 6px;
  }
  body.asterrvn-phone .gallery-view .gallery-controls > .filters.filter-row > .label,
  body.asterrvn-phone .gallery-view .gallery-controls > .mobile-gallery-density > .mobile-gallery-density__label {
    min-width: 104px;
  }
  body.asterrvn-phone .gallery-view .gallery-controls > .filters.filter-row > .filter-btn:not(.mobile-gallery-density__btn) {
    min-height: 28px;
    padding: 0 7px;
    font-size: 9px;
  }
}

/* === Mobile gallery vertical spacing tighten (.gallery-view only; after inline filters) === */
@media (max-width: 1024px) {
  body.asterrvn-viewer-narrow .gallery-view,
  body.asterrvn-tablet .gallery-view,
  body.asterrvn-phone .gallery-view {
    padding: 12px 12px 28px;
    box-sizing: border-box;
  }

  body.asterrvn-viewer-narrow .gallery-view .gallery-header,
  body.asterrvn-tablet .gallery-view .gallery-header,
  body.asterrvn-phone .gallery-view .gallery-header {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 5px;
    padding-top: 4px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--line-soft);
    box-sizing: border-box;
  }

  body.asterrvn-viewer-narrow .gallery-view .gallery-header-title-block,
  body.asterrvn-tablet .gallery-view .gallery-header-title-block,
  body.asterrvn-phone .gallery-view .gallery-header-title-block {
    gap: 4px 8px;
    width: 100%;
    min-width: 0;
  }

  body.asterrvn-viewer-narrow .gallery-view .gallery-header h2,
  body.asterrvn-tablet .gallery-view .gallery-header h2,
  body.asterrvn-phone .gallery-view .gallery-header h2 {
    margin: 0 0 4px 0;
    line-height: 0.92;
    font-size: clamp(28px, 8vw, 42px);
    letter-spacing: 0.1em;
  }

  body.asterrvn-viewer-narrow .gallery-view .gallery-header .meta.gallery-meta,
  body.asterrvn-tablet .gallery-view .gallery-header .meta.gallery-meta,
  body.asterrvn-phone .gallery-view .gallery-header .meta.gallery-meta {
    gap: 4px;
    line-height: 1.15;
  }

  body.asterrvn-viewer-narrow .gallery-view .gallery-grid,
  body.asterrvn-tablet .gallery-view .gallery-grid,
  body.asterrvn-phone .gallery-view .gallery-grid {
    margin-top: 0;
  }
}

