/* Desktop keeps its approved composition. Only the canvas wrapper is global. */
.world-stage{position:absolute;inset:0;z-index:1;pointer-events:none}
.world-stage #worldCanvas{pointer-events:auto}
.utility-toggle{display:none}

/* The same breakpoint is used by responsive-layout.js and the 3D camera. */
@media (max-width:1100px), (max-width:1366px) and (pointer:coarse){
  .search-landing{height:auto;min-height:0;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);grid-template-areas:"header header" "weather weather" "center world" "bottom bottom";column-gap:24px;padding:0 24px 24px;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px));overflow:visible;align-items:center}
  body.engine-open .search-landing{z-index:20}
  .search-landing>.topbar{grid-area:header;position:relative;inset:auto;height:auto;min-height:72px;padding:calc(10px + env(safe-area-inset-top,0px)) 0 10px;grid-template-columns:minmax(0,1fr) auto;gap:12px;z-index:30;background:none;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .topbar-left{gap:8px}.topbar-left .brand{display:flex;gap:8px}.brand-mark{width:36px;height:36px;flex-basis:36px}.brand-copy{display:flex}.brand-copy b{font-size:17px}.brand-copy small{display:none}
  .mobile-menu-button{display:grid;width:44px;height:44px;flex:0 0 44px;margin:0}
  .top-actions{gap:6px;position:static}.account-copy,.account-button>svg{display:none}
  .utility-toggle,.notice-button,.account-button{width:44px;height:44px;min-width:44px;flex:0 0 44px;border-radius:13px}
  .account-button{justify-content:center;padding:3px}.account-avatar{width:34px;height:34px;flex-basis:34px;border-radius:10px}
  .utility-toggle{display:grid;place-items:center;border:1px solid var(--theme-line);background:rgba(var(--accent-rgb),.045);color:#afbece;cursor:pointer}
  .utility-toggle svg{width:20px;height:20px}.notice-button svg{width:21px;height:21px}.notice-dot{top:6px;right:6px}
  .utility-nav{display:none;position:absolute;right:0;top:calc(100% + 4px);width:min(354px,calc(100vw - 32px));height:auto;max-width:none;grid-template-columns:repeat(3,minmax(0,1fr));padding:10px;gap:6px;overflow:visible;perspective:none;border:1px solid var(--theme-line);border-radius:20px;background:var(--glass-deep);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);box-shadow:0 18px 48px #0005}
  body.utility-open .utility-nav{display:grid}
  .utility-link{width:auto;height:70px;min-width:0;padding:9px 3px;gap:7px;display:flex;flex-direction:column;justify-content:center;flex-basis:auto;border-radius:12px}
  .utility-icon{width:24px;height:24px}.utility-icon svg{width:21px;height:21px}
  .utility-link .utility-label,.utility-link:hover .utility-label,.utility-link:focus-visible .utility-label{position:static;min-width:0;transform:none;opacity:1;pointer-events:auto;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;color:inherit;font-size:12px;white-space:nowrap}
  .notice-anchor{position:static}.notice-popover{position:absolute;top:calc(100% + 4px);right:0;left:auto;width:min(354px,calc(100vw - 32px));max-height:65dvh;overflow:auto}.notice-popover:before{display:none}
  .landing-weather{grid-area:weather;position:relative;inset:auto;justify-self:end;margin:4px 0 14px;gap:7px;min-height:28px}
  .landing-weather>div{display:flex;align-items:center;gap:9px}.landing-weather strong{font-size:12px;gap:6px}.landing-weather #weatherTemperature{font-size:16px}.landing-weather #weatherCity{font-size:12px}.landing-weather .weather-icon{font-size:20px}.weather-details{display:none}
  .landing-center,body[data-theme="network"] .landing-center{grid-area:center;position:relative;inset:auto;transform:none;min-width:0;width:100%;max-width:680px;justify-self:center;padding:10px 0 0;align-self:center}
  .landing-date{font-size:13px;gap:10px;letter-spacing:.025em;flex-wrap:wrap}.landing-date #lunarDate{display:none}.date-divider{width:16px}
  .landing-center .clock-time{font-size:clamp(72px,9vw,100px);margin:12px 0 10px;line-height:1.02}
  .landing-greeting{font-size:16px;letter-spacing:.035em}.landing-greeting #dayPhase{font-size:16px}
  .landing-center h1{font-size:17px;max-width:none;margin:20px 0 15px;line-height:1.7;letter-spacing:0;text-wrap:balance}
  .landing-center .search-box{height:58px;border-radius:18px;max-width:100%;min-width:0}
  .engine-picker{flex:0 0 63px;min-width:0}.engine-trigger{grid-template-columns:29px 12px;padding:0 8px;gap:4px}.engine-trigger>span:nth-child(2){display:none}.engine-logo{width:29px;height:29px}.engine-logo img{width:21px;height:21px}.engine-trigger svg{width:12px}
  .search-box>input{min-width:0;width:0;font-size:16px;padding:0 10px}.search-divider{display:block;height:24px}.search-icon,.search-box kbd{display:none}.search-button{height:44px;padding:0 16px;margin-right:6px;font-size:14px;border-radius:13px;flex-shrink:0}
  .engine-menu{top:calc(100% + 10px);width:210px;max-width:calc(100vw - 32px);max-height:min(320px,48dvh);z-index:50}
  .landing-center .daily-quote{font-size:12px;line-height:1.8;max-width:460px;margin:15px auto 0;padding:0 7px;letter-spacing:.02em;text-wrap:pretty}
  .world-stage{grid-area:world;position:relative;inset:auto;min-width:0;width:100%;height:clamp(250px,36vw,350px);align-self:center;justify-self:center;overflow:clip;isolation:isolate}
  #worldCanvas{width:100%;height:100%;touch-action:pan-y pinch-zoom}
  .network-hud{display:none!important}
  .landing-bottom{grid-area:bottom;position:relative;inset:auto;width:100%;max-width:720px;min-width:0;justify-self:center;display:flex;flex-direction:column;align-items:stretch;gap:14px;margin-top:14px}
  .world-caption{display:none}
  .world-controls{position:static;inset:auto;order:-1;width:100%;align-self:auto;justify-self:auto;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:18px}
  .world-controls>span{display:block;max-width:none;text-align:left;line-height:1.6;font-size:12px}.world-controls>div{gap:8px}.world-controls button{width:44px;height:44px;border-radius:13px}.world-controls svg{width:17px;height:17px}
  .theme-switcher{width:100%;gap:14px;align-items:stretch}.theme-dock{width:100%;max-width:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding:5px;gap:2px;border-radius:20px}
  .theme-choice{width:auto;height:64px;min-width:0;padding:6px 0;gap:7px;border-radius:14px}.theme-choice svg{width:22px;height:22px}.theme-choice span{font-size:12px;letter-spacing:0}
  .scroll-cue{min-height:40px;justify-content:center;flex-direction:row;gap:7px;font-size:12px}
  body.world-unavailable .world-stage{display:none}body.world-unavailable .world-controls>div{display:none}
  .collection-section{padding:28px 0 8px;scroll-margin-top:0;min-height:0}
  .collection-intro{padding:0 24px 20px;gap:16px;flex-wrap:wrap;align-items:center}.collection-intro h2{font-size:24px;margin-top:8px}.collection-intro>div>span{font-size:10px;letter-spacing:.14em}
  .collection-actions{gap:16px}.collection-menu-button{display:flex;min-height:44px}.collection-actions a{min-height:44px;display:flex;align-items:center;font-size:13px}
  .page-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;padding:0 24px;min-height:0;align-items:start}
  /* A closed drawer must never reserve space in the collection's normal flow. */
  .left-rail{position:fixed;inset:0 auto 0 0;top:0;width:min(300px,calc(100vw - 36px));height:100vh;height:100dvh;min-height:0;max-height:100dvh;z-index:55;grid-row:auto;transform:translateX(-105%);visibility:hidden;padding:calc(16px + env(safe-area-inset-top,0px)) 14px calc(16px + env(safe-area-inset-bottom,0px));border-radius:0 20px 20px 0;background:var(--glass-deep);transition:transform .25s ease,visibility .25s;box-shadow:20px 0 60px #0005}
  body.mobile-rail-open .left-rail{transform:translateX(0);visibility:visible}
  .rail-collapse-button{display:none}.rail-mobile-close{display:grid;place-items:center;width:44px;height:44px;min-width:44px}.rail-account{margin-top:auto;flex-shrink:0}.category-nav{min-height:0;padding-bottom:16px;overscroll-behavior:contain}
  body.rail-collapsed .left-rail{padding:calc(16px + env(safe-area-inset-top,0px)) 14px calc(16px + env(safe-area-inset-bottom,0px))}
  body.rail-collapsed .rail-heading,body.rail-collapsed .rail-account{display:revert}
  body.rail-collapsed .rail-account{display:grid}
  body.rail-collapsed .rail-top{padding:0 4px;justify-content:space-between}
  body.rail-collapsed .category-button{grid-template-columns:30px minmax(0,1fr) auto;place-items:initial;align-items:center;justify-content:flex-start;padding:5px 8px;gap:9px}
  body.rail-collapsed .category-button>span:nth-child(2),body.rail-collapsed .category-button em{display:block}
  body.rail-collapsed .category-button:after{display:none}
  .mobile-rail-backdrop{z-index:54}
  .main-content{height:auto;min-width:0;min-height:0;gap:18px;grid-column:1}
  .directory-panel{height:auto;min-height:0;flex:none;padding:20px;border-radius:21px}
  .site-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px}.site-card{min-height:106px}
  .activity-panel{min-height:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-radius:21px}.recent-center{padding:18px;border-right:1px solid var(--theme-line);border-bottom:0}.recent-center-list .recent-empty{min-height:70px;padding:14px;line-height:1.7;text-align:center}
  .inspiration-layout{height:auto;min-height:150px;grid-template-columns:minmax(90px,.8fr) minmax(0,1fr)}.inspiration-copy{min-width:0}.inspiration-copy>div{gap:7px}
  .right-rail{display:block;grid-column:1;grid-row:auto;margin:0;height:auto;min-width:0}.hot-panel{min-height:0;padding:20px;border-radius:21px}.hot-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}.hot-list li{min-height:46px}
  .site-footer{min-height:0;padding:24px 20px calc(24px + env(safe-area-inset-bottom,0px));font-size:12px;line-height:1.8;gap:6px 12px;overflow-wrap:anywhere;text-align:center;flex-wrap:wrap}
  .dialog{max-height:calc(100dvh - 32px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior:contain}.dialog-close{width:44px;height:44px;right:12px;top:12px}.dialog input{font-size:16px}.toast{max-width:calc(100vw - 32px);white-space:normal;text-align:center;bottom:calc(20px + env(safe-area-inset-bottom,0px))}
}

