.hgsl-mobile-toolbar,
.hgsl-mobile-panel-controls,
.hgsl-mobile-back-label {
  display: none;
}

@media (max-width: 820px) {
  body.hgsl-mobile-reader {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    --mobile-rule: #e6e3dd;
    --mobile-muted: #77736c;
  }

  .hgsl-mobile-reader .page {
    width: min(calc(100% - 40px), 620px);
    padding: calc(5rem + env(safe-area-inset-top, 0px)) 0 calc(3rem + env(safe-area-inset-bottom, 0px));
  }
  .hgsl-mobile-reader .article-header {
    margin-bottom: 1.6rem;
  }
  .hgsl-mobile-reader .article-header h1 {
    font-size: clamp(1.9rem, 8.4vw, 2.45rem);
    line-height: 1.1;
    letter-spacing: -.032em;
    text-wrap: balance;
  }
  .hgsl-mobile-reader .byline {
    margin-top: 1rem;
    color: #57534c;
    font-size: .78rem;
    font-weight: 500;
    letter-spacing: 0;
  }
  .hgsl-mobile-reader .hgsl-home-link {
    top: calc(.8rem + env(safe-area-inset-top, 0px));
    left: -.45rem;
    display: flex;
    gap: .35rem;
    width: auto;
    height: 44px;
    padding: 0 .45rem;
    color: #56534d;
  }
  .hgsl-mobile-reader .hgsl-home-link svg { width: 1.1rem; height: 1.1rem; }
  .hgsl-mobile-reader .hgsl-mobile-back-label {
    display: inline;
    font: 500 .78rem/1 Arial, Helvetica, sans-serif;
  }
  .hgsl-mobile-reader .hgsl-account {
    position: absolute;
    top: calc(.8rem + env(safe-area-inset-top, 0px));
    right: -.4rem;
    max-width: calc(100% - 110px);
    min-height: 44px;
    margin: 0;
    justify-content: flex-end;
    gap: .3rem .5rem;
    font-size: .69rem;
  }
  .hgsl-mobile-reader #hgsl-account-name { max-width: 10rem; }
  .hgsl-mobile-reader #hgsl-sign-in {
    min-width: 0;
    min-height: 44px;
    padding: 0 .4rem;
    border: 0;
    background: transparent;
    color: #272723;
    font: 600 .76rem/1 Arial, Helvetica, sans-serif;
    text-transform: none;
    letter-spacing: 0;
  }
  .hgsl-mobile-reader #hgsl-sign-out { min-height: 36px; }

  .hgsl-mobile-reader .section-nav { display: none; }
  .hgsl-mobile-reader .layout { display: block; }
  .hgsl-mobile-reader .reading { padding: 1.5rem 0 0; scroll-margin-top: calc(5rem + env(safe-area-inset-top, 0px)); }
  .hgsl-mobile-reader .footnote-link { scroll-margin-top: calc(5rem + env(safe-area-inset-top, 0px)); }
  .hgsl-mobile-reader .paragraph-pair {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    padding: 0 0 2.2rem;
  }
  .hgsl-mobile-reader .paragraph-pair p[lang="en"] {
    font-size: 1.125rem;
    line-height: 1.78;
    overflow-wrap: break-word;
    hyphens: none;
  }
  .hgsl-mobile-reader .paragraph-pair p[lang="zh-CN"] {
    margin: 0;
    padding: .75rem .85rem;
    border-left: 2px solid #dfdace;
    background: #f8f7f3;
    color: #625e55;
    font-size: .97rem;
    line-height: 1.95;
    font-style: normal;
  }
  .hgsl-mobile-reader .paragraph-pair.epigraph p[lang="en"] {
    padding-left: 0;
    border-left: 0;
  }
  .hgsl-mobile-reader .paragraph-pair.block-quote p[lang="en"] {
    padding-left: .8rem;
    border-left: 2px solid #ddd8cf;
  }
  .hgsl-mobile-reader .paragraph-pair.footnote p[lang="en"] {
    font-size: 1rem;
    line-height: 1.75;
  }
  .hgsl-mobile-reader .paragraph-pair.footnote p[lang="zh-CN"] { font-size: .92rem; }
  .hgsl-mobile-reader .word.phrase-unit { display: inline; }
  .hgsl-mobile-reader .section-heading {
    margin: 1.6rem 0 1.35rem;
    gap: .45rem;
    scroll-margin-top: calc(5rem + env(safe-area-inset-top, 0px));
  }
  .hgsl-mobile-reader .section-heading h2[lang="en"] {
    font-size: 1.6rem;
    line-height: 1.2;
    text-wrap: balance;
  }
  .hgsl-mobile-reader .section-heading h2[lang="zh-CN"] {
    color: #777168;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.65;
    letter-spacing: .03em;
  }
  .hgsl-mobile-reader .attribution { font-size: .9em; }
  .hgsl-mobile-reader .reference-entry { font-size: .98rem; line-height: 1.8; }
  .hgsl-mobile-reader.hgsl-mobile-english-only .paragraph-pair p[lang="zh-CN"],
  .hgsl-mobile-reader.hgsl-mobile-english-only .section-heading h2[lang="zh-CN"] { display: none; }

  .hgsl-mobile-reader .hgsl-mobile-toolbar {
    position: sticky;
    top: env(safe-area-inset-top, 0px);
    z-index: 25;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 52px;
    border-top: 1px solid var(--mobile-rule);
    border-bottom: 1px solid var(--mobile-rule);
    background: rgba(255, 255, 255, .97);
    backdrop-filter: blur(14px);
  }
  .hgsl-mobile-toolbar button {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-height: 44px;
    padding: 0 .4rem;
    border: 0;
    background: transparent;
    color: #4d4b45;
    cursor: pointer;
    font: 500 .77rem/1 Arial, Helvetica, sans-serif;
  }
  .hgsl-mobile-toolbar svg,
  .hgsl-mobile-panel-controls svg,
  .hgsl-mobile-toc-close svg {
    width: 1.15rem;
    height: 1.15rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .hgsl-mobile-toolbar .hgsl-translation-toggle {
    min-height: 32px;
    padding: .3rem .7rem;
    border-radius: 5px;
    color: #868179;
    letter-spacing: .03em;
  }
  .hgsl-translation-toggle[aria-pressed="true"] { background: #f0efeb; color: #393832; }
  .hgsl-mobile-toolbar button:focus-visible,
  .hgsl-mobile-panel-controls button:focus-visible {
    outline: 2px solid #718b9b;
    outline-offset: 1px;
  }

  .hgsl-mobile-reader .hgsl-side-rail {
    position: fixed;
    z-index: 60;
    inset: auto 0 var(--mobile-keyboard-inset, 0px);
    width: 100%;
    max-width: 620px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0;
    height: min(54vh, 30rem);
    height: min(calc(var(--mobile-visible-height, 100dvh) * .54), 30rem);
    max-height: none;
    overflow: hidden;
    border: 1px solid #dfdcd5;
    border-bottom: 0;
    border-radius: 18px 18px 0 0;
    background: #fff;
    box-shadow: 0 -8px 36px rgba(38, 36, 29, .13);
    transform: translateY(calc(100% + 40px));
    visibility: hidden;
    pointer-events: none;
    transition: transform .18s ease-out, visibility .18s;
  }
  .hgsl-mobile-reader .hgsl-side-rail.is-mobile-open {
    transform: translateY(0);
    visibility: visible;
    pointer-events: auto;
  }
  .hgsl-mobile-reader .hgsl-side-rail.is-composing {
    height: min(calc(var(--mobile-visible-height, 100dvh) * .85), 36rem);
  }
  .hgsl-mobile-reader .hgsl-mobile-panel-controls {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: 13px 12px 0 20px;
    border-bottom: 1px solid var(--mobile-rule);
    touch-action: none;
  }
  .hgsl-mobile-panel-controls::before {
    content: "";
    position: absolute;
    top: 6px;
    left: calc(50% - 17px);
    width: 34px;
    height: 3px;
    border-radius: 4px;
    background: #d6d2cb;
  }
  .hgsl-mobile-tabs { display: flex; gap: 1.3rem; }
  .hgsl-mobile-panel-controls button {
    min-height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #8a857d;
    cursor: pointer;
    font: 600 .79rem/1 Arial, Helvetica, sans-serif;
  }
  .hgsl-mobile-tabs button { border-bottom: 2px solid transparent; }
  .hgsl-mobile-tabs button[aria-selected="true"] { border-bottom-color: #272a28; color: #272a28; }
  .hgsl-mobile-tabs button:disabled { opacity: .38; cursor: default; }
  .hgsl-mobile-panel-controls .hgsl-mobile-panel-close {
    display: grid;
    min-width: 44px;
    place-items: center;
    color: #5c5953;
  }
  .hgsl-mobile-reader .hgsl-side-rail > .sidebar,
  .hgsl-mobile-reader .hgsl-side-rail > .hgsl-comment-sidebar {
    position: static;
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    padding: 1.2rem 1.25rem calc(1.3rem + env(safe-area-inset-bottom, 0px));
    overflow: auto;
    overscroll-behavior: contain;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    -webkit-overflow-scrolling: touch;
  }
  .hgsl-mobile-reader .hgsl-side-rail[data-mobile-tab="dictionary"] > .hgsl-comment-sidebar,
  .hgsl-mobile-reader .hgsl-side-rail[data-mobile-tab="comments"] > .sidebar { display: none !important; }
  .hgsl-mobile-reader .selected-word { font-size: 1.85rem; line-height: 1.15; }
  .hgsl-mobile-reader .part-of-speech { font-size: .9rem; color: #5c6b75; }
  .hgsl-mobile-reader .pronunciations { font-size: .85rem; gap: .3rem .8rem; margin-top: .6rem; }
  .hgsl-mobile-reader .pronunciation-region { font-size: .66rem; color: #737a7c; }
  .hgsl-mobile-reader .definition-card { border-top: 1px solid var(--mobile-rule); margin-top: .9rem; padding-top: .9rem; }
  .hgsl-mobile-reader .definition-en { font-size: 1rem; line-height: 1.7; }
  .hgsl-mobile-reader .meaning { margin-top: .55rem; font-size: .94rem; line-height: 1.8; color: #6a655c; }
  .hgsl-mobile-reader .side-section { margin-top: 1.1rem; padding-top: .9rem; border-color: var(--mobile-rule); }
  .hgsl-mobile-reader .side-section h2 { color: #91897e; font-size: .65rem; letter-spacing: .05em; }
  .hgsl-mobile-reader .context-sentence { font-size: .97rem; line-height: 1.75; }
  .hgsl-mobile-reader .term { background: #f6f5f1; border-radius: 5px; }
  .hgsl-mobile-reader .term dd { line-height: 1.8; }
  .hgsl-mobile-reader .hgsl-comments-heading { display: none; }
  .hgsl-mobile-reader .hgsl-side-rail > .hgsl-comment-sidebar { display: flex; flex-direction: column; }
  .hgsl-mobile-reader .hgsl-comment-sidebar > * { flex-shrink: 0; }
  .hgsl-mobile-reader .hgsl-comment-actions { margin-top: auto; padding-top: 1rem; }
  .hgsl-mobile-reader .hgsl-comment-status:empty { display: none; }
  .hgsl-mobile-reader .hgsl-comment-status:not(:empty) {
    display: grid;
    flex-grow: 1;
    min-height: 64px;
    place-items: center;
    margin: 0;
    padding: 1.3rem 0;
    color: #918b82;
  }
  .hgsl-mobile-reader .hgsl-comment-target { margin: 0; color: #817b73; font-size: .72rem; }
  .hgsl-mobile-reader .hgsl-comment-quote { font-size: 1rem; line-height: 1.7; max-height: 9rem; margin-top: .85rem; border-color: #dfdace; }
  .hgsl-mobile-reader .hgsl-comment-body { font-size: 1rem; line-height: 1.7; }
  .hgsl-mobile-reader .hgsl-comment-meta { flex-wrap: wrap; font-size: .72rem; gap: .35rem .6rem; }
  .hgsl-mobile-reader .hgsl-comment-time { font-size: .67rem; }
  .hgsl-mobile-reader .hgsl-like-button,
  .hgsl-mobile-reader .hgsl-comment-like,
  .hgsl-mobile-reader .hgsl-comment-privacy,
  .hgsl-mobile-reader .hgsl-comment-reply,
  .hgsl-mobile-reader .hgsl-comment-delete,
  .hgsl-mobile-reader .hgsl-comment-thread-toggle { min-height: 40px; min-width: 32px; font-size: .75rem; }
  .hgsl-mobile-reader .hgsl-comment-compose,
  .hgsl-mobile-reader .hgsl-comment-post { min-height: 44px; min-width: 90px; font-size: .77rem; border-radius: 4px; }
  .hgsl-mobile-reader .hgsl-comment-form textarea { font-size: 16px; line-height: 1.7; min-height: 5.5rem; }
  .hgsl-mobile-reader .hgsl-auth-dialog { max-height: calc(100dvh - 24px); }
  .hgsl-mobile-reader:not(.hgsl-mobile-panel-open) .sentence.is-active,
  .hgsl-mobile-reader:not(.hgsl-mobile-panel-open) .sentence.is-comment-selected { background: transparent; }
  .hgsl-mobile-reader:not(.hgsl-mobile-panel-open) .word.is-selected { background: transparent; box-shadow: none; color: inherit; }

  .hgsl-mobile-toc {
    width: min(100% - 24px, 500px);
    max-height: min(76dvh, 600px);
    margin: auto auto max(12px, env(safe-area-inset-bottom, 0px));
    padding: 1.1rem 1.2rem 1.3rem;
    overflow: auto;
    border: 1px solid var(--mobile-rule);
    border-radius: 16px;
    color: #292823;
    background: #fff;
    box-shadow: 0 12px 48px rgba(0, 0, 0, .14);
  }
  .hgsl-mobile-toc::backdrop { background: rgba(24, 25, 24, .23); }
  .hgsl-mobile-toc-heading { display: flex; align-items: center; justify-content: space-between; }
  .hgsl-mobile-toc-heading h2 { margin: 0; font: 700 1.4rem/1.2 Georgia, serif; }
  .hgsl-mobile-toc-close { display: grid; width: 44px; height: 44px; place-items: center; border: 0; background: none; color: #777; cursor: pointer; }
  .hgsl-mobile-toc nav { display: grid; margin-top: .55rem; }
  .hgsl-mobile-toc nav a { padding: .9rem 0; border-bottom: 1px solid #eeece7; color: #46453e; text-decoration: none; font: 1rem/1.5 Georgia, serif; }
  .hgsl-mobile-toc nav a:last-child { border: 0; }
  .hgsl-mobile-toc nav a:hover { color: #326891; }
  .hgsl-mobile-reader.hgsl-mobile-toc-open { overflow: hidden; }
}

@media (max-width: 360px) {
  .hgsl-mobile-reader .page { width: calc(100% - 32px); }
  .hgsl-mobile-reader .paragraph-pair p[lang="en"] { font-size: 1.06rem; }
}

@media (prefers-reduced-motion: reduce) {
  .hgsl-mobile-reader .hgsl-side-rail { transition: none; }
}