.brand .install-button{margin-left:auto;width:42px;height:42px;place-items:center;color:#d7e7e0}
.brand .install-button:not([hidden]){display:grid}
.install-button svg{width:19px;height:19px}
.nav-item svg{width:17px;height:17px;color:#86b3a5;flex:0 0 17px}
.nav-item span{width:auto;color:inherit;font-size:13px;text-align:left}
.nav-item.active svg{color:#f4b19f}
.outline-button{display:flex;align-items:center;justify-content:center;gap:8px}
.outline-button svg{width:14px;height:14px}
.primary-button,.text-button,.card-link,.soft-button,.audio-button{display:inline-flex;align-items:center;gap:8px}
.primary-button{justify-content:center;min-height:44px}
.primary-button svg,.text-button svg,.card-link svg,.soft-button svg,.audio-button svg{width:16px;height:16px}
.transcript audio{display:block;width:100%;height:38px;margin-top:10px}

@media(max-width:680px){
  html,body{overscroll-behavior-y:none}
  .app-shell{display:block}
  .sidebar{width:100%;height:62px;padding:10px 16px;display:flex;align-items:center;position:sticky;top:0;z-index:30;box-shadow:0 1px 0 rgba(255,255,255,.1)}
  .brand{width:100%;margin:0}
  .brand-mark{width:36px;height:36px}
  .brand strong{font-size:15px}
  .profile-chip,.sidebar-bottom{display:none}
  .nav{position:fixed;left:0;right:0;bottom:0;z-index:40;height:calc(72px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(5,1fr);gap:0;padding:5px 6px env(safe-area-inset-bottom);overflow:visible;background:var(--forest);box-shadow:0 -8px 28px rgba(15,39,34,.18)}
  .nav-item{min-width:0;min-height:60px;padding:7px 2px;display:flex;flex-direction:column;justify-content:center;gap:4px;border-radius:0;font-size:10px;position:relative}
  .nav-item svg{display:block;width:20px;height:20px;flex-basis:20px}
  .nav-item span{display:block;width:auto;font-size:10px;line-height:1}
  .nav-item b{display:none}
  .nav-item.active,.nav-item:hover{background:transparent;color:#fff}
  .nav-item.active:before{content:"";position:absolute;top:0;width:22px;height:2px;background:var(--coral)}
  .main-content{padding:0 16px calc(96px + env(safe-area-inset-bottom))}
  .topbar{display:none}
  .view{padding-top:25px}
  .hero-grid{display:flex;flex-direction:column-reverse;gap:20px;align-items:stretch}
  .hero-art{height:180px}
  .hero-copy h1{font-size:36px;line-height:1.08;letter-spacing:-1.2px;margin:13px 0}
  .hero-copy p{font-size:14px;line-height:1.6}
  .hero-actions{margin-top:20px;gap:15px}
  .hero-actions .primary-button{flex:1}
  .text-button{min-height:44px}
  .section-heading{margin-top:45px}
  .section-heading h2{font-size:20px}
  .routine-grid{gap:10px}
  .routine-card{padding:18px;min-height:0}
  .routine-card .card-link{min-height:44px}
  .lower-grid{margin-top:10px}
  .panel{padding:18px}
  .view-heading{display:block;margin-bottom:23px}
  .view-heading h1{font-size:31px;line-height:1.14;letter-spacing:-.8px}
  .pill{display:inline-block;margin-top:15px}
  .vocab-list{grid-template-columns:1fr}
  .word-card{min-height:0;text-align:left}
  .practice-panel{padding:18px;min-height:320px}
  .fill-sentence{font-size:18px;margin:35px 0 20px}
  .choice{min-height:44px;padding:10px 12px}
  .reading-card{padding:18px}
  .reading-card h2{font-size:27px;margin-top:26px}
  .article-lead{font-size:15px}
  .reading-meta{flex-wrap:wrap}
  .audio-button{margin-left:0;min-height:44px}
  .scenario-card,.script-panel{padding:20px}
  .scenario-card h2{font-size:25px;margin-top:32px}
  .speech-actions{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:10px}
  .record-button{min-height:44px;justify-content:center;border:1px solid rgba(255,255,255,.25)}
  .writing-editor textarea{min-height:48dvh;font-size:16px}
  .feedback-panel{min-height:330px}
  .editor-footer{gap:9px}
  .editor-footer .primary-button{min-width:120px}
  .toast{bottom:calc(88px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px);text-align:center}
}