/* Additive mobile layer: no rule is active at desktop widths (960px and up). */
@media screen and (max-width:959px) {
  html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
  body { min-width:0; }
  #top { height:auto; min-height:0; }
  #top .ttt { box-sizing:border-box; width:100%; max-width:none; padding:11px 18px; }
  #top .ttt h1 { display:none; }
  #top .ttt b { display:block; float:none; width:auto; font:600 11px/1.7 Arial,Helvetica,sans-serif; color:#b5c3e0; }
  body #page { box-sizing:border-box; width:calc(100% - 24px); max-width:none; background:none; }
  #header { display:flex; flex-wrap:wrap; box-sizing:border-box; width:100%; height:auto; padding:0; margin:0 0 18px; position:relative; }
  #header>.clr { display:none; }
  #header .logo { box-sizing:border-box; flex:0 0 100%; width:100%; height:99px; margin:0; padding:19px 18px; position:relative; background:#edf0eb!important; border-radius:4px 4px 0 0; }
  #header .logo::before { content:"MAGICS Lab"; display:block; color:#23363f; font:700 30px/1.1 Arial,Helvetica,sans-serif; letter-spacing:-1px; }
  #header .logo::after { content:"Scientific intelligence · Northwestern"; display:block; margin-top:8px; color:#52696e; font:11px/1.4 Arial,Helvetica,sans-serif; }
  #header .logo h1 { position:absolute; inset:0; height:100%; margin:0; padding:0; font-size:0; }
  #header .logo h1 a { display:block; height:100%; }
  #header .logo h1 small { display:none; }
  #header .logo a:focus-visible { outline:2px solid #794557; outline-offset:-4px; }
  #header .mobile-nav-toggle { box-sizing:border-box; display:flex; align-items:center; justify-content:space-between; gap:16px; flex:0 0 100%; width:100%; min-height:48px; margin:0; padding:12px 18px; border-top:1px solid #cad3cc; border-radius:0; background:#e3e8e1; color:#22343c; font:700 14px/1.5 Arial,Helvetica,sans-serif; cursor:pointer; }
  #header .mobile-nav-toggle>span { margin:0; }
  #header .mobile-nav-icon { width:20px; height:14px; margin:0; background:linear-gradient(#40565b,#40565b) 0 0/20px 2px no-repeat,linear-gradient(#40565b,#40565b) 0 6px/20px 2px no-repeat,linear-gradient(#40565b,#40565b) 0 12px/20px 2px no-repeat; }
  #header .mobile-nav-toggle[aria-expanded="true"] .mobile-nav-icon { background:linear-gradient(45deg,transparent 46%,#40565b 47%,#40565b 53%,transparent 54%),linear-gradient(-45deg,transparent 46%,#40565b 47%,#40565b 53%,transparent 54%); height:20px; }
  #header .topnav { box-sizing:border-box; float:none; width:100%; height:auto; margin:0; padding:0; background:#f4f5f0; }
  #header.mobile-enhanced .topnav { display:none; }
  #header.mobile-enhanced.mobile-menu-open .topnav { display:block; }
  #header .topnav ul.menusm { float:none; width:100%; height:auto; margin:0; padding:0; }
  #header .topnav ul.menusm>li { box-sizing:border-box; float:none; width:100%; padding:0; margin:0; border-top:1px solid #d8dfd7; }
  #header .topnav ul.menusm>li>a { box-sizing:border-box; display:flex; align-items:center; float:none; min-height:46px; width:100%; margin:0; padding:12px 62px 12px 18px; border:0; background:none; color:#34484e; font:700 14px/1.5 Arial,Helvetica,sans-serif; }
  #header .topnav ul.menusm>li.current_page_item>a { color:#794557; background:#e9e5e3; box-shadow:inset 3px 0 #794557; }
  #header .mobile-submenu-toggle { box-sizing:border-box; position:absolute; top:0; right:0; display:flex; align-items:center; justify-content:center; width:48px; min-height:46px; margin:0; padding:0; border-left:1px solid #d8dfd7; border-radius:0; color:#40565b; background:transparent; font:400 22px/1 Arial,Helvetica,sans-serif; cursor:pointer; z-index:1003; }
  #header .topnav .menusm>li>ul { display:none!important; box-sizing:border-box; position:static; float:none; width:100%; height:auto!important; padding:4px 0 7px; margin:0; overflow:visible!important; background:#fff; border-radius:0!important; }
  #header .topnav .menusm>li.mobile-submenu-open>ul { display:block!important; }
  #header:not(.mobile-enhanced) .topnav .menusm>li>ul { display:block!important; }
  #header .topnav ul li ul li { float:none; width:100%; padding:0; margin:0; background:none; }
  #header .topnav ul li ul li a { box-sizing:border-box; display:flex; align-items:center; float:none; width:100%; min-height:44px; padding:10px 24px 10px 30px; border:0; background:none; font:400 13px/1.65 Arial,Helvetica,sans-serif; color:#53696b; }
  #header button:focus-visible,#header .topnav a:focus-visible { outline:2px solid #794557; outline-offset:-4px; }
  #header .search { box-sizing:border-box; float:none; width:100%; margin:0; padding:12px 0 0; order:4; }
  #header #searchform,#header #search { width:100%; min-width:0; margin:0; padding:0; }
  #header #search span { display:flex; width:100%; height:46px; box-sizing:border-box; margin:0; border:1px solid #b4c2bd; border-radius:4px; overflow:hidden; background:#f6f7f2; }
  #header #search input#s { box-sizing:border-box; float:none; flex:1; min-width:0; width:calc(100% - 46px); height:44px; margin:0; padding:10px 12px; color:#263b42; font:16px/24px Arial,Helvetica,sans-serif; background:none; }
  #header #search .btn { box-sizing:border-box; flex:none; float:none; width:46px; height:44px; margin:0; padding:8px 5px; object-fit:contain; border-left:1px solid #cbd4ca; border-radius:0; background:#e5ebe3; }
  #header #search:focus-within span { outline:2px solid #997482; outline-offset:2px; }
  #header .software-search-status { box-sizing:border-box; position:static; order:5; width:100%; max-width:none; margin:10px 0 0; font-size:13px; }
  body #columns,body #page.index #columns { box-sizing:border-box; float:none; width:100%; max-width:none; margin:0; padding:0 0 22px; background:none; }
  body.publications-page #columns,body.software-page #columns { width:calc(100% - 24px); margin:0 auto; }
  #centercol { box-sizing:border-box; float:none; width:100%; padding:0 0 25px; background:none; }
  #centercol .centercol-bg { width:100%; box-sizing:border-box; border-radius:5px; }
  #rightcol { box-sizing:border-box; clear:both; float:none; width:100%; max-width:520px; margin:12px auto 0; padding:0; }
  #rightcol .box_r { width:100%; box-sizing:border-box; margin:0 0 30px; }
  #rightcol .wtitle h2 { padding:12px 0 16px; font-size:21px; line-height:1.35; }
  #rightcol .ads>.content { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-width:360px; margin:0 auto; }
  #rightcol .ads>.content>a { display:block; margin:0; background:#fff; border-radius:4px; overflow:hidden; }
  #rightcol .ads>.content>a>img { display:block; width:100%; height:auto; margin:0; }
  #rightcol .ads>.content>.small_link { grid-column:1/-1; }
  #rightcol .small_link a { display:inline-block; padding:10px 4px; font-size:12px; line-height:1.7; overflow-wrap:anywhere; }
  #rightcol .list { display:flex; height:auto; width:100%; }
  #rightcol .list li { flex:1; float:none; min-width:0; padding:0; }
  #rightcol .list li a,#rightcol .list li a:hover,#rightcol .list li a.active { box-sizing:border-box; display:flex; align-items:center; justify-content:center; float:none; min-height:46px; width:100%; margin:0; padding:10px 5px; font-size:13px; line-height:1.6; }
  #rightcol .tabs_list ul { padding:8px 6px; }
  #rightcol .tabs_list li a { box-sizing:border-box; min-height:44px; padding-top:10px; padding-bottom:10px; font-size:13px; line-height:1.65; overflow-wrap:anywhere; }
  #rightcol .sf-menu ul.children { position:static!important; display:block!important; opacity:1!important; height:auto!important; width:100%; padding:0; }
  #rightcol .banner { text-align:center; }
  #rightcol .banner a { display:inline-block; }
  #rightcol .banner img { display:block; max-width:100%; height:auto; margin:0 auto; }
  body .footer2_resize { box-sizing:border-box; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 22px; width:calc(100% - 24px); max-width:none; margin:0 auto; padding:24px 8px 30px; background:none; }
  /* Match the publications/software footer and override legacy fixed column widths. */
  body .footer2 .footer2_resize>div { box-sizing:border-box; float:none; width:auto; min-width:0; margin:0; padding:0; }
  body .footer2_resize>.clr { display:none; }
  body .footer2 h2 { font-size:16px; line-height:1.35; padding:0 0 15px; }
  body .footer2 p,body .footer2 li,body .footer2 a { font-size:13px; line-height:1.8; color:#a8becb; overflow-wrap:anywhere; }
  body .footer2 ul li a { padding:10px 0; min-height:44px; box-sizing:border-box; }
  body #footer { box-sizing:border-box; height:auto; min-height:88px; margin:0 12px; background:none; border-top:1px solid #344956; }
  body #footer .textf { box-sizing:border-box; display:flex; flex-wrap:wrap; gap:8px 24px; width:100%; max-width:none; margin:0; padding:18px 8px 25px; }
  body #footer .text1,body #footer .text2 { float:none; margin:0; font-size:12px; line-height:1.8; }
  body #footer a { display:inline-block; color:#a8becb; }
}
