/* Shared mobile density: navigation and decoration stay compact; artwork and reading surfaces retain their own sizing. */
html body.student-page #forest-app#forest-app .f-header{height:54px!important;min-height:54px!important;padding:4px 14px!important;gap:12px!important}
html body.student-page #forest-app#forest-app .f-page-title{font-size:18px!important}
html body.student-page #forest-app#forest-app .f-tabs button{font-size:18px!important}
html body.student-page #forest-app#forest-app .f-chapters{padding:0 14px!important;gap:18px!important}
html body.student-page #forest-app#forest-app .f-chapters button,html body.student-page #forest-app#forest-app .f-eras>button{min-height:44px!important;padding:8px 0!important;font-size:12px!important}
html body.student-page #forest-app#forest-app .f-eras{padding:0 14px!important;gap:18px!important}
html body.student-page #forest-app#forest-app .f-genres{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none!important;padding:5px 14px!important;gap:6px!important}
html body.student-page #forest-app#forest-app .f-genres button{display:inline-flex!important;flex-direction:row!important;flex:0 0 auto!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-height:44px!important;padding:5px 9px!important;border-radius:7px!important;font-size:12px!important}
html body.student-page #forest-app#forest-app .f-genres button.on{background:#303034!important}
html body.student-page #forest-app#forest-app .f-genres i{width:22px!important;height:22px!important;min-width:22px!important;border-radius:0!important;background:none!important;box-shadow:none!important}
html body.student-page #forest-app#forest-app .f-genres .f-icon{width:20px!important;height:20px!important}
html body.student-page #forest-app#forest-app .f-feed-meta{padding:2px 14px!important;min-height:36px!important}
html body.student-page #forest-app#forest-app .f-empty{padding:28px 16px!important;font-size:13px!important}
html body.student-page #forest-app#forest-app .f-select{margin:8px 14px!important;gap:10px!important}
html body.student-page #forest-app#forest-app .f-select select,html body.student-page #forest-app#forest-app .f-select .wf-app-select-button{min-height:44px!important;padding:8px 10px!important}
html body.student-page #forest-app#forest-app .f-list-head{padding:0!important;margin:6px 14px!important;min-height:44px!important}
html body.student-page #forest-app#forest-app .f-list-head h2{font-size:16px!important;line-height:1.4!important;margin:0!important}
html body.student-page #forest-app#forest-app .f-list-head small{font-size:11px!important}
html body.student-page #forest-app#forest-app .f-unit{font-size:12px!important;line-height:1.5!important;margin:10px 14px 2px!important}
html body.student-page #forest-app#forest-app .f-episode{width:calc(100% - 28px)!important;min-height:72px!important;padding:10px 0!important;margin:0 14px!important;gap:10px!important;border-bottom:1px solid #ffffff0a!important}
html body.student-page #forest-app#forest-app .f-episode-cover{width:46px!important;height:46px!important;flex-basis:46px!important}
html body.student-page #forest-app#forest-app .f-episode strong{font-size:14px!important;line-height:1.4!important}
html body.student-page #forest-app#forest-app .f-episode small{margin-top:3px!important;font-size:11px!important}
html body.student-page #forest-app#forest-app .f-episode b{width:32px!important;height:32px!important;flex-basis:32px!important}
html body.student-page #forest-app#forest-app .f-episode b .f-icon{width:19px!important;height:19px!important}
html body.student-page #forest-app#forest-app .f-audio-hero{min-height:0!important;padding:14px!important;margin:12px 14px!important}
html body.student-page #forest-app#forest-app .f-audio-hero h1{font-size:20px!important;margin:6px 0!important}
html body.student-page #forest-app#forest-app .f-disc{width:72px!important;height:72px!important;right:10px!important;top:12px!important;opacity:.5!important}
html body.student-page #forest-app#forest-app .f-disc span{width:24px!important;height:24px!important}
html body.student-page #forest-player-shell#forest-player-shell .f-queue-row{min-height:60px!important;padding:8px 10px!important}
/* Profile and every subsection opened from it share the same scale. */
html body.student-page #accountPanel#accountPanel#accountPanel{padding:10px 14px 84px!important;row-gap:10px!important;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif!important}
html body.student-page #accountPanel#accountPanel#accountPanel :where(button,strong,h2,h3,p,span,small,em,label,input,summary){font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif!important;letter-spacing:normal!important}
html body.student-page #accountPanel#accountPanel#accountPanel>.wf-gothic-wordmark{display:none!important}
html body.student-page #accountPanel#accountPanel#accountPanel .panel-heading{margin:0 0 8px!important;gap:10px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .panel-heading h2{font-size:20px!important;line-height:1.4!important;margin:0!important}
html body.student-page #accountPanel#accountPanel#accountPanel .panel-heading p{font-size:11px!important;line-height:1.5!important;margin:3px 0 0!important}
html body.student-page #accountPanel#accountPanel#accountPanel #accountRefreshButton{min-height:44px!important;padding:6px 10px!important;border-radius:7px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .wf-vip-profile{grid-template-columns:52px minmax(0,1fr)!important;gap:12px!important;padding:4px 0 12px!important;min-height:0!important}
html body.student-page #accountPanel#accountPanel#accountPanel .wf-vip-profile :is(.profile-avatar-button,.profile-avatar,.profile-avatar-image){width:52px!important;height:52px!important;min-height:52px!important;font-size:23px!important;line-height:52px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .profile-avatar-button em{font-size:9px!important;line-height:1.4!important;padding:1px 4px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .wf-vip-name #profileName{font-size:17px!important;line-height:1.4!important}
html body.student-page #accountPanel#accountPanel#accountPanel .wf-vip-profile-status{font-size:12px!important;line-height:1.5!important;margin:2px 0!important}
html body.student-page #accountPanel#accountPanel#accountPanel .wf-vip-entry{min-height:44px!important;font-size:12px!important;padding:0!important;margin:0!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;margin:0 0 8px!important;gap:0!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-metric{min-height:64px!important;padding:10px 2px!important;border:0!important;border-right:1px solid #ffffff12!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-metric:last-child{border-right:0!important}
html body.student-page #accountPanel#accountPanel#accountPanel #accountMetricGrid .account-metric strong{font:600 22px/1.2 -apple-system,BlinkMacSystemFont,sans-serif!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-metric span{font-size:10px!important;line-height:1.5!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-action-list>button{min-height:48px!important;padding:8px 20px 8px 29px!important;gap:8px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-action-list strong{font-size:14px!important;line-height:1.4!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-action-list span{font-size:11px!important;line-height:1.4!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-action-list>button::before{width:18px!important;height:18px!important;left:0!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-subsection{padding:12px 0!important;margin:10px 0 0!important;border:0!important;border-top:1px solid #3b3b40!important;border-radius:0!important;background:#171719!important;scroll-margin-top:8px!important}
html body.student-page #accountPanel#accountPanel#accountPanel :is(.section-mini-heading,.account-subsection-head){display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:5px 10px!important;margin:0 0 8px!important}
html body.student-page #accountPanel#accountPanel#accountPanel :is(.section-mini-heading,.account-subsection-head)>strong{font-size:15px!important;line-height:1.4!important}
html body.student-page #accountPanel#accountPanel#accountPanel .section-mini-heading>span{font-size:11px!important;line-height:1.5!important;color:#aaa!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-detail-list{gap:0!important;margin:0 0 12px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-detail-list>div{min-height:36px!important;padding:8px 0!important;gap:10px!important;border:0!important;border-bottom:1px solid #303034!important;border-radius:0!important;grid-template-columns:76px minmax(0,1fr)!important;background:transparent!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-detail-list :is(strong,span){font-size:12px!important;line-height:1.5!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-password-form{display:grid!important;gap:8px!important;padding:8px 0!important;margin:0!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-password-form label{font-size:13px!important}
html body.student-page #accountPanel#accountPanel#accountPanel input:not([type=checkbox]):not([type=radio]){box-sizing:border-box!important;width:100%!important;min-height:44px!important;padding:9px 12px!important;border:1px solid #494950!important;border-radius:7px!important;background:#242427!important;color:#eee!important;font-size:16px!important}
html body.student-page #accountPanel#accountPanel#accountPanel :is(.full-button,.account-password-form button){min-height:44px!important;font-size:13px!important;padding:9px 12px!important;margin-top:6px!important;border-radius:7px!important}
html body.student-page #accountPanel#accountPanel#accountPanel #monet-theme-settings{padding:12px 0!important}
html body.student-page #accountPanel#accountPanel#accountPanel #monet-theme-settings>strong{font-size:14px!important}
html body.student-page #accountPanel#accountPanel#accountPanel #monet-theme-settings p{font-size:11px!important;line-height:1.5!important;margin:4px 0 8px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .monet-options{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
html body.student-page #accountPanel#accountPanel#accountPanel #monet-theme-settings button{display:flex!important;align-items:center!important;gap:8px!important;min-height:44px!important;padding:7px 8px!important;font-size:12px!important;border-radius:7px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .monet-swatches{margin:0!important;gap:2px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .monet-swatches i{width:10px!important;height:16px!important;border-radius:3px!important}
html body.student-page #accountPanel#accountPanel#accountPanel :is(.podcast-autoplay-settings,.student-table-mark-settings){padding:10px 0!important;margin:0!important;border-radius:0!important}
html body.student-page #accountPanel#accountPanel#accountPanel :is(.account-topic-row,.access-row,.watch-history-row){min-height:56px!important;padding:10px!important;border-radius:8px!important;margin:0!important}
html body.student-page #accountPanel#accountPanel#accountPanel :is(.account-topic-row,.access-row,.watch-history-row) strong{font-size:14px!important;line-height:1.5!important}
html body.student-page #accountPanel#accountPanel#accountPanel :is(.account-topic-empty,.empty-state){padding:20px 12px!important;min-height:0!important;font-size:13px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-calendar-grid{gap:4px!important}
html body.student-page #accountPanel#accountPanel#accountPanel .account-calendar-grid>div{min-height:34px!important;padding:5px!important;font-size:12px!important}
/* Learning report and content chrome. */
html body.student-page #progressPanel#progressPanel{padding:12px 14px 90px!important}
html body.student-page #progressPanel#progressPanel .panel-heading h2{font:600 20px/1.4 -apple-system,'PingFang SC',sans-serif!important;margin:0!important}
html body.student-page #progressPanel#progressPanel .panel-heading p{font-size:12px!important;line-height:1.5!important;margin:4px 0!important}
html body.student-page #progressPanel#progressPanel .progress-hero-card{min-height:0!important;padding:14px!important;margin:8px 0!important;border-radius:10px!important}
html body.student-page #progressPanel#progressPanel .progress-hero-card>strong{font-size:30px!important;line-height:1.3!important;margin:4px 0!important}
html body.student-page #progressPanel#progressPanel .progress-hero-card>p{font-size:12px!important;line-height:1.5!important;margin:4px 0!important}
html body.student-page #progressPanel#progressPanel .progress-metric-grid{gap:8px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
html body.student-page #progressPanel#progressPanel .progress-metric{min-height:64px!important;padding:10px!important;border-radius:8px!important}
html body.student-page #progressPanel#progressPanel .progress-metric strong{font-size:22px!important;line-height:1.3!important}
html body.student-page #knowledgeStudyPanel#knowledgeStudyPanel .student-module-head{min-height:0!important;padding:8px 10px!important;gap:8px!important}
html body.student-page #knowledgeStudyPanel#knowledgeStudyPanel .student-module-head strong{font-size:15px!important;line-height:1.5!important}
html body.student-page #knowledgeStudyPanel#knowledgeStudyPanel .student-module-head :is(img,svg){width:20px!important;height:20px!important;object-fit:contain!important}
html body.student-page #knowledgeStudyPanel#knowledgeStudyPanel .student-module-card{border-radius:10px!important;margin:8px 0!important}
html body.student-page #knowledgeStudyPanel#knowledgeStudyPanel .knowledge-table-version-guide{margin:6px 0!important;padding:6px!important}
html body.student-page #knowledgeStudyPanel#knowledgeStudyPanel .knowledge-table-version-buttons button{min-height:44px!important;padding:6px 12px!important;font-size:13px!important}
html body.student-page #knowledgeStudyPanel#knowledgeStudyPanel .empty-state{padding:24px 14px!important;min-height:0!important;font-size:14px!important}
html body.student-page .wf-story-dialog.wf-story-dialog section{padding:14px!important;border-radius:12px!important;max-height:80dvh!important}
html body.student-page .wf-story-dialog.wf-story-dialog header{min-height:44px!important}
html body.student-page .wf-story-dialog.wf-story-dialog :is(h2,h3,strong){font-size:16px!important;line-height:1.5!important}
html body.student-page .wf-story-dialog.wf-story-dialog p{font-size:12px!important;line-height:1.5!important;margin:6px 0!important}
/* Membership selection retains all plan, price, permission and checkout data. */
html body.student-page .wf-billing-dialog.wf-billing-dialog.wf-vip-dialog{padding:14px!important;font-family:-apple-system,'PingFang SC',sans-serif!important;background:#19191c!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-gothic-wordmark{font:500 12px/1.4 -apple-system,sans-serif!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-billing-heading{margin:0 0 4px!important;min-height:44px!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog h2{font:600 22px/1.3 -apple-system,'PingFang SC',sans-serif!important;letter-spacing:normal!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog h3{font:600 15px/1.4 -apple-system,'PingFang SC',sans-serif!important;letter-spacing:normal!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-subtitle{margin-bottom:10px!important;font-size:12px!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-hero{margin:0 0 12px!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-badge{width:28px!important;height:36px!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-hero-heading{gap:10px!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-hero-note{padding-left:38px!important;font-size:11px!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-billing-plans{gap:8px!important;margin:0 0 12px!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-plan{aspect-ratio:auto!important;min-height:100px!important;padding:12px 8px!important;gap:5px!important;border:1px solid #45454b!important;border-radius:9px!important;background:#242427!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-plan[aria-pressed=true]{border-color:#cdb67d!important;background:#302b23!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-plan-bg{display:none!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-plan-name{font-size:14px!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-plan strong{font:600 24px/1.2 -apple-system,sans-serif!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog .wf-vip-plan-duration{font-size:12px!important}
html body.student-page .wf-billing-dialog.wf-billing-dialog button{font-family:-apple-system,'PingFang SC',sans-serif!important;font-size:13px!important}
