/* Terry.ism v24 — orientation-aware mobile frame browser and restored archive */

.mobile-frame-studio{display:none}

@media (max-width:900px){
  body.has-media .media-column{display:none!important}
  body.has-media .app-main,
  body.has-media.is-media-portrait .app-main,
  body.has-media.is-media-landscape .app-main{
    display:block!important;
    width:calc(100% - 18px)!important;
    max-width:760px!important;
    margin:10px auto 22px!important;
  }
  body.has-media .editor-card{
    width:100%!important;
    max-width:none!important;
    overflow:visible!important;
    border:1px solid rgba(31,37,45,.13)!important;
    border-radius:18px!important;
    box-shadow:0 18px 48px rgba(14,18,24,.09)!important;
  }
  body.has-media .sidebar-file-bar{
    display:flex!important;
    min-height:42px!important;
    padding:7px 10px!important;
    border-bottom:1px solid #e8eaed!important;
    background:#fbfbfa!important;
  }
  body.has-media .sidebar-file-name{font-size:12px!important}
  body.has-media .sidebar-file-btn{min-height:32px!important;font-size:12px!important}

  .mobile-frame-studio{
    display:grid;
    gap:9px;
    margin:9px;
    padding:9px;
    border:1px solid #e1e4e7;
    border-radius:15px;
    background:#f4f5f5;
  }
  .editor-live-preview{
    position:relative!important;
    top:auto!important;
    z-index:1!important;
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:8px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.1)!important;
    border-radius:11px!important;
    background:radial-gradient(circle at 50% 38%,#2c3239,#11151a 72%)!important;
    box-shadow:inset 0 0 0 1px rgba(0,0,0,.24)!important;
  }
  .editor-live-preview canvas{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    border-radius:5px!important;
    background:#fff!important;
    box-shadow:0 10px 30px rgba(0,0,0,.32)!important;
  }
  .editor-live-preview>span{
    position:absolute!important;
    left:8px!important;
    bottom:8px!important;
    display:block!important;
    width:auto!important;
    max-width:calc(100% - 16px)!important;
    padding:5px 8px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:999px!important;
    background:rgba(8,11,15,.68)!important;
    color:#fff!important;
    backdrop-filter:blur(10px)!important;
  }
  .editor-live-preview b{font-size:11px!important;line-height:1!important;letter-spacing:-.01em!important}
  .editor-live-preview small{display:none!important}

  .mobile-frame-browser{
    display:flex;
    min-width:0;
    min-height:0;
    flex-direction:column;
    overflow:hidden;
    border:1px solid #dfe2e5;
    border-radius:11px;
    background:#fff;
  }
  .mobile-frame-browser-head{
    display:flex;
    flex:0 0 auto;
    align-items:center;
    justify-content:space-between;
    min-height:32px;
    padding:6px 8px;
    border-bottom:1px solid #eceeef;
  }
  .mobile-frame-browser-head b{font-size:12px;letter-spacing:-.02em;color:#20252c}
  .mobile-frame-browser-head span{font-size:11px;font-weight:750;color:#8a919a}
  .mobile-preset-rail{
    min-width:0;
    min-height:0;
    scrollbar-width:thin;
    scrollbar-color:#aeb4bb transparent;
    overscroll-behavior:contain;
  }
  .mobile-preset-rail::-webkit-scrollbar{width:5px;height:5px}
  .mobile-preset-rail::-webkit-scrollbar-thumb{border-radius:99px;background:#aeb4bb}
  .mobile-preset-option{
    position:relative;
    display:grid;
    min-width:0;
    gap:5px;
    padding:5px;
    border:1px solid #e1e4e7;
    border-radius:9px;
    background:#fff;
    color:#181c22;
    text-align:left;
    scroll-snap-align:start;
    cursor:pointer;
  }
  .mobile-preset-option.active{
    border-color:#171c23;
    box-shadow:inset 0 0 0 1px #171c23;
  }
  .mobile-preset-option.active::after{
    content:"";
    position:absolute;
    top:8px;
    right:8px;
    width:7px;
    height:7px;
    border:2px solid #fff;
    border-radius:50%;
    background:#f28a25;
    box-shadow:0 1px 5px rgba(0,0,0,.25);
  }
  .mobile-preset-thumb{
    display:grid;
    height:76px;
    place-items:center;
    overflow:hidden;
    border-radius:6px;
    background:#f0f1f2;
  }
  .mobile-preset-thumb canvas{display:block;width:auto;height:auto;max-width:100%;max-height:100%}
  .mobile-preset-copy{display:flex;min-width:0;align-items:center;justify-content:space-between;gap:4px}
  .mobile-preset-copy b{min-width:0;overflow:hidden;font-size:11px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
  .mobile-preset-copy small{flex:0 0 auto;font-size:9px;font-weight:750;color:#858c95;white-space:nowrap}

  body.is-media-portrait .mobile-frame-studio{
    grid-template-columns:minmax(0,1fr) 126px;
    height:clamp(288px,46dvh,380px);
  }
  body.is-media-portrait .mobile-preset-rail{
    display:flex;
    flex:1 1 auto;
    flex-direction:column;
    gap:7px;
    padding:7px;
    overflow-x:hidden;
    overflow-y:auto;
    scroll-snap-type:y proximity;
  }
  body.is-media-portrait .mobile-preset-option{flex:0 0 auto;width:100%}
  body.is-media-portrait .mobile-preset-copy small{display:none}

  body.is-media-landscape .mobile-frame-studio{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:clamp(188px,52vw,292px) auto;
    height:auto;
  }
  body.is-media-landscape .mobile-frame-browser{min-height:126px}
  body.is-media-landscape .mobile-frame-browser-head{min-height:29px;padding:5px 8px}
  body.is-media-landscape .mobile-preset-rail{
    display:flex;
    gap:7px;
    padding:7px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x proximity;
  }
  body.is-media-landscape .mobile-preset-option{flex:0 0 112px}

  body.has-media .editor-panel[data-panel="frame"]>.section-heading,
  body.has-media .editor-panel[data-panel="frame"]>.preset-grid{display:none!important}
  body.has-media .drawer-toggle-pill{margin-top:4px!important}
}

@media (max-width:360px){
  body.is-media-portrait .mobile-frame-studio{grid-template-columns:minmax(0,1fr) 112px;gap:7px;padding:7px}
  .mobile-preset-copy b{font-size:10px}
  .mobile-preset-copy small{font-size:8px}
  .mobile-preset-thumb{height:68px}
}

/* Restore the public visual archive and useful, visible search content. */
body:not(.has-media) .instagram-hub,
body:not(.has-media) .camera-seo-showcase{display:block!important}
body.has-media .instagram-hub,
body.has-media .camera-seo-showcase{display:none!important}

body:not(.has-media) .instagram-hub,
body:not(.has-media) .camera-seo-showcase{
  width:min(960px,calc(100% - 32px))!important;
  margin:20px auto 0!important;
  backdrop-filter:blur(22px) saturate(1.05);
}
body:not(.has-media) .instagram-hub{
  padding:24px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:20px!important;
  background:rgba(15,19,25,.83)!important;
  box-shadow:0 24px 70px rgba(6,9,13,.28)!important;
}
body:not(.has-media) .reels-heading-v110 h2{font-size:28px!important}
body:not(.has-media) .reels-subcopy{font-size:14px!important;line-height:1.5!important}
body:not(.has-media) .archive-instagram-link{min-height:38px!important;font-size:12px!important}
body:not(.has-media) .reels-status{font-size:12px!important}
body:not(.has-media) .instagram-reels-grid{gap:12px!important}
body:not(.has-media) .reel-poster-fallback{display:block!important;background:#101319!important}
body:not(.has-media) .reel-poster-fallback img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  opacity:1!important;
  filter:none!important;
}
body:not(.has-media) .reel-poster-fallback strong{display:none!important}
body:not(.has-media) .instagram-feed-note{font-size:12px!important}
body:not(.has-media) .exhibition-note{padding:20px!important;border-radius:16px!important}
body:not(.has-media) .exhibition-note h3{font-size:20px!important}
body:not(.has-media) .exhibition-note p{font-size:14px!important;line-height:1.55!important}

body:not(.has-media) .camera-seo-showcase{
  padding:27px!important;
  border:1px solid rgba(255,255,255,.5)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.82)!important;
  box-shadow:0 24px 70px rgba(6,9,13,.2)!important;
}
body:not(.has-media) .camera-seo-header{max-width:720px!important;margin-bottom:20px!important}
body:not(.has-media) .camera-seo-header h2{font-size:25px!important;line-height:1.2!important}
body:not(.has-media) .camera-seo-header p{font-size:15px!important;line-height:1.65!important}
body:not(.has-media) .camera-seo-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
body:not(.has-media) .camera-card{padding:17px!important;border-color:#e1e4e7!important;background:rgba(255,255,255,.7)!important}
body:not(.has-media) .camera-card-tag{font-size:10px!important}
body:not(.has-media) .camera-card h3{font-size:15px!important;line-height:1.4!important}
body:not(.has-media) .camera-card p{
  display:-webkit-box;
  overflow:hidden;
  font-size:13px!important;
  line-height:1.55!important;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
}
body:not(.has-media) .camera-card-features span{font-size:11px!important}
body:not(.has-media) .app-footer{width:min(960px,calc(100% - 32px))!important}

@media (max-width:720px){
  body:not(.has-media) .instagram-hub,
  body:not(.has-media) .camera-seo-showcase{width:calc(100% - 20px)!important;margin-top:14px!important}
  body:not(.has-media) .instagram-hub{padding:17px!important;border-radius:17px!important}
  body:not(.has-media) .reels-heading-v110{display:grid!important;grid-template-columns:1fr!important}
  body:not(.has-media) .reels-heading-v110 h2{font-size:23px!important}
  body:not(.has-media) .reels-subcopy{font-size:13px!important}
  body:not(.has-media) .archive-heading-actions{justify-content:flex-start!important}
  body:not(.has-media) .instagram-reels-grid{
    display:flex!important;
    gap:9px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x proximity;
  }
  body:not(.has-media) .reel-card{flex:0 0 min(62vw,220px)!important;scroll-snap-align:start}
  body:not(.has-media) .exhibition-note{display:block!important;padding:17px!important}
  body:not(.has-media) .exhibition-kicker{display:block!important;max-width:none!important;padding:0 0 9px!important;border:0!important}
  body:not(.has-media) .exhibition-note h3{font-size:18px!important}
  body:not(.has-media) .exhibition-note p{font-size:13px!important}

  body:not(.has-media) .camera-seo-showcase{padding:20px 17px!important;border-radius:17px!important}
  body:not(.has-media) .camera-seo-header h2{font-size:21px!important}
  body:not(.has-media) .camera-seo-header p{font-size:14px!important}
  body:not(.has-media) .camera-seo-cards{
    display:flex!important;
    gap:10px!important;
    overflow-x:auto!important;
    scroll-snap-type:x proximity;
    padding-bottom:4px!important;
  }
  body:not(.has-media) .camera-card{flex:0 0 min(80vw,290px)!important;scroll-snap-align:start}
  body:not(.has-media) .camera-card h3{font-size:14px!important}
  body:not(.has-media) .camera-card p{font-size:13px!important}
  body:not(.has-media) .app-footer{width:calc(100% - 20px)!important}
}