@media (max-width:699px){
  .search-landing{grid-template-columns:minmax(0,1fr);grid-template-areas:"header" "weather" "center" "world" "bottom";padding:0 16px 16px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));gap:0}
  .search-landing>.topbar{min-height:68px;gap:8px}.brand-copy b{font-size:15px}.top-actions{gap:4px}
  .landing-weather{margin:0 0 12px;min-height:25px}
  .landing-center,body[data-theme="network"] .landing-center{padding-top:0}
  .landing-date{font-size:12px;gap:10px}.landing-center .clock-time{font-size:clamp(68px,20vw,84px);margin:10px 0 8px}
  .landing-greeting{font-size:15px}.landing-center h1{font-size:15px;line-height:1.65;margin:17px auto 14px;max-width:390px}
  .landing-center .search-box{height:56px}.search-button{padding-inline:14px}.search-box>input{padding-inline:9px}
  .landing-center .daily-quote{margin-top:13px;max-width:360px;font-size:12px}
  .world-stage{height:clamp(172px,49vw,216px);margin-top:4px;max-width:460px}
  .landing-bottom{margin-top:0;gap:10px}.world-controls{justify-content:space-between;gap:10px}.world-controls>span{font-size:11px}.world-controls>div{gap:6px}
  .theme-choice{height:60px}.theme-choice span{font-size:12px;letter-spacing:-.025em}.theme-choice svg{width:21px;height:21px}.theme-switcher{gap:9px}
  .collection-section{padding-top:26px}.collection-intro{padding:0 16px 16px;gap:13px}.collection-intro h2{font-size:21px}.collection-actions{width:100%;justify-content:space-between;gap:12px}
  .page-grid{padding-inline:16px;gap:16px}.main-content{gap:16px}.directory-panel{padding:17px 12px;border-radius:19px}.section-header{gap:10px}.section-title h2{font-size:18px}.section-title p{font-size:12px}
  .section-actions{gap:5px}.section-actions .text-button{width:44px;height:44px;font-size:0;padding:0;justify-content:center}.section-actions .text-button svg{width:18px;height:18px}
  .recommendation-note{padding:10px;margin:14px 0}.site-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.site-card{min-height:100px;gap:10px;padding:12px 4px}.site-card strong{font-size:12px}.site-logo{width:40px;height:40px}.site-logo img{width:26px;height:26px}
  .activity-panel{grid-template-columns:minmax(0,1fr);border-radius:19px}.recent-center{padding:16px;border-right:0;border-bottom:1px solid var(--theme-line)}.recent-center-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.activity-heading .plain-link{min-height:44px}
  .inspiration-panel{padding:16px}.inspiration-layout{grid-template-columns:minmax(100px,.85fr) minmax(0,1fr);min-height:142px}.orb-stage{height:140px;min-height:0}.inspiration-copy a,.inspiration-copy button{min-height:40px;display:inline-flex;align-items:center}
  .hot-panel{padding:17px 16px;border-radius:19px}.hot-list{display:block}.hot-tabs{margin-top:16px}.hot-tabs button{min-height:40px}.hot-update{margin-top:16px}
  .dialog{padding:22px 18px;border-radius:20px}.dialog-mark{margin-bottom:14px}.dialog h2{font-size:20px;padding-right:34px}.picker-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.picker-item{min-width:0}.picker-footer{margin:18px -18px -22px;padding:14px 18px;bottom:-22px}.picker-footer span{font-size:12px}.privacy-note{overflow-wrap:anywhere}
}

@media (max-width:359px){
  .brand-copy{display:none}.search-landing{padding-inline:12px}.search-button{padding-inline:12px}.search-box>input{padding-inline:7px}.engine-picker{flex-basis:59px}
  .theme-dock{grid-template-columns:repeat(3,minmax(0,1fr))}.theme-choice{height:48px;flex-direction:row;gap:5px}.theme-choice svg{width:18px;height:18px}.theme-choice span{font-size:12px}
  .inspiration-layout{grid-template-columns:90px minmax(0,1fr)}.recent-center-list{grid-template-columns:minmax(0,1fr)}.picker-grid{grid-template-columns:minmax(0,1fr)}
}

@media (prefers-reduced-motion:reduce){.left-rail{transition:none}}