/* Xfan photo archive refresh */
:root{
  --bg:#f2f5f1;
  --panel:#fff;
  --panel2:#f7f9f6;
  --pink:#d9653b;
  --cyan:#23865c;
  --purple:#507768;
  --green:#5fc68d;
  --gold:#d5aa4d;
  --text:#1b251f;
  --muted:#6d786f;
  --line:#dce3dd;
  --shadow:0 8px 24px rgba(27,51,38,.07);
}
body,
body[data-ui-theme]{
  color:var(--text);
  background:var(--bg);
}
.gallery-boot,
#visualDust,
.scanlines,
.ambient-orb,
.theme-button,
.theme-popover{display:none!important}
.gallery-topbar,
body[data-ui-theme] .gallery-topbar{
  height:70px;
  gap:16px;
  padding:0 20px;
  border-color:var(--line);
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(10px);
}
.gallery-brand{min-width:210px;gap:10px}
.gallery-brand>span{
  width:40px;
  height:40px;
  border:0;
  border-radius:6px;
  clip-path:none;
  background:#173a2b;
  color:#fff;
  text-shadow:none;
}
.gallery-brand strong{font-size:14px}
.gallery-brand small{color:var(--muted);font-size:9px}
.gallery-status{
  border-color:#d8e5dc;
  background:#f7faf7;
  color:var(--muted);
  font-size:11px;
}
.view-switch{
  height:40px;
  padding:3px;
  border-color:var(--line);
  background:#f2f5f1;
}
.view-switch button{
  height:32px;
  padding:0 12px;
  color:var(--muted);
  font-size:11px;
}
.view-switch button.active{
  color:#fff;
  background:#18794e;
}
.gallery-user{min-width:190px}
.gallery-user strong{font-size:11px}
.gallery-user small{color:var(--muted);font-size:8px}
.gallery-user>a{
  height:34px;
  display:grid;
  place-items:center;
  border-color:var(--line);
  background:#fff;
  color:#334139;
  font-size:11px;
}
.gallery-sidebar,
body[data-ui-theme] .gallery-sidebar{
  top:70px;
  width:230px;
  padding:18px 14px;
  border-color:rgba(255,255,255,.12);
  background:#173a2b;
  color:#eef7f1;
  backdrop-filter:none;
}
.archive-summary{
  padding:15px;
  border-color:rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(255,255,255,.06);
}
.archive-summary>span{color:#9fd5ad;font-size:9px}
.archive-summary>strong{font-size:30px}
.archive-summary>small,
.archive-summary p{color:#a9beb0;font-size:10px}
.archive-summary p b{color:#fff}
.gallery-search>label,
.filter-group>span{color:#a9beb0;font-size:10px}
.gallery-search>div{
  border-color:rgba(255,255,255,.15);
  background:rgba(255,255,255,.07);
}
.gallery-search input{color:#fff;font-size:12px}
.gallery-search button{color:#b8cbbf}
.filter-group>button{height:38px;color:#b8cbbf;font-size:11px}
.filter-group>button i{color:#8da899}
.filter-group>button b{color:#8da899;font-size:10px}
.filter-group>button:hover,
.filter-group>button.active{
  border-color:rgba(255,255,255,.12);
  color:#fff;
  background:rgba(255,255,255,.1);
}
.filter-group>button.active i{color:#9fd5ad}
.sidebar-actions button{
  min-height:46px;
  border-color:rgba(255,255,255,.1);
  background:rgba(255,255,255,.05);
  color:#c4d3c9;
}
.sidebar-actions button>span{border-color:rgba(255,255,255,.13);color:#9fd5ad}
.sidebar-actions strong{font-size:11px}
.sidebar-actions small{color:#8da899;font-size:9px}
.directory-tip{display:none}
.gallery-main{margin:70px 0 0 230px;padding:22px 24px 52px}
.gallery-hero{
  min-height:148px;
  padding:26px 30px;
  border-color:var(--line);
  border-radius:8px;
  background:#e9f1eb;
  box-shadow:none;
}
.gallery-hero:before,
.hero-lens{display:none}
.gallery-hero p{color:#18794e;font-size:10px;letter-spacing:0}
.gallery-hero h1{
  margin:9px 0 8px;
  color:#173a2b;
  font-size:34px;
}
.gallery-hero h1 em{color:#173a2b;background:none}
.gallery-hero>div>span{color:var(--muted);font-size:13px}
.mode-panel{margin-top:14px;animation:none}
.panel-heading{
  min-height:74px;
  padding:15px 18px;
  border-color:var(--line);
  border-radius:8px 8px 0 0;
  background:#fff;
}
.panel-heading span{color:#18794e;font-size:9px;letter-spacing:0}
.panel-heading h2{margin:6px 0 3px;font-size:18px}
.panel-heading p{color:var(--muted);font-size:11px}
.panel-heading>b{color:var(--muted);font-size:10px}
.masonry-grid{
  columns:4 250px;
  column-gap:12px;
  padding:12px;
  border-color:var(--line);
  border-radius:0 0 8px 8px;
  background:#fff;
}
.masonry-card{
  margin-bottom:12px;
  border-color:var(--line);
  border-radius:6px;
  background:#eef2ef;
  box-shadow:none;
  transform:none!important;
}
.masonry-card:hover{
  border-color:#a7bbae;
  box-shadow:0 10px 24px rgba(27,51,38,.12);
}
.masonry-card img{background:#eef2ef}
.masonry-card .shine{display:none}
.masonry-card figcaption{
  padding:42px 12px 11px;
  transform:none;
  background:linear-gradient(transparent,rgba(8,18,12,.88));
}
.masonry-card figcaption strong{font-size:12px}
.masonry-card figcaption small{color:#d4ded7;font-size:9px}
.masonry-card .card-tools{opacity:1;transform:none}
.masonry-card .card-tools button{
  border-color:rgba(255,255,255,.24);
  background:rgba(10,24,16,.7);
}
.orbit-stage{
  border-color:var(--line);
  border-radius:0;
  background:#102a20;
}
.orbit-card{border-radius:8px}
.orbit-caption{
  border-color:var(--line);
  border-radius:0 0 8px 8px;
  background:#fff;
}
.orbit-caption strong{color:var(--ink);font-size:12px}
.orbit-caption span{color:var(--muted);font-size:10px}
.cinema-space{
  border-radius:8px;
  border-color:#243a30;
  box-shadow:none;
}
.film-viewport{
  border-color:var(--line);
  border-radius:0 0 8px 8px;
  background:#18241d;
}
.empty-gallery{
  border-color:var(--line);
  border-radius:8px;
  background:#fff;
}
.empty-gallery p{color:var(--muted);font-size:12px}
.gallery-toast{
  border-color:#315d46;
  background:#173a2b;
  color:#fff;
  font-size:11px;
}
@media(max-width:900px){
  .gallery-user{display:none}
  .gallery-sidebar,
  body[data-ui-theme] .gallery-sidebar{
    position:relative;
    inset:auto;
    width:100%;
    margin-top:70px;
    padding:12px;
    transform:none;
    overflow:visible;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.12);
  }
  .archive-summary{display:none}
  .gallery-search{margin-top:0}
  .filter-group{
    display:flex;
    gap:6px;
    margin-top:10px;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .filter-group>span{display:none}
  .filter-group>button{
    min-width:max-content;
    flex:1;
    padding:0 9px;
  }
  .sidebar-actions{
    display:flex;
    gap:6px;
    margin-top:10px;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .filter-group::-webkit-scrollbar,
  .sidebar-actions::-webkit-scrollbar{display:none}
  .sidebar-actions button{
    min-width:132px;
    flex:1;
    min-height:42px;
  }
  .sidebar-actions button small{display:none}
  .gallery-main{margin:0;padding:16px 14px 44px}
}
@media(max-width:680px){
  .gallery-topbar,
  body[data-ui-theme] .gallery-topbar{
    height:64px;
    padding:0 10px;
  }
  .gallery-brand>span{width:38px;height:38px}
  .gallery-sidebar,
  body[data-ui-theme] .gallery-sidebar{margin-top:64px}
  .gallery-main{padding:12px 10px 34px}
  .gallery-hero{
    min-height:124px;
    padding:22px 20px;
  }
  .gallery-hero h1{font-size:29px}
  .gallery-hero>div>span{font-size:12px}
  .panel-heading{min-height:66px;padding:13px}
  .masonry-grid{padding:7px}
  .masonry-card{margin-bottom:8px}
  .orbit-stage{height:400px}
  .cinema-space{height:calc(100vh - 86px)}
  .gallery-toast{bottom:14px}
}
@media(max-width:430px){
  .gallery-brand{min-width:auto}
  .view-switch button{padding:0 8px}
  .sidebar-actions button{min-width:118px}
}
