/* Mobile companion to the desktop editorial design. */
.brand-caption,.mobile-bottom-nav{display:none}
.collection-directory{padding:38px 0 12px}.collection-directory h1{font-size:35px;margin:10px 0}.directory-lead{color:var(--muted);font-size:13px;margin:0 0 24px}
.directory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.directory-card{padding:20px;background:#fffef9;border:1px solid var(--line);border-radius:10px;display:flex;flex-direction:column;gap:10px}.directory-card:hover{border-color:var(--green)}.directory-card b{font-size:16px}.directory-card p{margin:0;color:var(--muted);font-size:12px;line-height:1.8}.directory-card small{margin-top:auto;color:var(--green);font-size:11px}
.directory-mode .hero,.directory-mode .topic-strip,.directory-mode .main-layout{display:none}
@media(max-width:720px){
  :root{--mobile-nav-height:64px}
  html{scroll-padding-top:142px}
  body{padding-bottom:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom,0px));font-size:14px}
  .wrap{padding-left:20px;padding-right:20px}
  .header{position:sticky;top:0;z-index:40;background:rgba(248,249,243,.97);backdrop-filter:blur(16px)}
  .header-inner{height:auto;min-height:124px;display:grid;grid-template-columns:minmax(0,1fr) 42px;grid-template-rows:64px 44px;gap:0 12px;padding-bottom:12px}
  .brand{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;gap:0 10px;justify-self:start;align-items:center}
  .brand .logo{width:34px;height:34px;grid-row:1/3;grid-column:1;border-radius:10px;font-size:23px}
  .brand b{font-size:20px;letter-spacing:2px;line-height:1.35;grid-column:2;grid-row:1}
  .brand-caption{display:block;grid-column:2;grid-row:2;font-size:9px;color:var(--muted);letter-spacing:1px;line-height:1.7}
  .header-end{display:contents}
  .menu-btn{display:grid;place-items:center;grid-column:2;grid-row:1;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;font-size:19px;justify-self:end}
  .header-search{grid-row:2;grid-column:1/-1;width:100%;height:44px;border-radius:10px;background:#eef1e7;gap:4px}
  .header-search input{width:0;flex:1;min-width:0;font-size:16px;padding:10px 13px;line-height:22px}
  .header-search input::placeholder{font-size:12px;color:#8b9184}
  .header-search button{height:44px;min-width:44px;font-size:26px;padding:0 12px}
  .nav.mobile{top:100%;left:12px;right:12px;width:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:12px;border:1px solid var(--line);background:#fffef9;border-radius:0 0 14px 14px;box-shadow:0 12px 28px #20262210}
  .nav.mobile button{padding:12px;font-size:13px;min-height:44px;text-align:left;border-radius:7px}
  .nav.mobile button.active{background:#edf2e6}.nav.mobile button.active:after{display:none}
  .hero{position:relative;display:block;padding-top:30px;padding-bottom:26px}
  .hero:before{content:'↗';position:absolute;top:32px;right:2px;width:50px;height:50px;display:grid;place-items:center;border:1px solid #dce2d0;border-radius:50%;color:#aab99a;font-size:29px;transform:rotate(-8deg)}
  .hero .eyebrow{font-size:8px;letter-spacing:1.5px;padding-right:48px}
  .hero h1{font-size:32px;line-height:1.4;letter-spacing:-1.2px;margin:17px 0 12px}
  .hero p{font-size:12px;line-height:1.9;margin:0 0 18px;color:#727b6c}
  .hero-actions{gap:8px}.hero-actions .primary,.hero-actions .secondary{padding:10px 13px;min-height:42px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;border-radius:7px}
  .hero-note,.hero-art{display:none}
  .topic-strip{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0 0 26px;padding:17px 0;border-color:#dde2d4}
  .topic-link{flex-direction:column;gap:8px;padding:0;text-align:center;min-width:0}
  .topic-icon{width:39px;height:39px;border-radius:12px;font-size:23px}
  .topic-link b{font-size:10px;font-weight:500;white-space:nowrap}.topic-link small{display:none}
  .section-head{margin-bottom:14px}.section-head h2,.latest-top h2{font-size:19px;letter-spacing:-.3px}.section-head small{font-size:8px;letter-spacing:1px}
  .featured{display:flex;flex-direction:column;gap:0;padding-bottom:24px}
  .featured .thumb{height:158px;min-height:158px;border-radius:11px}
  .featured .thumb-ai:before{width:190px;height:190px}.featured .node{height:53px;width:45px;border-radius:7px;font-size:20px}.featured .workflow{gap:12px}
  .featured>div:last-child{padding-top:15px!important}.featured h3{font-size:20px;line-height:1.55;margin:0 0 10px;letter-spacing:-.4px}
  .featured h3 br{display:none}.featured .collection-tags{margin:0 0 10px}.featured .desc{font-size:12px;line-height:1.9}.featured .meta{margin-top:12px;font-size:10px}
  .latest-top{margin:25px 0 0;gap:13px;align-items:stretch}
  .tabs{display:flex;gap:5px;padding-bottom:12px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line)}
  .tabs button{flex:0 0 auto;font-size:12px;padding:9px 13px;min-height:38px;background:#eef1e7;color:#78816e;border-radius:7px}
  .tabs button.active{background:var(--ink);color:#fff}
  .article-row{grid-template-columns:minmax(0,1fr) 86px;gap:13px;padding:21px 0;align-items:start}
  .article-row h3{font-size:16px;line-height:1.6;font-weight:700;margin:0 0 9px;letter-spacing:-.2px}
  .small-thumb{height:82px;border-radius:8px;margin-top:3px}.badge{display:none}
  .article-row .collection-tags{max-width:100%;flex-wrap:nowrap;overflow-x:auto;gap:5px;margin-bottom:9px}
  .collection-tag{padding:4px 7px;font-size:10px;line-height:1.6;min-height:26px;display:inline-flex;align-items:center}
  .article-row .meta{margin:0;font-size:10px;gap:8px;flex-wrap:wrap;line-height:1.6}
  .more{min-height:44px;font-size:12px;border-radius:8px;margin:22px auto 14px;padding:11px 24px}.feed-status{font-size:11px;margin-top:14px}
  .main-layout{gap:28px}
  .aside{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line);padding-top:24px}
  .aside-section{margin:0 0 24px}.aside-title{font-size:13px}.aside-sticky{display:contents}
  .editor-card{padding:19px}.editor-head b{font-size:13px}.editor-card p{font-size:12px}.text-link{font-size:12px;display:inline-block;padding:7px 0}
  .series-card{padding:20px}.series-card h3{font-size:21px}.series-card p{font-size:12px;margin-bottom:16px}.series-card a{font-size:12px;display:inline-block;padding:8px 0}
  .popular{padding:14px 0;gap:15px}.popular b{font-size:13px}.popular small{font-size:10px}.tags{gap:8px}.tags button{min-height:38px;font-size:12px;padding:7px 12px;border-radius:7px}
  footer{margin-top:16px;padding:24px 0 22px;gap:17px;align-items:flex-start}.footer-brand{font-size:17px}.footer-links{gap:20px;flex-wrap:wrap}.footer-links a{padding:7px 0;font-size:12px}footer>span:last-child{font-size:10px}
  .mobile-bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:50;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom,0px));padding:6px 12px calc(6px + env(safe-area-inset-bottom,0px));background:rgba(248,249,243,.98);backdrop-filter:blur(16px);border-top:1px solid #dfe4d6;box-shadow:0 -5px 24px #20262204}
  .mobile-bottom-nav button{border:0;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;line-height:1.3;color:#858d7d;border-radius:10px;min-height:48px;padding:4px}
  .mobile-bottom-nav svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
  .mobile-bottom-nav button.active{color:var(--green);font-weight:700;background:#eaf0e2}.mobile-bottom-nav button.active svg{stroke-width:1.9}
  .ai-hub{padding:26px 0 20px}.hub-top{margin-bottom:20px}.hub-top h1{font-size:28px;line-height:1.5}.hub-top p{font-size:12px;line-height:1.9}.hub-count{font-size:11px;margin-top:12px}
  .hub-controls{gap:6px}.hub-controls button{min-height:38px;font-size:11px;padding:7px 11px}.hub-controls input{font-size:16px;min-height:44px;padding:10px 12px;width:100%}.hub-controls input::placeholder{font-size:12px}
  .ai-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.ai-card{padding:15px 12px;min-height:192px;border-radius:11px}.ai-card-head{align-items:flex-start;flex-direction:column;gap:11px}.ai-card b{font-size:15px;line-height:1.4}.ai-card small{font-size:9px;display:block;margin-top:3px}.ai-mark{width:34px;height:34px}.ai-card p{font-size:11px;line-height:1.9;margin:12px 0}.ai-card-foot{font-size:9px;gap:5px}.ai-card:hover{transform:none}
  .hub-selection{font-size:12px;gap:8px;line-height:1.8}.hub-selection button{min-height:38px;font-size:11px}.hub-hint{font-size:10px;line-height:1.8}
  .collection-intro{padding:25px 0 24px;margin-bottom:22px}.collection-back{display:inline-flex;align-items:center;min-height:38px;font-size:12px}.collection-intro h1{font-size:29px;line-height:1.4;margin:12px 0}.collection-intro p{font-size:13px;line-height:1.9}.collection-count{font-size:12px}
  .collection-directory{padding:28px 0 14px}.collection-directory h1{font-size:29px;line-height:1.4}.directory-lead{font-size:12px;line-height:1.9}.directory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.directory-card{padding:16px 13px;gap:10px;border-radius:11px}.directory-card b{font-size:15px}.directory-card p{font-size:11px;line-height:1.8}.directory-card small{font-size:10px}
  .article-view{padding:0 22px;margin:25px auto 46px}.article-view .back{font-size:12px;min-height:40px}.crumb{font-size:11px;margin:17px 0}.article-view h1,.article-title{font-size:27px;line-height:1.55;letter-spacing:-.5px;margin:14px 0 17px}.article-view .lead{font-size:14px;line-height:1.9}.article-view .meta{font-size:10px;gap:7px 12px;flex-wrap:wrap;line-height:1.8}.article-visual{height:170px;margin:25px 0}.article-body{font-size:16px;line-height:2}.article-body h2{font-size:21px;line-height:1.6;margin:29px 0 13px}.article-body p{margin:16px 0}.toc{padding:15px;margin:25px 0;background:#edf1e6;border:1px solid var(--line);border-radius:9px}.toc b{font-size:12px}.toc a{font-size:12px;min-height:34px;padding:6px 0;margin:3px 0 0}.article-bottom{font-size:11px;line-height:1.9}.reader-controls{padding:0 22px;margin-bottom:35px}.reader-controls .more{width:100%}.reading-divider{font-size:11px}
  .toast{bottom:calc(82px + env(safe-area-inset-bottom,0px));font-size:12px;width:max-content;max-width:calc(100vw - 32px);padding:12px 18px}
}
@media(max-width:359px){.wrap{padding-left:16px;padding-right:16px}.hero h1{font-size:29px}.hero:before{width:42px;height:42px;right:0}.hero-actions .primary,.hero-actions .secondary{font-size:10px;padding:10px}.topic-link b{font-size:9px}.article-row{grid-template-columns:minmax(0,1fr) 74px;gap:11px}.small-thumb{height:74px}.article-row h3{font-size:15px}.ai-card b{font-size:13px}.collection-tag{font-size:9px}}
