/* Location galleries + scout boards. Uses the color and type tokens from index.html. */

/* card: open-gallery hit area and photo count */
.open-gal{position:absolute;inset:0;z-index:2;border:0;background:transparent;cursor:zoom-in;padding:0}
.open-gal .count{position:absolute;right:8px;bottom:8px;display:inline-flex;align-items:center;gap:6px;background:rgba(13,22,38,.86);color:var(--paper);font:700 .78rem/1 var(--body);padding:7px 10px;border-radius:999px;border:1px solid rgba(232,199,154,.3)}
.open-gal .count svg{width:14px;height:14px}
.open-gal:hover .count{border-color:var(--ember);color:var(--ember)}
.loc .ph img{transition:transform .4s}
.loc:hover .ph img{transform:scale(1.03)}
.loc .view-link{justify-self:start;margin-top:4px;background:none;border:0;padding:6px 0;color:var(--ember);font:700 .9rem var(--body);cursor:pointer}

/* gallery dialog */
.gal{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#05080f;color:var(--paper);overflow:hidden}
.gal[open]{display:grid;grid-template-rows:auto auto 1fr auto}
.gal::backdrop{background:#05080f}
.gal-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(10px + env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) 8px max(16px,env(safe-area-inset-left,0px))}
.gal-top .t{display:grid;min-width:0}
.gal-top b{font-family:var(--head);font-weight:800;color:var(--wood);font-size:1.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gal-top span{font-family:var(--mono);font-size:.75rem;color:var(--sage);font-variant-numeric:tabular-nums}
.gal-tools{display:flex;gap:6px;flex-shrink:0}
.gal-btn{min-height:40px;min-width:40px;padding:0 12px;border-radius:999px;border:1px solid var(--ridge);background:transparent;color:var(--paper);font:700 .85rem var(--body);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.gal-btn:hover,.gal-btn[aria-pressed="true"]{border-color:var(--ember);color:var(--ember)}
.gal-btn svg{width:18px;height:18px}
.gal-groups{display:flex;gap:6px;overflow-x:auto;padding:0 max(16px,env(safe-area-inset-left,0px)) 8px;scrollbar-width:none}
.gal-groups::-webkit-scrollbar{display:none}
.gal-groups button{flex:0 0 auto;min-height:34px;padding:0 12px;border-radius:999px;border:1px solid var(--ridge);background:var(--dusk);color:var(--sage);font:500 .82rem var(--body);cursor:pointer}
.gal-groups button.on{border-color:var(--ember);color:var(--paper)}
.gal-track{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior:contain;min-height:0}
.gal-track::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%;scroll-snap-align:center;scroll-snap-stop:always;display:grid;place-items:center;min-width:0;min-height:0;overflow:hidden;position:relative}
.slide img{max-width:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.slide.zoom{overflow:auto;place-items:start;cursor:zoom-out}
.slide.zoom img{max-width:none;max-height:none}
.slide .miss{display:grid;gap:8px;place-items:center;text-align:center;color:var(--sage);padding:24px;max-width:36ch}
.slide .miss b{color:var(--wood);font-family:var(--head)}
.gal-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:48px;height:48px;border-radius:50%;border:1px solid var(--ridge);background:rgba(13,22,38,.8);color:var(--paper);font-size:1.6rem;cursor:pointer}
.gal-nav.prev{left:max(12px,env(safe-area-inset-left,0px))}
.gal-nav.next{right:max(12px,env(safe-area-inset-right,0px))}
.gal-nav:hover{border-color:var(--ember);color:var(--ember)}
@media (hover:none){.gal-nav{display:none}}
.gal-bot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px max(12px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));border-top:1px solid var(--ridge);background:#070c16}
.gal-bot p{margin:0;min-width:0;font-size:.95rem;line-height:1.3}
.gal-bot p small{display:block;color:var(--sage);font-size:.78rem}
.gal-acts{display:flex;gap:8px;align-items:center;flex-shrink:0}
.board-pick{max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gal-grid{overflow-y:auto;padding:4px max(16px,env(safe-area-inset-left,0px)) 24px;min-height:0}
.gal-grid h4{font-family:var(--head);color:var(--wood);font-size:1rem;margin:16px 0 8px}
.gal-grid .thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:6px}
.thumb{position:relative;aspect-ratio:1;max-width:100%;border:0;padding:0;border-radius:4px;overflow:hidden;cursor:pointer;background:linear-gradient(180deg,#1b2b47,#0d1626)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb .h{position:absolute;right:4px;top:4px;width:22px;height:22px;border-radius:50%;background:var(--ember);color:#1b0f04;display:grid;place-items:center}
.thumb .h svg{width:13px;height:13px}

/* board picker sheet inside the gallery */
.sheet{position:absolute;left:0;right:0;bottom:0;z-index:5;background:var(--dusk);border-top:1px solid var(--ember);border-radius:14px 14px 0 0;padding:16px max(16px,env(safe-area-inset-right,0px)) calc(16px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));display:grid;gap:10px;max-height:70%;overflow-y:auto;box-shadow:0 -10px 40px rgba(0,0,0,.6)}
.sheet h4{margin:0;font-family:var(--head);color:var(--wood);font-size:1.1rem}
.sheet .opt{display:flex;align-items:center;gap:10px;min-height:46px;padding:0 12px;border:1px solid var(--ridge);border-radius:6px;background:var(--night);color:var(--paper);font:500 1rem var(--body);cursor:pointer;text-align:left;width:100%}
.sheet .opt.on{border-color:var(--ember)}
.sheet .opt span:last-child{margin-left:auto;font-family:var(--mono);font-size:.78rem;color:var(--sage)}
.sheet form{display:flex;gap:8px}
.sheet form input{flex:1}

/* boards in the Saved section */
.boards{display:grid;gap:20px;margin-top:28px}
.board{border:1px solid var(--ridge);border-radius:6px;background:var(--dusk);padding:16px;display:grid;gap:12px;min-width:0}
.board.shared{border-color:var(--ok)}
.board-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.board-head h3{display:flex;align-items:baseline;gap:10px}
.board-head h3 small{font-family:var(--mono);font-size:.75rem;color:var(--sage);font-weight:500}
.board-head .tools{display:flex;gap:6px;flex-wrap:wrap}
.board-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.bitem{display:grid;gap:6px;min-width:0}
.bitem .thumb{aspect-ratio:4/3;display:block;width:100%}
.bitem .cap{font-size:.8rem;color:var(--sage);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bitem input{font-size:16px;min-height:38px;padding:6px 10px}
.bitem .rm{position:absolute;right:4px;top:4px;width:30px;height:30px;border-radius:50%;border:0;background:rgba(13,22,38,.85);color:var(--paper);cursor:pointer;font-size:1rem;z-index:2}
.board-empty{margin:0;color:var(--sage);font-size:.95rem}
.board-acts{display:flex;gap:10px;flex-wrap:wrap}
.board-acts .btn{padding:10px 16px;font-size:.95rem}
.new-board{display:flex;gap:8px;max-width:440px}
.new-board input{flex:1}
.new-board .btn{padding:10px 16px}
@media (max-width:560px){.board-items{grid-template-columns:1fr 1fr}.board{padding:12px}}
@media (prefers-reduced-motion:reduce){.gal-track{scroll-behavior:auto}}