/* Desktop is a larger table, with the same controls and mobile-first game beneath it. */
.desktop-progress-button,.desktop-album-heading{display:none}
#dialog .progress-overview{max-width:720px}
#dialog .progress-overview .right-rail{display:block;border:0;background:none;padding:0}
#dialog .progress-overview .reward-box{padding:20px}
#dialog .progress-overview .reward-box img{height:100px}
#dialog .progress-overview .find-row{min-height:56px}
@media(min-width:1100px){
  :root{--desktop-rail:184px;--desktop-gutter:clamp(28px,3vw,52px)}
  .left-rail{width:var(--desktop-rail);padding:18px 14px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;background:linear-gradient(180deg,#21152d,#17101f 70%)}
  .left-rail .brand,.left-rail .brand img{max-width:100%}
  .left-rail .rail-label{margin-top:28px;color:#c8b1d5}
  .left-rail nav{gap:9px}
  .left-rail .nav-item{min-height:48px;padding:13px 12px;font-size:13px;border-radius:10px}
  .left-rail .rail-promo{background:none;border:0;border-top:1px solid #76528c55;border-radius:0;padding-top:24px;margin-top:28px}
  .left-rail .rail-promo img{height:78px;filter:drop-shadow(0 5px 12px #b587da30)}
  .left-rail .rail-promo p{font-size:11px}
  .topbar{margin-left:var(--desktop-rail);min-height:76px;height:auto;flex-wrap:wrap;padding-block:14px;padding-inline:var(--desktop-gutter);gap:14px;background:#171020;border-bottom-color:#89629e38}
  .topbar .top-title{letter-spacing:.12em;font-size:11px}
  .topbar .top-tag{opacity:.8}
  .topbar .desktop-progress-button{display:inline-flex;background:transparent;box-shadow:none}
  #app .app-layout,#app.at-home .app-layout,#app[data-view="expedition"] .app-layout{margin-left:var(--desktop-rail);display:block}
  .app-layout>main{container:oddfoil-main / inline-size;max-width:1520px;margin-inline:auto;padding:32px var(--desktop-gutter) 64px}
  .app-layout>.right-rail{display:none}
  .odd-footer{margin-left:var(--desktop-rail);padding:32px var(--desktop-gutter)}
  #main h1{font-size:clamp(34px,3vw,46px);line-height:1.13;letter-spacing:-.035em}
  #main h2{line-height:1.25}
  #main>.panel,#main .workshop-top>.panel,#main .settings-grid>.panel{padding:28px}
  #main .section-block{margin-block:36px}
  #main .section-heading{margin-bottom:20px;gap:24px}
  .home-hero-refined.welcome-studio{padding:clamp(30px,3.3vw,50px);min-height:400px;margin-bottom:32px;border-color:#b995d866;border-radius:26px}
  .home-hero-refined.welcome-studio:after{background:linear-gradient(90deg,#1b1128f5 0%,#21132bdc 43%,#21132b45 76%,#21132b05)}
  .home-hero-refined .welcome-copy{max-width:600px}
  .home-hero-refined .welcome-copy>p{font-size:15px;line-height:1.75;max-width:48ch;margin-bottom:24px}
  .home-hero-refined .welcome-copy>h1{max-width:16ch;margin-bottom:18px}
  .home-hero-actions{max-width:510px;gap:12px;margin-bottom:18px}
  .home-hero-actions>.hero-quick-selected{min-height:78px}
  .home-hero-actions>.button:not(.hero-quick-selected){background:#33253de6;color:#ecddf7;border-color:#a57cc066;box-shadow:none}
  #main>.mystery-shelf{display:grid;grid-template-columns:minmax(230px,.8fr) minmax(0,1.5fr);gap:12px 32px;align-items:center;margin:0 0 32px;padding:24px 12px 28px;background:radial-gradient(ellipse at 70% 60%,#a16aaf12,transparent 70%);border:0;border-bottom:1px solid #ac80c140;border-radius:0}
  .mystery-shelf>.section-heading{grid-column:1;display:flex;flex-direction:column;align-items:flex-start;margin:0!important;gap:14px!important}
  .mystery-shelf>.section-heading h2{font-size:25px;max-width:20ch}
  .mystery-shelf>.welcome-cards{grid-column:2;grid-row:1/3;gap:clamp(12px,2vw,30px);margin:6px 0;min-width:0}
  .mystery-shelf>.welcome-cards>.shelf-card{display:block;width:clamp(130px,12vw,180px);max-width:29%;box-shadow:0 12px 24px #0c071c55}
  .mystery-shelf>.welcome-cards>.shelf-card:nth-child(1){transform:rotate(-4deg)}
  .mystery-shelf>.welcome-cards>.shelf-card:nth-child(2){transform:translateY(-7px) rotate(1deg)}
  .mystery-shelf>.welcome-cards>.shelf-card:nth-child(3){transform:rotate(5deg)}
  .mystery-shelf>p{grid-column:1;margin:0;max-width:32ch;align-self:start}
  .mystery-shelf>.sample-counter{grid-column:1/-1;margin-top:10px}
  .quick-access{gap:18px;margin-block:28px}
  .quick-access>.quick-tile{padding:22px;min-height:142px;background:linear-gradient(145deg,#36263d99,#21182c55);border-color:#ae87c13d;border-radius:16px;box-shadow:none}
  .quick-access>.quick-tile>span{color:#dac5ef;font-size:26px}
  .quick-access>.quick-tile>b{font-size:16px}
  .home-summary{background:none;border-inline:0;padding:18px 0;margin-block:24px}
  .home-summary+ .selected-deck-banner{margin-top:28px}
  .identity-heading.world-heading>.world-heading-content{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,1fr);gap:14px 32px;padding:28px 32px}
  .identity-heading .identity-intro{grid-column:1;grid-row:1/3;grid-template-columns:minmax(0,1fr) 76px;gap:16px}
  .identity-heading .identity-art{width:76px;border:0;background:none;box-shadow:none}
  .identity-heading .identity-intro h1{font-size:clamp(30px,2.7vw,40px);margin-block:12px}
  .identity-heading .identity-intro p{font-size:14px;max-width:45ch}
  .identity-heading .identity-stats{grid-column:2;grid-row:1;align-self:center;margin:0;gap:0}
  .identity-heading .identity-stat{background:#21172f99;box-shadow:none;border:0;border-left:1px solid #c99ee34d;border-radius:0;padding:12px 14px;display:block}
  .identity-heading .identity-stat-icon{font-size:18px;display:block;margin-bottom:8px}
  .identity-heading .identity-stat strong{font-size:28px}
  .identity-heading .identity-stat div>span{font-size:11px;line-height:1.5}
  .identity-heading .identity-progress,.identity-heading .identity-footnote{grid-column:2;margin:0;font-size:12px;align-self:start}
  .identity-heading .world-interaction{grid-column:1;grid-row:3;margin:0}
  .identity-heading .world-souvenirs{grid-column:2;grid-row:3;margin:0;align-self:center}
  .identity-heading.world-heading:before{background:linear-gradient(90deg,#1b1228ee,#1e1429de 58%,#2a19365c)}
  .identity-heading.world-heading>.room-art{opacity:.85}
  .album-controls{display:block;padding:0 0 16px;background:none;border:0;border-bottom:1px solid #a77ebf45;border-radius:0}
  .desktop-album-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:8px 0}
  .desktop-album-heading b{display:block;font-size:16px}
  .desktop-album-heading small{display:block;margin-top:4px;text-transform:capitalize}
  .album-controls>.album-options{display:none;grid-template-columns:minmax(0,1fr) auto;gap:12px 20px;padding:20px 24px;margin-top:16px;background:#281d34aa;border:1px solid #a77ebf45;border-radius:16px}
  .album-controls.album-expanded>.album-options{display:grid}
  .album-options>.collection-decor{grid-column:2;grid-row:1/3;margin:0;padding:0;border:0;max-width:300px;align-self:start}
  .album-options>.collection-decor>summary{padding:10px 0;min-height:44px}
  .album-options>.album-toolbar{grid-column:1;grid-row:1;margin:0}
  .album-options>.album-themes{grid-column:1;grid-row:2;margin:0}
  .album-options>.album-themes .button{min-height:36px;font-size:11px;padding:6px 12px;background:transparent;box-shadow:none}
  .album-options>.album-themes .button[aria-pressed=true]{background:#66477c}
  .album-options>.micro,.album-options>.album-goal,.album-options>.album-set-goals,.album-options>.featured-album{grid-column:1/-1;margin:0}
  .album-options>.album-set-goals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .album-set-goals>button{min-width:0;padding:12px 16px;background:#20172988}
  .album-options>.album-goal{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 20px;padding:16px}
  .album-options>.album-goal>b,.album-options>.album-goal>progress,.album-options>.album-goal>small{grid-column:1}
  .album-options>.album-goal>.actions{grid-column:2;grid-row:1/4;align-self:center}
  #main>.filters{display:grid;grid-template-columns:minmax(220px,1.6fr) repeat(3,minmax(130px,1fr));gap:12px;align-items:center;margin-block:24px 12px}
  #main>.filters>.search-label{margin:0;min-width:0}
  #main>.filters>select{max-width:100%;width:100%}
  .results-line{gap:16px;line-height:1.6;margin-block:16px 24px}
  #main>.collection-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:30px 22px;align-items:start}
  #main>.collection-grid.layout-album{padding:24px}
  #main>.collection-grid .card-title{font-size:16px;line-height:1.35}
  #main>.collection-grid .card-rule{font-size:12px;line-height:1.65}
  .workshop-top{gap:24px;margin-top:28px}
  .research-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
  .research-grid>.panel{padding:24px;display:flex;flex-direction:column;align-items:flex-start}
  .research-grid>.panel>.button{margin-top:auto;font-size:12px}
  .research-grid>.panel>p{font-size:13px;line-height:1.65}
  .settings-grid{gap:28px;margin-top:28px;align-items:start}
  .settings-grid .setting-row{padding-block:16px}
  .mode-hub{margin-block:30px}
  .mode-grid{gap:14px}
  .mode-choice{padding:18px;min-height:88px;background:#2b203577}
  .mode-choice.selected{background:linear-gradient(125deg,#4c3261,#2d223c)}
  .quick-play-panel{padding:26px;margin:24px 0 32px}
  .quick-play-choice{min-height:116px;padding:20px}
  .selected-deck-banner{padding:22px 26px;border-width:1px;gap:24px}
  .battle-stage .encounter-card{padding:24px;gap:24px}
  .battle-stage .hand{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:18px;padding:12px 0 20px;overflow:visible;justify-content:stretch}
  .battle-stage .hand-slot{width:auto;min-width:0;flex:initial}
  .battle-stage .hand-slot>.card{width:100%;max-width:none}
  .battle-stage .combat-toolbar{padding:16px;gap:14px;border-color:#c7a6dd88;background:#261b35f5;box-shadow:0 8px 22px #0c071c66}
  .battle-stage .battle-resource-guide{margin-block:20px}
  .battle-stage .hand-help{margin-block:18px}
  .battle-bottom{gap:24px;padding-block:16px}
  .run-top{margin-block:24px}
  .run-top h2{font-size:25px}
  .result-stage{max-width:1100px;margin-inline:auto;padding-block:48px}
  #dialog{container:oddfoil-dialog / inline-size;max-width:calc(100% - 24px);max-height:calc(100% - 24px)}
  #dialog.deck-flow[open],#dialog.pack-flow[open]{max-height:calc(100% - 24px);height:min(1000px,calc(100% - 24px))}
  #dialog.deck-flow[open]{width:min(1340px,calc(100% - 64px))}
  .deck-editor-layout{grid-template-columns:300px minmax(0,1fr);gap:28px}
  .deck-editor-scroll{padding:28px}
  .visual-deck-picks{gap:18px}
  .deck-tile{padding:12px}
  #dialog .progress-overview .right-rail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:24px}
  #dialog .progress-overview .reward-box{grid-column:1}
  #dialog .progress-overview .right-rail>section{margin:0}
  #dialog .progress-overview .right-rail>section:nth-of-type(2){grid-column:1/-1}
  #dialog .progress-overview .right-rail>.micro{grid-column:1/-1;margin:0}
}
@media(min-width:1600px){:root{--desktop-rail:208px}.left-rail .brand,.left-rail .brand img{width:180px}.topbar .top-tag{display:block}.mystery-shelf>.welcome-cards>.shelf-card{width:190px}.identity-heading.world-heading>.world-heading-content{gap:16px 48px;padding:36px 40px}}
@media(min-width:1100px) and (hover:hover) and (pointer:fine){
  .quick-tile:hover,.mode-choice:hover{border-color:#cc9be0aa;background-color:#45304e;transform:translateY(-3px);box-shadow:0 10px 24px #0d071b55}
  .mystery-shelf>.welcome-cards>.shelf-card:hover,.mystery-shelf>.welcome-cards>.shelf-card:focus-visible{transform:translateY(-8px) rotate(0);z-index:2}
  .left-rail .brand:hover{filter:drop-shadow(0 0 8px #b282d64d)}
}
@media(prefers-reduced-motion:reduce){.mystery-shelf>.welcome-cards>.shelf-card,.quick-tile,.mode-choice{transition:none!important;transform:none!important}}
[data-motion=reduced] .mystery-shelf>.welcome-cards>.shelf-card,[data-speed=instant] .mystery-shelf>.welcome-cards>.shelf-card{transform:none!important;transition:none!important}
@media(min-width:1100px) and (max-height:760px){.left-rail .rail-promo img{display:none}.left-rail .rail-promo{padding-top:16px;margin-top:20px}.left-rail .rail-bottom{padding-top:12px}}

/* Container reflow also protects desktop text enlargement inside a narrow workspace. */
@container oddfoil-main (max-width:820px){
 .identity-heading.world-heading>.world-heading-content{grid-template-columns:minmax(0,1fr);gap:18px;padding:24px}
 .identity-heading .identity-intro,.identity-heading .identity-stats,.identity-heading .identity-progress,.identity-heading .identity-footnote,.identity-heading .world-interaction,.identity-heading .world-souvenirs{grid-column:1;grid-row:auto}
 #main>.filters{grid-template-columns:repeat(2,minmax(0,1fr))}
 #main>.filters>.search-label{grid-column:1/-1}
 .album-controls>.album-options{grid-template-columns:minmax(0,1fr);padding:16px}
 .album-options>.collection-decor,.album-options>.album-toolbar,.album-options>.album-themes{grid-column:1;grid-row:auto;max-width:100%}
 .album-options>.album-goal{display:block}
 .album-options>.album-goal>.actions{margin-top:12px}
 .album-controls>.album-options>.album-set-goals{grid-template-columns:minmax(0,1fr)}
 .desktop-album-heading{align-items:flex-start;flex-wrap:wrap;gap:12px}
 #main>.mystery-shelf{grid-template-columns:minmax(0,1fr);gap:20px;padding-inline:0}
 .mystery-shelf>.section-heading,.mystery-shelf>.welcome-cards,.mystery-shelf>p{grid-column:1;grid-row:auto}
 .mystery-shelf>.section-heading{flex-direction:row;align-items:center;justify-content:space-between}
 .quick-access,.research-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .workshop-top,.settings-grid{grid-template-columns:minmax(0,1fr)}
 .mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .selected-deck-banner{flex-wrap:wrap}
}

@container oddfoil-dialog (max-width:800px){
 .deck-editor-layout{grid-template-columns:minmax(0,1fr)}
 .visual-deck-picks{grid-template-columns:repeat(2,minmax(0,1fr))}
 .inspect-layout{grid-template-columns:minmax(0,1fr)}
 .progress-overview .right-rail{grid-template-columns:minmax(0,1fr)!important}
}