/* Phones share one landscape composition, including when held upright. */
html.phone-landscape:has(body.disc-layout){height:100%;overflow:clip;scrollbar-gutter:auto}
/* Clip rather than hide: a hidden overflow box can still scroll on focus. */
html.phone-landscape body.disc-layout{position:fixed;inset:0 auto auto 0;width:var(--site-width);height:var(--site-height);min-height:0;overflow:clip;--phone-safe-start:env(safe-area-inset-left,0px);--phone-safe-end:env(safe-area-inset-right,0px);--phone-safe-bottom:env(safe-area-inset-bottom,0px);--phone-bottom:max(8px,calc(var(--phone-safe-bottom) + 6px));--phone-content-top:64px;--phone-player-height:72px;--content-left:22%;--content-right:max(12px,calc(var(--phone-safe-end) + 6px));--content-inset:0px;--cd-radius:min(calc(var(--site-vh)*43),calc(var(--site-vw)*20));--cd-size:calc(var(--cd-radius)*2);--cd-y:calc(var(--site-vh)*50);font-size:12px}
html.phone-rotated body.disc-layout{--phone-safe-start:env(safe-area-inset-top,0px);--phone-safe-end:env(safe-area-inset-bottom,0px);--phone-safe-bottom:env(safe-area-inset-right,0px)}
html.phone-rotated body.disc-layout{transform-origin:0 0;transform:translateX(var(--site-height)) rotate(90deg)}
.phone-landscape #site-document{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a6b4c5 transparent}
.phone-landscape .disc-stage{width:22%;height:100%}
.phone-landscape .cd-body,.phone-landscape .cd-rotor,.phone-landscape .disc-shadow{left:calc(var(--cd-radius)*-1)}
.phone-landscape .cd-track{height:36px;gap:6px;padding-right:10px}
.phone-landscape .cd-track .track-title{font-size:11px;letter-spacing:.5px}
.phone-landscape .cd-track .track-index{display:inline;font-size:7px}
.phone-landscape .metal-probe{left:calc(var(--cd-radius)*.69 - 32px);height:calc(var(--cd-y) - var(--cd-radius)*.483)}
.phone-landscape .probe-head{width:36px;height:65px;left:4px;bottom:-10px}
/* Match the shorter headshell instead of reserving the desktop 105px. */
.phone-landscape .probe-shaft{bottom:47px}
.phone-landscape .disc-caption{left:max(16px,calc(var(--phone-safe-start) + 8px));bottom:var(--phone-bottom)}
.phone-landscape .disc-caption>span,.phone-landscape .disc-caption p,.phone-landscape .disc-caption small{display:none}
.phone-landscape .disc-caption>div{flex-direction:row;gap:6px}
.phone-landscape .disc-caption button{width:30px;height:30px;font-size:12px}
.phone-landscape .disc-layout>header{left:var(--content-left);right:var(--content-right);height:40px;min-height:0;gap:8px;flex-wrap:nowrap}
.phone-landscape .disc-layout header .brand{flex-basis:auto;font-size:13px;white-space:nowrap}
.phone-landscape .disc-layout header .brand span{margin-top:2px;font-size:6px;letter-spacing:1.4px}
.phone-landscape .disc-layout header .header-action{height:28px;min-height:28px;font-size:10px;padding:0 9px;gap:5px}
.phone-landscape .disc-layout header #search-open{margin-left:auto;padding:0;width:30px;height:30px;min-height:30px;justify-content:center}
.phone-landscape .disc-layout header kbd{display:none}
.phone-landscape .module-status{top:45px;left:var(--content-left);right:var(--content-right);gap:6px;font-size:7px;line-height:12px}
.phone-landscape .module-status #module-name{font-size:9px}
.phone-landscape .module-status>span:last-child{display:none}
.phone-landscape .disc-layout main,.phone-landscape .disc-layout main:has(#blog.active-module){position:relative;inset:auto;width:calc(100% - var(--content-left) - var(--content-right));height:auto;min-height:var(--site-height);margin:0 0 0 var(--content-left);padding:var(--phone-content-top) 0 12px;overflow:visible}
.phone-landscape #site-document>footer{position:relative;inset:auto;margin:0 var(--content-right) 0 var(--content-left);padding:12px 0;height:auto;min-height:0;font-size:10px}
.phone-landscape #site-document>footer .brand,.phone-landscape #site-document>footer p{display:none}
.phone-landscape .disc-layout h2{font-size:18px;line-height:1.35}
.phone-landscape .disc-layout .section-head{margin-bottom:8px}
.phone-landscape .section-head .eyebrow,.phone-landscape .wall-heading .eyebrow{display:none}
.phone-landscape .wall-heading{flex-direction:row;align-items:center}
.phone-landscape .wall-note{font-size:10px;line-height:1.5;margin:6px 0 10px}
.phone-landscape .tag-wall{padding:18px 14px;gap:9px 2px;border-width:3px}
.phone-landscape .tag-wall .wall-tag{font-size:16px;line-height:1.2;padding:7px 9px;margin:0 -2px -2px}
.phone-landscape .tag-wall .wall-tag.paper-1,.phone-landscape .tag-wall .wall-tag.paper-4{font-size:15px}
.phone-landscape .disc-layout #works .works-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px}
.phone-landscape .disc-layout #works .project-cover,.phone-landscape .disc-layout #works .project-cover.has-screenshot{height:auto;aspect-ratio:16/9;padding-top:14px}
.phone-landscape .disc-layout #works .project-window-bar{height:14px}
.phone-landscape .disc-layout #works .project-cover.has-screenshot>img{height:100%;aspect-ratio:auto}
.phone-landscape .disc-layout #works .project h3{font-size:11px}
.phone-landscape .disc-layout #works .project-text{margin-top:4px;font-size:9px}
.phone-landscape .disc-layout .blog-grid{columns:3;column-gap:12px}
.phone-landscape .game-room-library{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.phone-landscape .game-room-heading{margin-bottom:8px}
.phone-landscape .game-room-screen{height:calc(var(--site-height) - 145px);min-height:150px}
.phone-landscape .business-topics{grid-template-columns:repeat(2,minmax(0,1fr))}
.phone-landscape .business-intro{font-size:12px;line-height:1.7;margin-bottom:12px}

/* The player and library reserve separate, stable areas of the landscape canvas. */
.phone-landscape .disc-layout main:has(#music.active-module #music-box:not(.mb-immersive)),.phone-landscape .disc-layout main:has(#music.active-module #music-box.mb-immersive){position:fixed;inset:var(--phone-content-top) var(--content-right) calc(var(--phone-bottom) + var(--phone-player-height) + 10px) var(--content-left);margin:0;padding:0;min-height:0;width:auto;height:auto;overflow:hidden}
.phone-landscape .disc-layout main:has(#music.active-module #music-box.mb-immersive){bottom:calc(var(--phone-bottom) + var(--phone-player-height))}
.phone-landscape #site-document:has(#music.active-module)>footer,.phone-landscape #site-document:has(#knowledge.active-module)>footer,.phone-landscape #site-document:has(#guestbook.active-module)>footer{display:none}
.phone-landscape #music.active-module:has(#music-box:not(.mb-immersive)),.phone-landscape #music.active-module:has(#music-box.mb-immersive),.phone-landscape #music-box:not(.mb-immersive){height:100%;min-height:0;padding:0}
.phone-landscape #music-box>.mb-view>.mb-heading{display:none}
.phone-landscape #music-box:not(.mb-immersive)>.mb-view>.mb-shell,.phone-landscape #music-box:not(.mb-immersive) .mb-main,.phone-landscape #music-box:not(.mb-immersive) #mb-content{height:auto;min-height:0;flex:1;overflow:hidden}
.phone-landscape #music-box:not(.mb-immersive) .mb-sidebar{padding:0 0 6px;gap:4px}
.phone-landscape #music-box .mb-sidebar button[data-filter]{height:28px;min-height:28px;padding:4px 8px;font-size:10px;gap:5px}
.phone-landscape #music-box:not(.mb-immersive) .mb-main{position:relative;padding:0}
.phone-landscape #music-box .mb-top{margin:0 0 6px}
.phone-landscape #music-box .mb-search{max-width:min(250px,calc(100% - 160px));height:28px;padding:0 8px}
.phone-landscape #music-box .mb-search input{font-size:16px}
.phone-landscape #music-box .mb-list-heading{position:absolute;top:4px;right:94px;display:flex;align-items:baseline;gap:6px;font-size:10px}
.phone-landscape #music-box .mb-list-heading h2{display:none}
.phone-landscape #music-box .mb-list-actions{position:absolute;right:0;top:0;margin:0}
.phone-landscape #music-box .mb-list-actions>span{display:none}
.phone-landscape #music-box:has(#mb-upload:not([hidden])) .mb-list-heading{display:none}
.phone-landscape #music-box:has(#mb-upload:not([hidden])) .mb-search{max-width:45%}
.phone-landscape #music-box .mb-play-all{height:28px;min-height:28px;font-size:10px;padding:4px 9px}
.phone-landscape #music-box .mb-library-scroll{height:auto;max-height:none;min-height:0;flex:1;overflow-y:auto;overflow-x:hidden}
.phone-landscape #music-box .mb-table-head{padding-top:4px;padding-bottom:4px;font-size:9px}
.phone-landscape #music-box .mb-track{min-height:44px;padding:5px 0;gap:6px;grid-template-columns:minmax(0,1fr) 72px 32px 38px;border-radius:8px}
/* Inline-size containment creates a fixed-position containing block in WebKit.
   Keep it on the library shell so the player can reach the phone canvas edge. */
.phone-landscape #music-box{container-type:normal;contain:none}
.phone-landscape #music-box>.mb-view>.mb-shell{container-type:inline-size}
.phone-landscape #music-box>.mb-player,.phone-landscape #music-box:not(.mb-immersive)>.mb-player,.phone-landscape #music-box.mb-immersive>.mb-player{position:fixed;inset:auto var(--content-right) var(--phone-bottom) var(--content-left);height:var(--phone-player-height);min-height:var(--phone-player-height);padding:10px 12px;display:grid;grid-template-columns:minmax(100px,1fr) auto auto;grid-template-rows:1fr;gap:4px;align-items:center;z-index:30;border:0;border-radius:12px;background:#f4f7fb;box-shadow:0 6px 24px #243b5e14;color:#303849}
.phone-landscape #music-box.mb-immersive>.mb-player{background:var(--cover-bar,#202025);color:var(--cover-ink,#fafafa);border-radius:0 0 12px 12px}
.phone-landscape #music-box .mb-now{position:static;grid-column:1;grid-row:1;width:100%;min-width:0;max-width:100%;min-height:44px;justify-content:flex-start;text-align:left;gap:10px;align-self:center}
.phone-landscape #music-box .mb-mini-record{width:42px;height:42px;flex:0 0 42px;border:0;border-radius:9px;animation:none}
.phone-landscape #music-box .mb-mini-record img{border-radius:9px}
.phone-landscape #music-box .mb-now strong{font-size:13px;line-height:1.4}
.phone-landscape #music-box .mb-now small{font-size:11px;line-height:1.4;margin-top:3px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.phone-landscape #music-box .mb-transport{position:static;inset:auto;transform:none;grid-column:2;grid-row:1;justify-content:center;gap:0}
.phone-landscape #music-box .mb-transport .mb-icon,.phone-landscape #music-box .mb-actions .mb-icon,.phone-landscape #music-box .mb-text-button{width:44px;height:44px;min-width:44px;padding:10px;line-height:1;flex-shrink:0}
.phone-landscape #music-box .mb-play{width:48px;height:48px;min-width:48px;flex:0 0 48px;padding:12px;box-shadow:none}
.phone-landscape #music-box .mb-play svg{width:24px;height:24px}
.phone-landscape #music-box .mb-actions{position:static;inset:auto;transform:none;grid-column:3;grid-row:1;margin:0;gap:0}
.phone-landscape #music-box .mb-player-right{position:static;inset:auto;transform:none;padding:0;margin:0;gap:0}
.phone-landscape #music-box .mb-player-right #mb-time{position:static;inset:auto;transform:none;display:block;margin:0 4px;font-size:10px;line-height:14px;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:.2px;color:#63738a}
.phone-landscape #music-box.mb-immersive .mb-player-right #mb-time{color:var(--cover-muted,#bec5d0)}
.phone-landscape #music-box .mb-player-right .mb-volume{display:flex}
.phone-landscape #music-box .mb-player .mb-icon svg,.phone-landscape #music-box #mb-repeat svg,.phone-landscape #music-box #mb-prev svg,.phone-landscape #music-box #mb-next svg,.phone-landscape #music-box #mb-like svg,.phone-landscape #music-box #mb-notes svg{width:22px;height:22px}
.phone-landscape #music-box #mb-seek{top:-12px;height:24px;z-index:2;touch-action:pan-y}
.phone-rotated #music-box #mb-seek{touch-action:pan-x}
.phone-landscape #music-box #mb-seek::-webkit-slider-runnable-track{height:3px}
.phone-landscape #music-box #mb-seek::-webkit-slider-thumb{width:11px;height:11px;margin-top:-4px}
.phone-landscape #music-box .mb-volume-panel{bottom:calc(100% + 10px);left:auto;right:0;transform:none}
.phone-landscape #music-box .mb-error{right:12px;bottom:3px;max-width:42%;font-size:10px;line-height:14px}
.phone-landscape.phone-compact body.disc-layout{--phone-player-height:112px}
.phone-landscape.phone-compact #music-box>.mb-player{grid-template-columns:minmax(100px,1fr) auto;grid-template-rows:44px 44px;padding:8px 10px 12px;gap:4px 8px}
.phone-landscape.phone-compact #music-box .mb-now{gap:8px}
.phone-landscape.phone-compact #music-box .mb-mini-record{width:36px;height:36px;flex-basis:36px}
.phone-landscape.phone-compact #music-box .mb-now strong{font-size:12px}
.phone-landscape.phone-compact #music-box .mb-actions{grid-column:2;grid-row:1}
.phone-landscape.phone-compact #music-box .mb-transport{grid-column:1/-1;grid-row:2;gap:6px}
.phone-landscape.phone-compact #music-box .mb-player-right #mb-time{position:static;transform:none;margin:0 4px 0 0;font-size:9px;letter-spacing:0}
.phone-landscape.phone-compact #music-box .mb-error{max-width:100%;left:10px;right:10px;text-align:center}
.phone-landscape #music-box.mb-immersive .mb-main{padding:8px 12px 0}
.phone-landscape #music-box.mb-immersive .mb-song{width:100%}
.phone-landscape #music-box.mb-immersive .mb-song h2{font-size:18px}
.phone-landscape #music-box.mb-immersive .mb-song-meta{margin:3px 0;font-size:10px}
.phone-landscape #music-box.mb-immersive .mb-tabs{margin:6px auto}
.phone-landscape #music-box.mb-immersive .mb-lyrics-lines p{font-size:14px;line-height:1.6;margin:8px 0}
.phone-rotated #music-box #mb-seek{touch-action:pan-x}

.phone-landscape .disc-layout:has(#knowledge.active-module){--content-left:22%}
.phone-landscape .disc-layout main:has(#knowledge.active-module){position:fixed;inset:var(--phone-content-top) var(--content-right) var(--phone-bottom) var(--content-left);margin:0;padding:0;min-height:0;width:auto;height:auto;overflow:hidden}
.phone-landscape #knowledge>.section-head{margin-bottom:6px}
.phone-landscape #knowledge>.section-head h2{font-size:18px}
.phone-landscape #knowledge .library-nav{padding-bottom:5px;margin-bottom:5px}
.phone-landscape #knowledge .library-nav button{min-height:28px;padding:4px 8px}
.phone-landscape #knowledge #notebook-dialog .notebook-toolbar{height:34px;min-height:34px;padding:2px 6px;flex-wrap:nowrap}
.phone-landscape #knowledge #notebook-dialog .notebook-toolbar>div{flex:1 1 80px;font-size:11px}
.phone-landscape #knowledge #notebook-dialog .notebook-toolbar small{display:none}
.phone-landscape #knowledge #notebook-dialog .notebook-toolbar .quiet{height:28px;min-height:28px;padding:4px 6px;font-size:10px;white-space:nowrap}
.phone-landscape #knowledge #notebook-dialog .notebook-navigation{height:34px;min-height:34px;padding:2px 6px;flex-wrap:nowrap}
.phone-landscape #knowledge #notebook-dialog .reading-progress{order:0;flex:1;max-width:none}
.phone-landscape #knowledge #notebook-dialog .notebook-index-panel,.phone-landscape #knowledge #notebook-dialog #reading-settings-panel{top:34px;bottom:34px}

.phone-landscape .disc-layout main:has(#guestbook.active-module){position:fixed;inset:var(--phone-content-top) var(--content-right) var(--phone-bottom) var(--content-left);margin:0;padding:0;min-height:0;width:auto;height:auto;overflow:hidden}
.phone-landscape #guestbook.active-module{height:100%;min-height:0;overflow:hidden}
.phone-landscape #guestbook>.section-head{margin-bottom:6px}
.phone-landscape #guestbook-list{flex:1;min-height:48px;overflow:auto;padding:2px 6px 8px 0}
.phone-landscape #guestbook-list .guestbook-empty{padding:12px 16px}
.phone-landscape #guestbook-form{margin:0;padding-top:6px;gap:0}
.phone-landscape #guestbook-form>label{font-size:0;line-height:0;margin:0 0 5px}
.phone-landscape #guestbook-form textarea{height:40px;min-height:40px;max-height:64px;padding:7px 9px;font-size:16px;line-height:1.4;margin:0}
.phone-landscape #guestbook-form .gb-compose-actions{gap:4px 6px;flex-wrap:wrap}
.phone-landscape #guestbook-form .gb-compose-actions button{height:30px;min-height:30px;padding:0 8px;font-size:10px;line-height:1.4}
.phone-landscape #guestbook-form .gb-verification-hint{flex-basis:auto;order:0;font-size:9px}
.phone-landscape #guestbook-form .gb-compose-actions button[type=submit]{margin-left:auto}
.phone-landscape #guestbook-form .gb-audio-previews:has(.gb-voice-message){margin-top:6px}

/* Native dialogs live in the top layer, outside the transformed body. */
.phone-landscape body.disc-layout dialog{max-width:calc(var(--site-width) - 32px);max-height:calc(var(--site-height) - 24px);overflow:auto}
.phone-rotated body.disc-layout dialog{position:fixed;inset:auto;left:50%;top:50%;margin:0;transform:translate(-50%,-50%) rotate(90deg);transform-origin:center}
.phone-rotated .game-room-player:fullscreen{position:fixed;inset:auto;left:50%;top:50%;margin:0;width:var(--site-width);height:var(--site-height);transform:translate(-50%,-50%) rotate(90deg);transform-origin:center}
.phone-landscape #account.account-flow{width:var(--site-width);height:var(--site-height);max-width:none;max-height:none}
.phone-landscape #reader-content{height:calc(var(--site-height) - 24px)}

/* Phone density is independent of the desktop's editorial spacing. */
.phone-landscape .disc-layout>.module-status::before{top:-60px;bottom:-5px}
.phone-landscape .disc-layout header #search-open>span{display:none}
.phone-landscape .disc-layout header .header-action svg{width:12px;height:12px}
.phone-landscape .disc-layout #works .project-window-dots{gap:3px}
.phone-landscape .disc-layout #works .project-window-dots i{width:4px;height:4px}
.phone-landscape .tag-wall .wall-tag.paper-2{font-size:16px}
.phone-landscape .tag-wall .wall-tag.paper-3{font-size:17px}
.phone-landscape .tag-wall .wall-tag:nth-child(9n){padding-top:9px;padding-bottom:9px}
.phone-landscape .wall-tag::before{width:26px;height:10px;top:-5px;left:calc(50% - 13px)}
.phone-landscape .rednote-card h3{font-size:12px}
.phone-landscape .rednote-card .post-copy{padding:7px 1px 5px}
.phone-landscape .rednote-meta{font-size:9px}
.phone-landscape .rednote-meta img{width:17px;height:17px}
.phone-landscape .rednote-text-cover{padding:14px 12px;gap:8px}
.phone-landscape .rednote-text-cover>strong{font-size:18px}
.phone-landscape .rednote-text-cover>p{font-size:11px}
.phone-landscape .game-room-card-copy{padding:10px 12px;gap:8px}
.phone-landscape .game-room-card-copy strong{font-size:13px}
.phone-landscape .game-room-card-copy small,.phone-landscape .game-room-card-copy>span:last-child{font-size:10px}
.phone-landscape .game-room-toolbar{gap:5px;margin-bottom:8px}
.phone-landscape .game-room-toolbar strong{font-size:12px}
.phone-landscape .game-room-toolbar button{min-height:28px;padding:4px 8px;font-size:10px}
.phone-landscape .game-room-controls,.phone-landscape .game-room-note{font-size:10px;gap:6px 12px}
.phone-landscape .business-section h3{font-size:16px}
.phone-landscape .business-topics{gap:14px}
.phone-landscape .business-topics p{font-size:11px;line-height:1.6}

.phone-landscape #guestbook-count{font-size:10px;padding:2px 8px}
.phone-landscape #guestbook-list>article{padding:8px 10px;margin:0 0 8px;border-radius:8px;box-shadow:none}
.phone-landscape #guestbook-list article>.gb-message-header{gap:6px;flex-wrap:nowrap}
.phone-landscape #guestbook-list .gb-message-header strong{min-height:26px;padding:2px 7px;font-size:13px;line-height:1.5;border-radius:5px}
.phone-landscape #guestbook-list .gb-message-header time{flex-basis:auto;margin-left:auto;font-size:9px;white-space:nowrap}
.phone-landscape #guestbook-list .gb-message-header .guestbook-phone{font-size:10px}
.phone-landscape #guestbook-list>article>p{font-size:12px;line-height:1.6;margin:5px 0}
.phone-landscape #guestbook-list .gb-author-reply{margin:8px 0 2px;padding:8px 10px;border-radius:6px}
.phone-landscape #guestbook-list .gb-author-reply strong{font-size:11px}
.phone-landscape #guestbook-list>article>small{font-size:9px;padding:2px 6px;margin:4px 0}
.phone-landscape #guestbook-list .gb-message-actions{gap:12px;margin-top:8px;padding-top:5px}
.phone-landscape #guestbook-list .gb-message-actions button{min-height:26px;font-size:10px}
.phone-landscape #guestbook-list .gb-voice-message{margin:4px 0}
.phone-landscape #guestbook .gb-voice-bubble{width:clamp(100px,calc(var(--voice-width,180px)*.72),240px);min-height:30px;padding:6px 10px;border-radius:8px;font-size:12px;gap:18px}
.phone-landscape #guestbook .gb-voice-bubble svg{width:17px;height:17px}
.phone-landscape #guestbook .gb-voice-caption,.phone-landscape #guestbook .gb-voice-status{font-size:10px;margin-bottom:4px}
.phone-landscape #guestbook-list .guestbook-empty{font-size:13px}
.phone-landscape #guestbook-form textarea::placeholder{font-size:13px}
.phone-landscape #guestbook-form .gb-compose-actions .gb-visibility{min-height:30px;gap:5px;font-size:10px}
.phone-landscape #guestbook-form .gb-compose-actions .gb-visibility>span{font-size:10px;line-height:14px}
.phone-landscape #guestbook-form #gb-visibility-trigger{min-width:102px;gap:8px}
.phone-landscape #guestbook-form .gb-verification-control{min-height:30px;gap:6px}
.phone-landscape #guestbook-form .gb-compose-actions button[type=submit]{font-size:10px;min-width:60px}
.phone-landscape .gb-visibility-menu{width:156px;padding:4px;font-size:11px}
.phone-landscape .gb-visibility-menu [role=option]{min-height:34px;padding:0 8px;gap:8px}
.phone-landscape .gb-visibility-picker svg{width:14px;height:14px}

/* A track stays on one row even on the narrower landscape canvas. */
.phone-landscape #music-box .mb-table-head{display:grid;grid-template-columns:18px minmax(0,1fr) 72px 32px 38px;gap:6px}
.phone-landscape #music-box .mb-table-head>span:nth-child(4),.phone-landscape #music-box .mb-category{display:none}
.phone-landscape #music-box .mb-track-main{grid-column:auto;grid-row:auto;gap:6px}
.phone-landscape #music-box .mb-track-play{gap:6px}
.phone-landscape #music-box .mb-number{width:18px;font-size:9px}
.phone-landscape #music-box .mb-cover{width:30px;height:30px}
.phone-landscape #music-box .mb-track-copy strong{font-size:12px;line-height:1.4}
.phone-landscape #music-box .mb-track-copy small{font-size:9px;margin-top:3px;gap:5px}
.phone-landscape #music-box .mb-quality{font-size:7px;padding:0 2px;line-height:12px}
.phone-landscape #music-box .mb-track .mb-month{grid-column:auto;grid-row:auto;padding:0;font-size:9px}
.phone-landscape #music-box .mb-track .mb-heart{grid-column:auto;grid-row:auto;width:32px;height:32px;padding:6px}
.phone-landscape #music-box .mb-track .mb-duration{grid-column:auto;grid-row:auto;font-size:9px}
.phone-landscape #music-box .mb-row-actions{opacity:1;pointer-events:auto;gap:0}
.phone-landscape #music-box .mb-row-action{width:30px;height:32px;padding:6px}
.phone-landscape #music-box .mb-row-action svg{width:18px;height:18px}
.phone-landscape #music-box .mb-row-action .mb-glyph-note{width:20px;height:20px}
.phone-landscape #music-box .mb-sidebar button svg{width:14px;height:14px}
.phone-landscape #music-box .mb-play-all svg{width:11px;height:11px}
.phone-landscape #music-box .mb-transport .mb-icon svg,.phone-landscape #music-box .mb-actions .mb-icon svg{width:22px;height:22px}
.phone-landscape #music-box .mb-actions .mb-icon .mb-glyph-note{width:21px;height:21px}
.phone-landscape #music-box .mb-play svg{width:16px;height:16px}
.phone-landscape #music-box .mb-text-button{font-size:19px}
.phone-landscape #music-box .mb-tabs{height:28px;padding:2px}
.phone-landscape #music-box .mb-tabs button{padding:4px 11px;font-size:10px}
.phone-landscape #music-box .mb-comments-heading{gap:8px;margin-bottom:12px}
.phone-landscape #music-box .mb-comments-heading h2{font-size:16px}
.phone-landscape #music-box .mb-comments-heading .mb-cover{width:36px;height:36px}
.phone-landscape #music-box .mb-note-form{font-size:12px}
.phone-landscape #music-box .mb-note-list p{font-size:13px;line-height:1.6}

.phone-landscape #knowledge .library-nav #library-home,.phone-landscape #knowledge .library-nav .library-search{height:28px;min-height:28px;font-size:10px}
.phone-landscape #knowledge .library-nav .library-search{max-width:190px}
.phone-landscape #knowledge .ebook-library .library-zone{margin-bottom:18px}
.phone-landscape #knowledge .ebook-library .library-zone>h3{font-size:15px;margin-bottom:10px;padding-bottom:7px}
.phone-landscape #knowledge .ebook-library .library-book-row{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:14px 12px}
.phone-landscape #knowledge .ebook-library .library-book{max-width:120px}
.phone-landscape #knowledge .ebook-library .library-book>.ebook-cover{height:112px;width:84px;aspect-ratio:3/4;padding:12px 9px 8px}
/* The 16px badge is flush with the compact 84px cover's top-right corner. */
.phone-landscape #knowledge .library-book-item>.batch-item-choice{right:auto;left:60px}
.phone-landscape #knowledge .ebook-cover-title{font-size:14px}
.phone-landscape #knowledge .ebook-imprint{font-size:8px;margin-top:8px}
.phone-landscape #knowledge .ebook-library .library-book>.ebook-meta{font-size:11px;margin-top:7px}
.phone-landscape #knowledge .ebook-meta small{font-size:9px;margin-top:2px}
.phone-landscape #knowledge #notebook-dialog .left-page,.phone-landscape #knowledge #notebook-dialog .reader-leaf-content{font-size:clamp(12px,calc(var(--reading-size,22px)*.75),24px);line-height:1.7}
.phone-landscape #knowledge #notebook-dialog .left-page h2,.phone-landscape #knowledge #notebook-dialog .reader-leaf-content h2{font-size:18px;line-height:1.4;margin:0 0 12px}
.phone-landscape #knowledge #notebook-dialog .left-page h3,.phone-landscape #knowledge #notebook-dialog .reader-leaf-content h3{font-size:15px;line-height:1.5}
.phone-landscape #knowledge #notebook-dialog .reader-leaf{padding:14px 14px 26px}
.phone-landscape #knowledge #notebook-dialog .notebook-navigation .quiet{font-size:10px;padding:4px 6px;min-height:28px}
.phone-landscape #knowledge #notebook-dialog .notebook-navigation #note-page{font-size:9px}

.phone-landscape body.disc-layout dialog{font-size:12px}
.phone-landscape body.disc-layout dialog h2{font-size:19px}
.phone-landscape #owner{padding:16px}
.phone-landscape #owner h3{font-size:17px}
.phone-landscape #owner .editor-tabs{gap:4px}
.phone-landscape #owner .editor-tabs button{padding:5px 8px;min-height:28px;font-size:11px}
.phone-landscape #owner .editor-upload{min-height:52px;padding:8px;gap:8px}
.phone-landscape #owner .editor-upload-copy strong{font-size:12px}
.phone-landscape #owner .editor-upload-copy>span{font-size:10px}
.phone-landscape #owner .editor-upload-icon{width:24px;height:28px;flex-basis:24px}
.phone-landscape #owner .editor-upload-action{padding:5px 8px;font-size:10px}

/* Module-specific desktop selectors must not reclaim the phone's content gutter. */
html.phone-landscape body.disc-layout:has(#blog.active-module){--content-left:22%;--content-right:max(12px,calc(var(--phone-safe-end) + 6px));--content-inset:0px}
.phone-landscape .disc-layout main>section.active-module{padding-top:0}
.phone-landscape .disc-layout main:has(#blog.active-module){left:auto;right:auto}
.phone-landscape .disc-layout #blog .section-head{align-items:center;gap:8px}
.phone-landscape .disc-layout #blog .blog-grid{columns:3;column-gap:12px}
.phone-landscape .disc-layout #blog .filter button{min-height:28px;padding:4px 8px;font-size:10px}
.phone-landscape .rednote-card{margin-bottom:12px}
.phone-landscape .rednote-card .post{margin:0}
.phone-landscape #blog .rednote-text-cover{aspect-ratio:1;min-height:0}
.phone-landscape .post-published{font-size:9px;margin-top:3px}
.phone-landscape .rednote-text-cover>p{margin:0;line-height:1.7;-webkit-line-clamp:4}
.phone-landscape .rednote-text-cover>span,.phone-landscape .rednote-text-cover>small{font-size:9px}
.phone-landscape .save-note{display:grid;place-items:center;width:28px;height:28px;font-size:20px}

/* Fit four complete previews without changing the screenshots' proportions. */
.phone-landscape .disc-layout #works .works-grid{max-width:calc((var(--site-height) - 172px)*16/9 + 14px)}
.phone-landscape #site-document>footer{display:none}
.phone-landscape .disc-layout #works .section-head{margin-bottom:8px}
.phone-landscape .disc-layout #works .project-cover{border-radius:8px}
.phone-landscape .disc-layout #works .project-cover.nuwa>img{width:100%;height:100%;border-radius:0}
.phone-landscape .disc-layout #works .project-text{gap:8px}
.phone-landscape .disc-layout #works .project-text>span{font-size:9px;white-space:nowrap}

/* On a short screen, journal media and copy share the available height. */
.phone-landscape #reader{width:calc(var(--site-width) - 24px);border-radius:12px}
.phone-landscape #reader-content{display:grid;grid-template-columns:46% 54%;height:calc(var(--site-height) - 24px);min-height:0;overflow:hidden}
.phone-landscape #reader .rednote-gallery{height:100%;min-height:0}
.phone-landscape #reader .rednote-body{padding:16px 20px;min-width:0;min-height:0;overflow:auto}
.phone-landscape #reader .rednote-author{gap:8px;margin-bottom:12px;padding-right:30px}
.phone-landscape #reader .rednote-author img{width:28px;height:28px;border-radius:50%}
.phone-landscape #reader .rednote-author span{font-size:12px}
.phone-landscape #reader .rednote-author small{font-size:9px;margin-top:0}
.phone-landscape #reader-content h2{font-size:18px;margin:10px 0}
.phone-landscape #reader-content .body{font-size:13px;line-height:1.85;overflow-wrap:anywhere}
.phone-landscape #reader .rednote-category{font-size:11px;margin:12px 0 6px}
.phone-landscape #reader .rednote-body time{font-size:10px}
.phone-landscape #reader .dialog-close{width:30px;height:30px;right:8px;top:8px;padding:7px}
.phone-landscape #reader .gallery-buttons{width:46%;top:50%;padding:0 5px}
.phone-landscape #reader .gallery-position{left:calc(23% - 24px);top:auto;bottom:10px;min-width:48px;font-size:10px;padding:2px 6px}
.phone-landscape #reader-content:has(.rednote-text-cover){grid-template-columns:1fr}
.phone-landscape #reader-content:has(.rednote-text-cover)>.rednote-gallery{display:none}
.phone-landscape #reader-content:has(.rednote-text-cover)>.rednote-body{padding:18px 28px;max-width:72ch;width:100%;margin:0 auto}
.phone-landscape #reader .post-attachments{margin-top:14px;gap:8px}
.phone-landscape #reader .post-file{padding:8px;gap:8px}

/* Reader controls stay usable above the page instead of becoming a tall list. */
.phone-landscape #knowledge #notebook-dialog .notebook-toolbar>div{padding-bottom:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phone-landscape #knowledge #notebook-dialog .notebook-index-panel{padding:8px 10px}
.phone-landscape #knowledge #notebook-dialog .notebook-index-panel input{height:30px;margin:0 0 4px;padding:4px 8px;font-size:16px}
.phone-landscape #knowledge #notebook-dialog .reading-index-tabs{gap:8px;padding-bottom:4px}
.phone-landscape #knowledge #notebook-dialog .notebook-index-panel button{padding:6px;font-size:11px;gap:8px}
.phone-landscape #knowledge #notebook-dialog .notebook-index-panel button span{font-size:11px;line-height:1.5}
.phone-landscape #knowledge #notebook-dialog #reading-settings-panel{left:0;right:0;width:100%;padding:8px 12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:7px 16px}
.phone-landscape #knowledge #reading-settings-panel label,.phone-landscape #knowledge .reading-setting-row{min-width:0;min-height:28px;margin:0;gap:6px;font-size:11px}
.phone-landscape #knowledge #reading-settings-panel select{width:145px;min-width:0;max-width:72%;height:28px;margin:0;padding:1px 4px;font-size:12px}
.phone-landscape #knowledge #reading-settings-panel button{min-height:28px;padding:3px 8px;font-size:11px}
.phone-landscape #knowledge #reading-settings-panel input[type=range]{width:72%;margin:0}
.phone-landscape #knowledge .reading-themes{grid-column:1/-1;justify-content:center;gap:12px;padding:3px 0}

/* Keep the running game, toolbar and status inside one stable play area. */
.phone-landscape .game-room-heading h2{font-size:18px}
.phone-landscape .disc-layout #games.game-section{min-height:0;padding-bottom:0}
.phone-landscape .game-room-launch img{max-height:calc(var(--site-height) - 178px);object-fit:contain}
.phone-landscape .game-room-launch{border-radius:8px}
.phone-landscape .game-room-status:empty{display:none}
.phone-landscape .game-room-note{margin-top:10px;line-height:1.6}
.phone-landscape .disc-layout main:has(#games.active-module #game-room-player:not([hidden])){position:fixed;inset:var(--phone-content-top) var(--content-right) var(--phone-bottom) var(--content-left);width:auto;min-height:0;height:auto;margin:0;padding:0;overflow:hidden}
.phone-landscape #games.active-module:has(#game-room-player:not([hidden])){height:100%;padding:0;display:flex;flex-direction:column;align-items:stretch;min-height:0}
.phone-landscape #games:has(#game-room-player:not([hidden])) .game-room-heading,.phone-landscape #games:has(#game-room-player:not([hidden])) .game-room-note,.phone-landscape #site-document:has(#games.active-module #game-room-player:not([hidden]))>footer{display:none}
.phone-landscape #game-room-player:not([hidden]){display:flex;flex:1;flex-direction:column;min-height:0}
.phone-landscape .game-room-toolbar{flex:none;flex-wrap:nowrap;gap:5px;margin-bottom:6px}
.phone-landscape .game-room-toolbar strong{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:11px}
.phone-landscape .game-room-toolbar button{flex:none;padding:3px 7px;white-space:nowrap}
.phone-landscape #game-room-player .game-room-screen{flex:1;min-height:0;height:auto;width:100%;aspect-ratio:auto;border-radius:8px}
.phone-landscape .game-room-controls{flex:none;padding:5px 0 0;gap:3px 8px;font-size:9px}
.phone-landscape #games:has(#game-room-player:not([hidden])) .game-room-status{flex:none;font-size:10px;min-height:14px;margin:4px 0 0;line-height:1.4}
.phone-landscape .game-console{flex:1;min-height:0;height:auto;grid-template-columns:74px minmax(0,1fr) 74px;padding-top:7px;filter:drop-shadow(0 7px 6px #17243725)}
.phone-landscape .console-grip-left{border-radius:30px 0 0 30px}
.phone-landscape .console-grip-right{border-radius:0 30px 30px 0}
.phone-landscape .console-bezel{padding:8px 7px 0;margin-bottom:3px}
.phone-landscape .console-wordmark{font-size:8px;padding:5px 0;letter-spacing:1px}
.phone-landscape .game-console .console-stick{width:46px;height:46px}
.phone-landscape .console-stick-cap{inset:4px}
.phone-landscape .console-dpad{width:60px;height:60px;top:64%}
.phone-landscape .game-console .console-direction{width:24px;height:24px}
.phone-landscape .console-up,.phone-landscape .console-down{left:calc(50% - 12px)}
.phone-landscape .console-left,.phone-landscape .console-right{top:calc(50% - 12px)}
.phone-landscape .console-actions{width:62px;height:62px}
.phone-landscape .game-console .console-action{width:25px;height:25px;font-size:12px}
.phone-landscape .console-action-x,.phone-landscape .console-action-b{left:calc(50% - 12.5px)}
.phone-landscape .console-action-y,.phone-landscape .console-action-a{top:calc(50% - 12.5px)}
.phone-landscape .game-console .console-system-key{top:9px;width:24px;height:24px}
.phone-landscape .console-minus{right:6px}.phone-landscape .console-plus{left:6px}
.phone-landscape .console-system-key svg{width:18px;height:18px}
.phone-landscape .game-console .console-utility{width:26px;height:26px;bottom:10px}
.phone-landscape .console-utility svg{width:17px;height:17px}
.phone-landscape .game-console .console-shoulder{width:28px;height:18px;font-size:11px;top:-6px}
.phone-landscape .console-shoulder::after{content:"";position:absolute;inset:-4px 0}
.phone-landscape .console-grip-left .console-shoulder-primary,.phone-landscape .console-grip-right .console-shoulder-secondary{left:6px}
.phone-landscape .console-grip-left .console-shoulder-secondary,.phone-landscape .console-grip-right .console-shoulder-primary{right:6px}
.phone-landscape .console-power{right:5px;gap:3px}
@media(max-height:340px){
 .phone-landscape .game-console .console-stick{width:30px;height:30px}
 .phone-landscape .console-stick-left{top:38%}
 .phone-landscape .console-stick-right{top:87%}
 .phone-landscape .console-dpad{top:75%}
 .phone-landscape .console-actions{top:50%}
 .phone-landscape .game-console .console-shoulder{height:14px;top:-9px}
 .phone-landscape .console-utility,.phone-landscape .game-room-controls>span:last-child{display:none}
}
/* Give the artwork the available width and height, while all four topics fit. */
.phone-landscape .disc-layout main:has(#business.active-module){position:fixed;inset:var(--phone-content-top) var(--content-right) var(--phone-bottom) var(--content-left);width:auto;height:auto;min-height:0;margin:0;padding:0;overflow:visible}
.phone-landscape #business.active-module{display:flex;flex-direction:column;height:100%;min-height:0;padding:0}
.phone-landscape #business .section-head{flex:none}
.phone-landscape #business .business-layout{flex:1;min-height:0;display:block}
.phone-landscape #business .business-topics{height:100%;grid-template-rows:repeat(2,minmax(0,1fr));gap:12px 16px;align-items:stretch}
.phone-landscape .business-topics article{display:grid;min-height:0;grid-template-columns:minmax(0,1fr) max-content;grid-template-rows:1fr auto auto 1fr;gap:4px 12px;align-content:stretch}
.phone-landscape .business-topics .business-topic-image{grid-column:1;grid-row:1/-1;width:100%;height:100%;max-height:100%;aspect-ratio:auto;object-fit:contain;object-position:left center;margin:0;border-radius:6px}
.phone-landscape .business-topics h3{grid-column:2;grid-row:2;font-size:14px;margin:0;align-self:end}
.phone-landscape .business-topics a{grid-column:2;grid-row:3;align-self:start;font-size:11px;min-height:30px;gap:4px}


/* Shared task dialogs use phone spacing and preserve space for their actions. */
.phone-landscape #search,.phone-landscape #guestbook-login-required{width:min(560px,calc(var(--site-width) - 32px));padding:18px 20px}
.phone-landscape #search .dialog-top{margin-bottom:10px}
.phone-landscape #search input{height:36px;padding:6px 10px;font-size:16px;margin:0}
.phone-landscape #search-results{font-size:12px;margin-top:10px;overflow-wrap:anywhere}
.phone-landscape #search .search-hit{padding:10px 0;min-height:36px}
.phone-landscape #search .search-hit small{font-size:10px}
.phone-landscape #guestbook-login-required .primary,.phone-landscape #guestbook-login-required .quiet{min-height:32px;font-size:12px;padding:6px 12px}


/* Account forms keep readable type and touch-sized controls on the rotated canvas. */
.phone-landscape #account .account-shell{padding:12px max(20px,calc(var(--phone-safe-end) + 12px)) max(12px,calc(var(--phone-safe-bottom) + 8px)) max(20px,calc(var(--phone-safe-start) + 12px))}
.phone-landscape #account .account-header:empty{display:none}
.phone-landscape #account .account-task{width:min(600px,100%);margin:0 auto 16px}
.phone-landscape #account .account-back{min-height:44px;margin:0 0 4px;font-size:13px}
.phone-landscape #account #account-description{margin:0 0 14px;font-size:13px;line-height:1.6}
.phone-landscape #account .account-task h2{margin:0 0 6px;font-size:24px;line-height:1.3}
.phone-landscape #account .account-task #account-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
.phone-landscape #account .account-task label{min-width:0;gap:6px;font-size:13px}
.phone-landscape #account .account-task input{height:44px;margin:0;padding:0 12px;font-size:16px}
.phone-landscape #account .account-task .password-field input{padding-right:52px}
.phone-landscape #account .account-task .primary,.phone-landscape #account .account-secondary{height:44px;min-height:44px;font-size:15px}
.phone-landscape #account #account-submit,.phone-landscape #account .account-links,.phone-landscape #account #account-sms-consent-label,.phone-landscape #account #account-help,.phone-landscape #account #account-status{grid-column:1/-1}
.phone-landscape #account[data-step="password"] #account-submit{grid-column:1}
.phone-landscape #account[data-step="password"] .account-links{grid-column:2;align-items:center}
.phone-landscape #account[data-step="phone"] .account-task,.phone-landscape #account[data-step="code"] .account-task{width:min(480px,100%)}
.phone-landscape #account[data-step="phone"] #account-phone-label,.phone-landscape #account[data-step="code"] #account-code-label,.phone-landscape #account #account-nickname-label{grid-column:1/-1}
.phone-landscape #account .account-task .code-row button{height:44px;min-width:104px;padding:0 12px;font-size:12px}
.phone-landscape #account .account-links button{min-height:44px;font-size:13px;white-space:nowrap}
.phone-landscape #account .account-footer{padding:0;width:min(600px,100%)}
.phone-landscape #account .account-footer button{min-height:44px;margin:0;padding:6px 12px;font-size:13px}
.phone-landscape #account .account-footer p{font-size:12px;line-height:1.5}
.phone-landscape #account .account-task .account-sms-consent{min-height:44px;font-size:12px;line-height:1.6;font-weight:400}
.phone-landscape #account .account-task #account-sms-consent{width:18px;height:18px;flex:none;margin:1px 0 0}
.phone-landscape #account #account-welcome{max-width:400px;margin:20px auto 0;gap:12px}

/* Shared game frame fits the logical landscape viewport, including web players. */
.phone-landscape #game-room-player:not([hidden]){padding:7px;border-radius:12px}
.phone-landscape #game-room-player .game-room-nameplate{min-height:18px;padding:0 3px 6px;gap:6px}
.phone-landscape #game-room-player .game-room-nameplate strong{font-size:13px}
.phone-landscape #game-room-player .game-room-nameplate>svg{width:16px;height:16px}
.phone-landscape #game-room-player .game-room-toolbar{flex-wrap:nowrap;gap:6px;margin:0;padding:8px 2px 0;min-height:0}
.phone-landscape #game-room-player .game-room-toolbar button{min-width:44px;min-height:44px;padding:0 2px;font-size:9px;gap:3px}
.phone-landscape #game-room-player .game-room-toolbar svg{width:28px;height:28px;padding:6px}
.phone-landscape #game-room-player .game-room-stage{padding:4px}
.phone-landscape #game-room-player[data-kind="gba"] .game-room-stage{padding:0}
.phone-landscape .game-room-stage{display:flex;flex:1;min-height:0}
.phone-landscape .web-game-screen{flex:1;min-height:0;height:auto}
.phone-landscape #game-room-player.is-expanded,.phone-landscape #game-room-player:fullscreen{padding:7px;border-radius:0;flex:none;width:var(--site-width);height:var(--site-height)}
.phone-landscape #game-room-player .game-room-status{font-size:10px;margin-top:4px}
@media(max-height:340px),(max-width:340px){.phone-landscape #game-room-player .game-room-controls{display:none}}
