/* Paper-listening phone layout; desktop retains the original shell. */
#phone-phonetics-toggle,#rotate-prompt{display:none}
.phone-touch-guide{display:none}
body.phone-ui{height:100dvh;min-height:0;overflow:hidden}
.phone-ui main{min-height:0;padding:7px 8px 8px;gap:6px}
.phone-ui .masthead{min-height:52px;padding:6px 12px;gap:9px;border-radius:0 0 16px 16px}
.phone-ui .brand>span:last-child{display:none}
.phone-ui .seal{width:32px;height:32px;font-size:14px}
.phone-ui .site-title{display:flex;white-space:nowrap}
.phone-ui .site-title b{font-size:15px}
.phone-ui .site-title span{display:none}
.phone-ui .header-actions{gap:5px}
.phone-ui #feedback-open{min-width:38px;min-height:38px;width:38px;padding:8px;justify-content:center}
.phone-ui #feedback-open>span:last-child{display:none}
.phone-ui #feedback-open .cf-buttonIcon{margin:0}
.phone-ui .group-nav{margin:0;min-height:44px;padding:3px 6px}
.phone-ui .compact-lesson-nav{gap:6px}
.phone-ui .nav-select-label>span{display:none}
.phone-ui .nav-select-label{flex:1;min-width:0}
.phone-ui .nav-select-label:last-child{flex:1.2}
.phone-ui .nav-select-label select{width:100%;max-width:none;min-width:0;min-height:38px;font-size:12px;padding:6px 22px 6px 9px}
.phone-ui .mobile-tabs{margin:0;padding:3px;min-height:40px}
.phone-ui .mobile-tabs button{padding:7px}
.phone-ui .workspace{min-height:0}
.phone-ui .panel{border-radius:17px}
.phone-ui #rotate-prompt:not([hidden]){display:flex;align-items:center;gap:12px;flex-shrink:0;padding:13px 14px;border:1px solid #e6c9d0;border-radius:16px;background:linear-gradient(135deg,#fffdf9,#fff0f3);color:#8e2340}
#rotate-prompt>svg{width:46px;min-width:46px;height:46px}
#rotate-prompt h2{font-size:14px;line-height:1.4}
#rotate-prompt p{font-size:12px;color:#6c746e;margin-top:3px}
#continue-portrait{border:0;border-bottom:1px solid #ba6b80;background:transparent;color:#8e2340;padding:7px 0 2px;margin-top:3px;font-size:12px;font-weight:650;min-height:32px}
.phone-landscape .masthead{min-height:48px;height:48px;flex-shrink:0;gap:8px;padding:4px 10px}
.phone-landscape .masthead .brand{gap:0}
.phone-landscape .site-title b{font-size:12px}
.phone-landscape .masthead #group-nav{flex:1;min-width:0;min-height:0;margin:0;padding:0 4px;border:0;background:none;box-shadow:none;border-radius:0}
.phone-landscape .masthead #group-nav>.nav-part-group,.phone-landscape .masthead #group-nav>.nav-section-tabs{display:none}
.phone-landscape .masthead .compact-lesson-nav{display:flex;gap:6px;max-width:460px;margin:auto}
.phone-landscape #phone-phonetics-toggle{display:block;min-width:38px;min-height:38px;border:1px solid #fff8;border-radius:11px;background:#fff9ee;color:#92203e;font-size:11px;font-weight:800}
.phone-landscape #phone-phonetics-toggle[aria-expanded=false]{background:transparent;color:#fff}
.phone-landscape .mobile-tabs{display:none!important}
.phone-landscape main{padding-top:6px}
.phone-landscape #workspace{display:grid;grid-template-columns:minmax(0,1fr);gap:7px}
.phone-landscape #workspace.has-vocabulary:not(.phone-vocab-collapsed){grid-template-columns:minmax(0,1fr) clamp(200px,29vw,290px)}
.phone-landscape #workspace>.panel{display:flex;min-height:0}
.phone-landscape #workspace.phone-vocab-collapsed #vocabulary-panel{display:none}
.phone-landscape #workspace.listening-only #vocabulary-panel{display:none}
@media(max-width:700px){.phone-landscape .site-title{display:none}.phone-landscape .masthead{padding-left:7px;padding-right:7px;gap:5px}}
@media(prefers-reduced-motion:reduce){#rotate-prompt *{animation:none;transition:none}}

.group-nav .compact-lesson-nav{display:none}.group-nav.paper-select-nav>*:not(.compact-lesson-nav){display:none!important}.group-nav.paper-select-nav .compact-lesson-nav{display:flex;width:100%}.paper-select-nav .nav-select-label{min-width:0;flex:1}.paper-select-nav select{max-width:100%;width:100%;min-height:38px}