/* Shared phone layout for Market, information pages, and Studio. */
.world-bottom-controls{display:contents}
.mobile-legal-menu{display:none}

@media(min-width:761px) and (max-width:1030px){
  header:has(.secondary-nav){height:auto;min-height:0;padding:10px 16px!important;flex-wrap:wrap;gap:8px!important}
  header:has(.secondary-nav) .brand{order:0;margin-right:auto;flex:none}
  header:has(.secondary-nav) .brc-header-badge.visible{order:1;flex:none;margin:0}
  header:has(.secondary-nav) [data-account-link]{order:2;flex:none;margin-left:0!important}
  header:has(.secondary-nav) .secondary-nav{order:3;flex:none;width:100%;max-width:100%;height:38px;overflow-x:auto}
  header:has(.secondary-nav) .secondary-nav-link{min-height:38px}
  header:has(.secondary-nav) .secondary-search{order:4;flex:auto;width:100%;max-width:none;min-width:0;margin:0}
  .studio-workspace,#studio-main,.studio-sidebar{min-width:0;max-width:100%}
}

@media(max-width:760px){
  html,body,#root,.app{max-width:100%;min-width:0}
  body{overflow-x:hidden}
  img,video,iframe{max-width:100%}
  .topbar{--header-height:104px;position:sticky;top:0;z-index:100;height:auto;min-height:104px;padding:8px 12px;grid-template-columns:40px minmax(0,1fr) auto;grid-template-rows:40px 40px;gap:8px}
  .topbar .brand-button{min-width:0;overflow:hidden}
  .topbar .brand-button .logo{min-width:0;white-space:nowrap}
  .topbar .brand-button .logo .logo-name{overflow:hidden;text-overflow:ellipsis;font-size:15px}
  .topbar .header-actions{min-width:0}
  .topbar .header-search,.topbar .header-search:focus-within{grid-area:2/1/3/-1;position:relative;left:auto;right:auto;min-width:0;width:100%;height:40px;margin:0;padding:0 12px;background:#292925;border:1px solid #3b3b36;border-radius:11px}
  .topbar .header-search input,.topbar .header-search:focus-within input{display:block;min-width:0;width:100%;font-size:12px}
  .topbar .header-search input::placeholder{font-size:12px}
  .topbar .brc-header-badge.visible{position:absolute;top:58px;right:12px;z-index:1;max-width:42px;min-width:0;height:36px;padding:4px 5px;margin:0}
  .topbar .brc-header-badge .brc-unit{display:none}
  .topbar:has(.brc-header-badge.visible) .header-search{width:calc(100% - 48px)}
  .mobile-drawer-backdrop{top:104px;bottom:0}
  .mobile-drawer{top:104px;bottom:0;height:calc(100dvh - 104px);max-height:none}
  .filterbar{height:54px;min-height:54px;padding:7px 12px;gap:7px}
  .filter-scroll{min-width:0;flex:1}
  .filter-context{min-width:0;flex:0 1 auto;padding:0 8px;gap:5px}
  .filter-context strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .world{height:calc(100dvh - 158px);min-height:400px}
  .world-bottom-controls{z-index:46;position:absolute;left:12px;right:12px;bottom:max(14px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:5px;pointer-events:none}
  .world-bottom-controls>*{pointer-events:auto}
  .world-bottom-controls .world-tools,.world-bottom-controls .surprise,.world-bottom-controls .mobile-legal-menu{position:static;bottom:auto;left:auto;right:auto;transform:none;flex:none}
  .world-bottom-controls .world-tools{height:40px;min-width:0}
  .world-bottom-controls .world-tools button{width:34px}
  .world-bottom-controls .world-tools span{width:38px}
  .world-bottom-controls .surprise{min-height:40px;padding:9px 11px;white-space:nowrap;font-size:11px}
  .keep-exploring{bottom:72px;min-height:39px;padding:8px 14px;font-size:12px}
  .mobile-legal-menu{display:block;position:relative!important;z-index:1}
  .mobile-legal-menu summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:center;gap:5px;min-height:40px;padding:0 10px;border:1px solid #d7d3c9;border-radius:11px;background:#fff;color:#302e29;font-size:11px;font-weight:700;white-space:nowrap;box-shadow:0 5px 20px #17171418}
  .mobile-legal-menu summary::-webkit-details-marker{display:none}
  .mobile-legal-menu summary:after{content:'⌄';font-size:13px;line-height:1}
  .mobile-legal-menu[open] summary:after{content:'⌃'}
  .mobile-legal-menu summary:focus-visible{outline:2px solid #6c51f4;outline-offset:2px}
  .mobile-legal-menu nav{position:absolute;right:0;bottom:calc(100% + 8px);display:grid;min-width:185px;max-width:calc(100vw - 24px);padding:7px;border:1px solid #dcd8ce;border-radius:14px;background:#fff;box-shadow:0 14px 35px #1717142b}
  .mobile-legal-menu nav a{display:block;padding:11px 12px;border-radius:8px;color:#302e29;text-decoration:none;font-size:12px;white-space:nowrap}
  .mobile-legal-menu nav a:hover,.mobile-legal-menu nav a:focus-visible{background:#f2f0ea}
  .explore-links{display:none!important}
  .page-shell,.dashboard-shell,.creator-shell,.account-shell,.admin-shell{height:auto;min-height:calc(100dvh - 104px);max-width:100%;overflow:visible}
  .page-shell,.creator-shell,.creator-profile-page,.creator-search-page{padding:24px 16px 72px}
  .page-heading,.creator-hero,.creator-assets-head{align-items:flex-start;flex-wrap:wrap;gap:12px}
  .page-heading h1,.creator-hero h1{font-size:clamp(29px,9vw,42px);letter-spacing:-.06em}
  .account-shell,.admin-shell{display:grid;grid-template-columns:minmax(0,1fr)}
  .account-nav,.admin-shell>aside{display:block;min-width:0;width:100%;padding:8px 12px;overflow:hidden}
  .account-nav nav,.admin-shell aside nav{display:flex;gap:6px;margin:0;overflow-x:auto;scrollbar-width:none;white-space:nowrap;scroll-snap-type:x proximity}
  .account-nav nav::-webkit-scrollbar,.admin-shell aside nav::-webkit-scrollbar{display:none}
  .account-nav nav>* ,.admin-shell aside nav>*{scroll-snap-align:start}
  .account-nav:after,.admin-shell>aside:after{content:'Swipe for more →';display:block;margin:6px 4px 0;color:#8b887e;font-size:10px;text-align:right}
  .account-nav nav button,.admin-shell aside nav a,.admin-shell aside nav button{flex:none;min-height:40px;padding:8px 11px;border-radius:9px;white-space:nowrap}
  .admin-shell aside nav a{color:#ddd;text-decoration:none;display:inline-flex;align-items:center;font-size:11px}
  .admin-shell aside nav a:hover,.admin-shell aside nav a:focus-visible{background:#30302b;color:#fff}
  .admin-brand,.account-nav>.studio-shortcut,.account-nav>.role-pill{display:none}
  .account-content,.admin-content,.dashboard-content{min-width:0;padding:24px 16px 70px;overflow:visible}
  .account-content>header,.admin-content>header{flex-wrap:wrap;gap:12px}
  .account-content>header h1,.admin-content h1{font-size:clamp(26px,8vw,34px);line-height:1.12;overflow-wrap:anywhere}
  .account-grid,.admin-stats,.saved-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .account-grid article,.admin-stats>div,.review-list article,.creator-stats>div{min-width:0}
  .account-welcome{padding:22px;min-height:0}
  .quick-stats{flex-wrap:wrap;gap:14px}
  .creator-tabs{max-width:100%;overflow-x:auto;white-space:nowrap}
  .creator-tabs button{flex:none}
  .creator-products .product-table article>b:before{content:'Access'}
  .product-table,.download-library,.admin-content .table-wrap{max-width:100%;overflow-x:auto}
  .review-list article{align-items:flex-start}
  .review-main{min-width:0;overflow-wrap:anywhere}
  .modal-overlay,.panel-overlay{padding:10px}
  .publish-modal,.save-modal,.checkout-modal,.detail-stage{max-width:100%;max-height:calc(100dvh - 20px);overflow-y:auto}
  .detail-stage,.asset-page .detail-stage{width:100%}
  .detail-info-scroll{padding:20px 16px}
  .form-row,.download-controls{flex-wrap:wrap}
  input,select,textarea{max-width:100%}
  header:has(.secondary-nav){height:auto;min-height:0;padding:10px 14px!important;gap:8px!important}
  header:has(.secondary-nav) .brand{max-width:calc(100% - 120px);overflow:hidden;text-overflow:ellipsis}
  header:has(.secondary-nav) .brand{order:0;margin-right:auto;flex:none}
  header:has(.secondary-nav) .brc-header-badge.visible{order:1;flex:none;margin:0}
  header:has(.secondary-nav) [data-account-link]{order:2;flex:none;margin-left:0!important}
  header:has(.secondary-nav) [data-account-link].secondary-account-branded{width:36px;height:36px;min-width:36px;padding:0!important;justify-content:center;overflow:hidden}
  header:has(.secondary-nav) [data-account-link] .account-profile{width:32px;height:32px;min-width:32px;margin:0;display:block}
  header:has(.secondary-nav) [data-account-link] .account-profile>span:not(.account-avatar){display:none}
  header:has(.secondary-nav) [data-account-link] .account-avatar{width:32px;height:32px;min-width:32px;display:grid;place-items:center}
  header:has(.secondary-nav) [data-account-link] .account-chevron{display:none}
  header:has(.secondary-nav) .secondary-nav{order:3}
  header:has(.secondary-nav) .secondary-nav{max-width:100%;width:100%;overflow-x:auto;flex:none}
  header:has(.secondary-nav) .secondary-search{order:4;width:100%;max-width:none;min-width:0;flex:auto;margin:0}
  header:has(.secondary-nav) [data-account-link]{margin-left:0!important}
  .site-footer,footer:has(.footer-links){flex-direction:column;gap:18px;padding:28px 18px}
  .footer-links{justify-content:flex-start;max-width:100%}
  .footer-links a{min-height:36px;display:inline-flex;align-items:center}
  main>article,article{max-width:100%;overflow-wrap:anywhere}
  .studio-shell,.studio-workspace,#studio-main{min-width:0;max-width:100%}
  .studio-topbar{height:auto;min-height:0;flex-wrap:wrap;padding:10px 13px;gap:8px}
  .studio-topbar .brand{max-width:calc(100% - 108px);overflow:hidden;text-overflow:ellipsis}
  .studio-sidebar{min-width:0;max-width:100%;padding:8px 12px}
  .studio-sidebar nav{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
  .studio-sidebar nav button{min-height:42px}
  .sidebar-bottom{padding:8px 0 0}
  #studio-main{padding:23px 13px 64px;overflow-x:hidden}
  .content-wrap,.panel,.form-card,.result-card,.image-tool-layout,.image-result-zone{min-width:0;max-width:100%}
  .studio-workspace .page-head{flex-wrap:wrap;align-items:flex-start}
  .studio-workspace .page-actions,.studio-workspace .result-actions,.studio-workspace .detail-actions{width:100%;flex-wrap:wrap}
  .studio-workspace .toolbar{max-width:100%;overflow-x:auto}
  .studio-workspace .toolbar .search{min-width:0;width:100%}
  .studio-workspace .form-layout,.studio-workspace .detail-layout,.image-tool-layout{grid-template-columns:minmax(0,1fr)}
  .studio-workspace .hero-panel{grid-template-columns:minmax(0,1fr)}
  .studio-workspace .file-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .studio-workspace .file-card,.studio-workspace .file-info,.studio-workspace .file-thumb{min-width:0}
  .studio-workspace .file-info strong{overflow:hidden;text-overflow:ellipsis}
  #studio-dialog{width:calc(100vw - 20px);max-width:calc(100vw - 20px);padding:18px;max-height:calc(100dvh - 20px);overflow-y:auto}
}

@media(max-width:390px){
  header:has(.secondary-nav) .brand{font-size:15px!important;gap:6px!important;margin-right:auto;max-width:none}
  header:has(.secondary-nav):not(.studio-topbar) .brand>span,header.studio-topbar .brand .brand-light{display:none}
  .world-bottom-controls{left:8px;right:8px;gap:3px}
  .world-bottom-controls .world-tools{height:38px}
  .world-bottom-controls .world-tools button{width:29px;min-width:29px;height:38px}
  .world-bottom-controls .world-tools span{width:31px;min-width:31px;font-size:10px}
  .world-bottom-controls .surprise{min-height:38px;padding:7px 8px;font-size:10px;gap:4px}
  .world-bottom-controls .surprise svg{width:14px;height:14px}
  .mobile-legal-menu summary{min-height:38px;padding:0 7px;font-size:10px}
  .account-grid,.admin-stats{gap:8px}
}

@media(max-width:340px){
  .world-bottom-controls .surprise svg{display:none}
  .world-bottom-controls .world-tools button{width:27px;min-width:27px}
  .world-bottom-controls .world-tools span{width:29px;min-width:29px}
  .mobile-legal-menu summary{padding:0 5px}
}
