/* GLOBAL FINDS V1.2 — dark archaeological / metallic theme */
:root{
  --bg:#0b0d0e;--panel:#151819;--panel2:#1c1f20;--line:#303435;
  --gold:#c59a55;--gold2:#e1bb78;--text:#eeeae2;--muted:#a6a29a;
  --shadow:0 18px 50px rgba(0,0,0,.32);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:
  radial-gradient(circle 3000px at 15% 0,rgba(197,154,85,.09),transparent),
  radial-gradient(circle 2250px at 85% 1000px,rgba(255,255,255,.035),transparent),
  var(--bg);background-repeat:no-repeat;
  color:var(--text);font-family:Inter,Segoe UI,Arial,Helvetica,sans-serif;line-height:1.6;
}
a{color:var(--gold2);transition:.18s ease}a:hover{color:#fff}
.container{width:min(1200px,92%);margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(10,12,13,.96);backdrop-filter:blur(12px);border-bottom:1px solid #403522}
.header-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{color:#f4efe7;text-decoration:none;font-weight:900;font-size:28px;letter-spacing:3px;line-height:1}
.brand-mark{display:inline-block;margin-right:7px;color:var(--gold)}
.brand span{color:var(--gold2)}
.brand small{display:block;margin-top:8px;color:#8d8a84;font-size:9px;letter-spacing:1.5px;font-weight:500}
nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
nav a{color:#c9c6c0;text-decoration:none;padding:9px 12px;border-radius:5px;font-size:14px}
nav a:hover,nav a.active{background:#211e18;color:#f4d9a5}
.nav-admin{border:1px solid #51432d}
.hero{
  position:relative;overflow:hidden;margin:30px 0 22px;padding:55px 52px;border:1px solid #5a4930;border-radius:12px;
  background:
    linear-gradient(120deg,rgba(10,11,12,.94),rgba(36,29,20,.82)),
    radial-gradient(circle at 85% 20%,rgba(197,154,85,.2),transparent 35%);
  box-shadow:var(--shadow);
}
.hero:after{content:"";position:absolute;right:-90px;bottom:-130px;width:360px;height:360px;border:1px solid rgba(197,154,85,.16);border-radius:50%;box-shadow:0 0 0 28px rgba(197,154,85,.025),0 0 0 56px rgba(197,154,85,.018)}
.hero-kicker{position:relative;z-index:1;color:var(--gold);font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase}
.hero h1{position:relative;z-index:1;margin:8px 0 8px;font-family:Georgia,serif;font-size:clamp(36px,5vw,62px);line-height:1.05;letter-spacing:-1px}
.hero p{position:relative;z-index:1;max-width:700px;color:#bcb8b0;font-size:17px;margin:0}
.ad-slot{
  min-height:78px;border:1px dashed #4b4740;color:#6f6c66;display:flex;align-items:center;justify-content:center;
  font-size:10px;letter-spacing:2px;text-transform:uppercase;margin:18px 0;border-radius:7px;background:rgba(255,255,255,.012)
}
.ad-slot.ad-live{border-style:solid;border-color:#3b3428;flex-direction:column;gap:6px;padding:12px;letter-spacing:0;text-transform:none;font-size:14px}
.ad-live a{display:block;max-width:100%;text-decoration:none}
.ad-live img{display:block;max-width:100%;max-height:160px;object-fit:contain;border-radius:5px}
.ad-live .ad-text{display:inline-block;padding:10px 18px;border:1px solid #5a4930;border-radius:6px;color:var(--gold2);font-weight:700}
.ad-live small{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#6f6c66}
.sidebar .ad-live img{max-height:260px}
.filters{
  display:flex;flex-wrap:wrap;gap:9px;margin:20px 0;padding:12px;background:#111415;border:1px solid #292d2e;border-radius:8px
}
.filters input,.filters select,.form input,.form textarea,.form select{
  background:#181b1c;color:#eee;border:1px solid #3b3e3f;padding:11px 12px;border-radius:5px;outline:none;
  /* Without this a field can be wider than the box it sits in: the browser sizes a control
     by its own rules, not the grid's, and everything below then stretches to match. */
  max-width:100%;box-sizing:border-box;min-width:0;width:100%
}
/* Textareas resize up and down only. Dragging the corner handle sideways used to pull the
   box past the edge of the page and drag the rest of the form with it - an editor's note
   wants to be taller, never wider. */
.form textarea,.filters textarea{resize:vertical}
.filters input{flex:1;min-width:230px}.filters input:focus,.filters select:focus,.form input:focus,.form textarea:focus{border-color:#927143;box-shadow:0 0 0 2px rgba(197,154,85,.08)}
.btn{
  background:linear-gradient(180deg,#d0a35c,#aa7932);color:#111;border:1px solid #e1b976;padding:6px 14px;
  border-radius:999px;font-weight:700;font-size:13px;line-height:1.5;text-decoration:none;display:inline-block;cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.18)
}
.btn:hover{color:#111;filter:brightness(1.08)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:15px;margin:28px 0 12px;border-bottom:1px solid #292d2e;padding-bottom:10px}
.section-head h2{margin:0;font-family:Georgia,serif;font-size:26px}.section-head span{color:#777;font-size:12px}
/* align-items:start so the two columns do not stretch each other. Without it the feed
   column is pulled down to the sidebar's height, and on a country with one find the card
   itself then inflates to fill it - a small nugget in a box running the length of the page. */
.grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:25px;align-items:start}
/* align-content:start for the same reason one level down: rows keep their natural height
   instead of sharing out whatever space is going. */
.feed{display:grid;gap:17px;align-content:start}
.card{
  background:linear-gradient(145deg,#181b1c,#131617);border:1px solid #2d3132;border-radius:9px;overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.15);transition:.2s ease
}
.card:hover{border-color:#57482f;box-shadow:0 10px 30px rgba(0,0,0,.28)}
.card img{display:block;width:100%;height:225px;object-fit:cover}
.card-body{padding:19px}
/* The card summary, cut to three lines.
   Measured on a phone, a card was 873px tall and 461px of that - eighteen lines, seven
   hundred characters - was the summary. That is not a summary, it is the article, and a
   reader who has already been given the whole thing has no reason to open the page. Three
   lines is enough to decide by. The full text is still on the find page, and still in the
   RSS feed and the meta description, so nothing is lost to a reader or to a search engine:
   line-clamp hides the overflow visually, it does not remove the words from the page. */
.card-body p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card.featured .card-body p{-webkit-line-clamp:4}
.card.featured{border-color:#66512f}.card.featured img{height:330px}
.card.featured .card-body{padding:23px}
.card.featured h2{font-size:30px}
.meta{font-size:11px;color:#a88a5c;letter-spacing:.7px;text-transform:uppercase}
.card h2{margin:5px 0 7px;font-family:Georgia,serif;font-size:23px;line-height:1.2}
.card h2 a{color:#f0ece5;text-decoration:none}.card h2 a:hover{color:var(--gold2)}
.card p{color:#aaa69e;margin:0 0 16px}
.badge{display:inline-block;border:1px solid #57482f;color:#d5b77f;padding:3px 7px;border-radius:999px;font-size:10px;text-transform:uppercase;letter-spacing:.7px;margin-right:6px}
.sidebar{display:grid;gap:16px;align-content:start}
.panel{background:linear-gradient(145deg,#181b1c,#141718);border:1px solid #2d3132;padding:20px;border-radius:8px;box-shadow:0 8px 25px rgba(0,0,0,.14)}
.panel h3{margin:0 0 8px;font-family:Georgia,serif;font-size:21px}.panel p{color:#aaa69e}
.quick-list{list-style:none;padding:0;margin:12px 0 0}.quick-list li{padding:9px 0;border-bottom:1px solid #292d2e}.quick-list li:last-child{border-bottom:0}
.article{background:linear-gradient(145deg,#181b1c,#141718);padding:32px;border:1px solid #303435;border-radius:9px;box-shadow:var(--shadow)}
.article h1{font-family:Georgia,serif;font-size:clamp(34px,5vw,52px);line-height:1.08;margin:8px 0 18px}.article{overflow-wrap:anywhere}.article .story{white-space:pre-wrap;overflow-wrap:anywhere;color:#c5c1ba;font-size:17px;line-height:1.8}
.find-image{width:100%;max-height:600px;object-fit:cover;border-radius:7px;margin-bottom:22px}
.form{display:grid;gap:14px;background:#171a1b;padding:25px;border:1px solid #303435;border-radius:8px}
/* min-width:0 on the grid items. A grid track sizes itself to its content by default, so a
   field that grows widens the column, and "max-width:100%" then means 100% of something that
   has already grown - the whole form stretches past the page. Zero lets the track shrink and
   the cap do its job. */
.form label{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;color:#c8c4bc;font-size:13px;font-weight:700;min-width:0}
.form-two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.form-two>*{min-width:0}.form textarea{min-height:180px}
.admin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat{background:#171a1b;border:1px solid #303435;padding:20px;border-radius:7px}.stat b{font-size:32px;display:block;color:var(--gold2)}
.table-wrap{overflow:auto}.admin-table{width:100%;border-collapse:collapse;background:#171a1b;border:1px solid #303435}.admin-table th,.admin-table td{padding:11px;border-bottom:1px solid #303435;text-align:left;vertical-align:top;white-space:nowrap}.admin-table td:first-child{white-space:normal;overflow-wrap:anywhere;min-width:220px;width:100%}.admin-table td:last-child{text-align:right}.notice{padding:13px;background:#28231a;border-left:3px solid var(--gold);margin-bottom:15px;color:#d8d0c2}
.footer{margin-top:60px;padding:30px 0;color:#777;border-top:1px solid #252829;background:#0a0c0d}.footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.footer strong{color:#b8b3aa}
.empty{padding:30px;text-align:center;border:1px dashed #3b3e3f;border-radius:8px;color:#85827c;background:#131617}
@media(max-width:850px){.grid{grid-template-columns:1fr}.admin-grid{grid-template-columns:1fr 1fr}.header-inner{min-height:auto;padding:15px 0;align-items:flex-start}.hero{padding:38px 28px}.sidebar{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.container{width:94%}.header-inner{display:block}.brand{display:block;margin-bottom:12px}nav{gap:2px}.hero{margin-top:18px;padding:32px 22px}.hero h1{font-size:37px}.card.featured img,.card img{height:210px}.card.featured h2{font-size:25px}.sidebar,.admin-grid{grid-template-columns:1fr}.article{padding:22px}}

/* V1.2 additions */
.hero-actions{position:relative;z-index:1;margin-top:20px}

.image-placeholder{height:225px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(135deg,#17191a,#25211a);color:#8e7958;letter-spacing:2px;text-transform:uppercase;font-size:12px}
.card.featured .image-placeholder{height:330px}
.image-placeholder span{font-size:9px;letter-spacing:1px;color:#6f6b63;margin-top:5px}
.map-wrap{border:1px solid #303435;border-radius:9px;overflow:hidden;box-shadow:var(--shadow);background:#101314}
#find-map{height:620px;width:100%;background:#0e1112}
.map-note{padding:12px 4px;color:#7f7b73;font-size:12px}
/* V1.19 - the map furniture wears the site's colours instead of Leaflet's white default.
   These rules only bite because header.php now loads leaflet.css BEFORE this file. */
.leaflet-container{font:inherit;background:#0e1112}
/* Darken the map itself. Inverting and rotating the hue turns the standard light
   OpenStreetMap tiles into a dark basemap that sits with the rest of the page —
   no second tile provider, no API key. Markers and popups live in other panes,
   so they keep their own colours. Delete this rule for the normal light map. */
.leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.86) saturate(.55)}
.leaflet-popup-content-wrapper{background:linear-gradient(150deg,#1b1f20,#141718);color:#eae6de;border:1px solid #4a3d27;border-radius:9px;box-shadow:0 14px 34px rgba(0,0,0,.55)}
.leaflet-popup-tip{background:#181c1d;border:1px solid #4a3d27;box-shadow:none}
.leaflet-popup-content a{color:var(--gold2)}
.leaflet-popup-content{margin:13px 16px;line-height:1.5;font-size:14px;min-width:180px}
.map-pop strong{display:block;padding-right:18px;font-family:Georgia,serif;font-size:16px;line-height:1.3;color:#f2eee6}
.map-pop .map-pop-meta{display:block;margin-top:5px;font-size:11px;letter-spacing:1.3px;text-transform:uppercase;color:#918c83}
.map-pop .map-pop-link{display:inline-block;margin-top:10px;padding:5px 13px;border:1px solid #5a4930;border-radius:999px;color:var(--gold2);font-size:12px;font-weight:600;text-decoration:none}
.map-pop .map-pop-link:hover{background:#241e14;color:#fff;border-color:#7a6440}
.leaflet-popup-close-button{color:#8d8a84!important;font-size:19px!important;padding:7px 8px 0 0!important}
.leaflet-popup-close-button:hover{color:var(--gold2)!important;background:none!important}
.leaflet-div-icon.find-pin{background:none;border:0;filter:drop-shadow(0 3px 4px rgba(0,0,0,.55))}
/* V1.66: the find a reader came from - bigger pin, soft pulsing ring at its tip. */
.find-pin-active{position:relative}
.find-pin-active svg{position:relative}
.find-pin-ring{position:absolute;left:50%;bottom:-6px;width:26px;height:12px;margin-left:-13px;border:2px solid #e8c35a;border-radius:50%;opacity:.8;animation:findPulse 1.8s ease-out infinite}
@keyframes findPulse{from{transform:scale(.5);opacity:.9}to{transform:scale(2.2);opacity:0}}
@media(prefers-reduced-motion:reduce){.find-pin-ring{animation:none;opacity:.6}}
.map-show-all{background:#1b1f20;color:var(--gold2);border:1px solid #3b3428;border-radius:999px;padding:6px 13px;font-family:inherit;font-size:12px;font-weight:600;line-height:1.2;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.map-show-all:hover{background:#262a2b;color:#fff}
.leaflet-control-zoom a{background:#1b1f20!important;color:var(--gold2)!important;border-color:#3b3428!important}
.leaflet-control-zoom a:hover{background:#262a2b!important;color:#fff!important}
.leaflet-control-attribution{background:rgba(16,19,20,.85)!important;color:#8a8680!important;font-size:10px}
.leaflet-control-attribution a{color:#b28c56!important}
.ad-card{display:flex;flex-direction:column;background:linear-gradient(145deg,#181b1c,#141718);border:1px solid #3a3428;border-radius:8px;overflow:hidden;box-shadow:0 8px 25px rgba(0,0,0,.18)}
.ad-card img{display:block;width:100%;max-height:220px;object-fit:cover}
.ad-copy{padding:15px;display:grid;gap:5px}.ad-copy strong{font-family:Georgia,serif;font-size:19px}.ad-copy small{color:#89857d}.ad-label{text-transform:uppercase;letter-spacing:1.5px;font-size:9px;color:#b28c56}.ad-btn{justify-self:start;margin-top:6px;font-size:12px;padding:7px 11px}
.gallery{margin:20px 0 25px}.gallery h3{font-family:Georgia,serif;margin:0 0 10px}.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.gallery-grid a,.gallery-grid label{display:block;background:#101213;border:1px solid #2d3132;border-radius:6px;overflow:hidden}.gallery-grid img{display:block;width:100%;height:180px;object-fit:cover}.location-box{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:25px 0;padding:15px;background:#121516;border:1px solid #3b3428;border-radius:7px}.location-box span{color:#aaa69e;font-family:monospace}.location-box .btn{margin-left:auto}
.form-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field-help{font-weight:400;color:#777;font-size:11px}.existing-gallery{padding:15px;background:#121516;border:1px solid #303435;border-radius:7px}.existing-gallery>strong{display:block;margin-bottom:10px}.admin-gallery label{position:relative}.admin-gallery label span{display:flex;align-items:center;gap:6px;padding:7px;font-size:11px;color:#aaa69e}.admin-gallery label img{height:130px}.admin-summary{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:20px 0}.admin-ad-layout{display:grid;grid-template-columns:minmax(320px,430px) minmax(0,1fr);gap:25px}.ad-preview{display:block;width:100%;max-height:180px;object-fit:cover;border:1px solid #303435;border-radius:6px;margin:0 0 10px}.check-label{display:flex!important;grid-template-columns:none!important;align-items:center;gap:8px}.check-label input{width:auto}.inline-form{display:inline}.secondary-btn{background:#292d2e;color:#ddd;border-color:#45494a}.secondary-btn:hover{color:#fff}.danger-btn{background:#5a2823;color:#fff;border-color:#7a3b34;margin-left:4px}.danger-btn:hover{color:#fff;filter:brightness(1.08)}
@media(max-width:850px){.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-summary,.admin-ad-layout{grid-template-columns:1fr}.form-two{grid-template-columns:1fr}#find-map{height:500px}}
@media(max-width:560px){.gallery-grid{grid-template-columns:1fr}.gallery-grid img{height:220px}.card.featured .image-placeholder,.image-placeholder{height:210px}.location-box .btn{margin-left:0}.admin-summary{grid-template-columns:1fr}}

/* V1.3 — submissions, news inbox, sources */
.admin-nav{display:flex;flex-wrap:wrap;gap:4px;padding:6px 0 10px}.admin-nav a{color:#c9c6c0;text-decoration:none;font-size:12px;padding:5px 10px;border:1px solid #3b3428;border-radius:999px}.admin-nav a:hover{background:#211e18;color:#f4d9a5}
.inbox-list{display:grid;gap:12px}.inbox-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:start;background:#171a1b;border:1px solid #303435;border-radius:8px;padding:16px 18px}
.inbox-item h3{margin:4px 0 6px;font-family:Georgia,serif;font-size:20px;line-height:1.25}.inbox-item h3 a{color:#f0ece5;text-decoration:none}.inbox-item h3 a:hover{color:var(--gold2)}
.inbox-item p{margin:0 0 8px;color:#aaa69e;font-size:14px}.inbox-item img{display:block;width:160px;height:100px;object-fit:cover;border-radius:5px;border:1px solid #303435}
.inbox-actions{display:grid;gap:6px;min-width:170px}.inbox-actions .btn{text-align:center}
.pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:10px;letter-spacing:.7px;text-transform:uppercase;border:1px solid #555;color:#bbb}.pill-published{color:#8fd19e;border-color:#2f6b3c}.pill-pending{color:#f0c674;border-color:#7a5f2a}.pill-draft{color:#aaa;border-color:#555}
.admin-table td.wrap,.admin-table small.wrap{white-space:normal;max-width:320px;display:inline-block}
.success-box{margin:20px 0}.success-box h3{color:var(--gold2)}.error-list{margin:8px 0 0 18px;padding:0}
.form textarea.short{min-height:90px}.hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}
.danger-zone{margin:18px 0 0;text-align:right}.mono{font-family:monospace;font-size:12px;word-break:break-all;color:#d5b77f}
.compact-hero .inline-form{margin-right:6px}
@media(max-width:700px){.inbox-item{grid-template-columns:1fr}.inbox-actions{grid-template-columns:1fr 1fr;min-width:0}}
.rename-form{display:flex;gap:6px;align-items:center}.rename-form input{background:#181b1c;color:#eee;border:1px solid #3b3e3f;padding:7px 9px;border-radius:5px;min-width:180px}
/* V1.4 - video */
.video-wrap{position:relative;width:100%;padding-top:56.25%;margin:0 0 22px;background:#000;border-radius:7px;overflow:hidden;border:1px solid #303435}
.video-wrap iframe,.video-wrap video{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-link{display:flex;align-items:center;gap:16px;margin:0 0 22px;padding:18px 20px;background:linear-gradient(135deg,#1a1c1d,#25211a);border:1px solid #5a4930;border-radius:8px;text-decoration:none;color:#f0ece5}
.video-link:hover{border-color:var(--gold);color:#fff}.video-link strong{display:block;font-size:18px;font-family:Georgia,serif}.video-link small{color:#aaa69e;font-size:12px}
.video-play{flex:0 0 54px;height:54px;border-radius:50%;background:linear-gradient(180deg,#d0a35c,#aa7932);color:#111;display:flex;align-items:center;justify-content:center;font-size:22px;padding-left:4px;box-shadow:0 5px 18px rgba(0,0,0,.3)}
.badge-video{color:#f0ece5;border-color:#6b5a3a;background:#2a2419}
/* V1.5 - SEO pages, pagination, footer, consent */
.crumbs{margin:18px 0 -6px;font-size:12px;color:#8d8a84;letter-spacing:.5px}
.crumbs a{color:#a88a5c;text-decoration:none}.crumbs a:hover{color:var(--gold2)}.crumbs span{opacity:.5;margin:0 4px}
.card-media{display:block;text-decoration:none}
.pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0 0;padding-top:18px;border-top:1px solid #292d2e}
.pagination .page-of{color:#85827c;font-size:13px}.btn.is-off{opacity:.35;pointer-events:none}
.tag-list{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-wrap:wrap;gap:7px}
.tag-list a{display:inline-block;padding:6px 11px;border:1px solid #3b3428;border-radius:999px;font-size:12px;color:#d5b77f;text-decoration:none}
.tag-list a:hover{background:#211e18;color:#f4d9a5;border-color:var(--gold)}
.quick-list a{text-decoration:none}.count{color:#6f6c66;font-size:11px}
.related{margin:30px 0 0}
.related-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.related-card{display:block;background:#171a1b;border:1px solid #2d3132;border-radius:8px;overflow:hidden;text-decoration:none;color:#f0ece5;transition:.18s ease}
.related-card:hover{border-color:#57482f;color:#fff}
.related-card img{display:block;width:100%;height:110px;object-fit:cover}
.related-ph{display:flex;align-items:center;justify-content:center;height:110px;background:linear-gradient(135deg,#17191a,#25211a);color:#8e7958;font-size:10px;letter-spacing:2px}
.related-meta{display:block;padding:10px 12px 0;font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:#a88a5c}
.related-title{display:block;padding:4px 12px 13px;font-family:Georgia,serif;font-size:15px;line-height:1.3}
.footer-cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:28px;padding-bottom:22px}
.footer-cols strong{color:#b8b3aa;display:block;margin-bottom:9px}
.footer-cols p{margin:0;color:#777;font-size:14px}
.footer-cols ul{list-style:none;padding:0;margin:0}.footer-cols li{padding:3px 0}
.footer-cols a{color:#98948c;text-decoration:none;font-size:14px}.footer-cols a:hover{color:var(--gold2)}
.footer-base{padding-top:18px;border-top:1px solid #1e2122;color:#6b6862;font-size:12px}
.consent{position:fixed;left:0;right:0;bottom:0;z-index:200;background:rgba(12,14,15,.98);border-top:1px solid #5a4930;box-shadow:0 -12px 40px rgba(0,0,0,.45);backdrop-filter:blur(8px)}
.consent-inner{width:min(1200px,92%);margin:auto;padding:16px 0;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.consent p{margin:0;flex:1;min-width:280px;color:#c5c1ba;font-size:14px}
.consent a{color:var(--gold2)}
.consent-actions{display:flex;gap:9px;flex-wrap:wrap}
.prose h2{font-family:Georgia,serif;font-size:26px;margin:28px 0 8px}
.prose h3{font-size:17px;margin:20px 0 6px;color:#d8d0c2}
.prose p,.prose li{color:#c5c1ba;line-height:1.75}
.prose ul{padding-left:20px}.prose li{margin-bottom:7px}
.steps{padding-left:20px;color:#aaa69e;line-height:1.7}.steps li{margin-bottom:9px}
.ad-sense{border-style:none;padding:0;min-height:0;display:block}
@media(max-width:850px){.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-cols{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.related-grid{grid-template-columns:1fr}.footer-cols{grid-template-columns:1fr}.consent-inner{padding:14px 0}}
/* V1.6 - editor's note */
.editor-note{margin:24px 0;padding:20px 24px;background:linear-gradient(135deg,#1a1c1d,#221f18);border:1px solid #5a4930;border-left:4px solid var(--gold);border-radius:8px}
.editor-note h2{margin:0 0 9px;font-family:Georgia,serif;font-size:15px;letter-spacing:2px;text-transform:uppercase;color:var(--gold2)}
.editor-note div{color:#ddd7cd;font-size:17px;line-height:1.75;white-space:pre-wrap}
@media(max-width:560px){.editor-note{padding:16px 17px}.editor-note div{font-size:16px}}
/* V1.7 - detector used */
.kit{display:inline-flex;align-items:center;gap:10px;margin:20px 0 0;padding:9px 15px;background:#121516;border:1px solid #3b3428;border-radius:999px}
.kit span{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:#8d8a84}
.kit strong{color:var(--gold2);font-size:15px}
/* V1.10 - photograph picker in the find editor */
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-top:12px}
.photo-tile{margin:0;background:#101213;border:1px solid #2d3132;border-radius:7px;overflow:hidden;transition:.18s ease}
.photo-tile.is-main{border-color:var(--gold);box-shadow:0 0 0 1px rgba(197,154,85,.35)}
.photo-tile img{display:block;width:100%;height:130px;object-fit:cover;background:#0b0d0e}
.photo-tile figcaption{display:flex;gap:6px;padding:8px;border-top:1px solid #23262700}
.photo-opt{display:flex!important;align-items:center;gap:5px;flex:1;margin:0;padding:5px 7px;border:1px solid #303435;border-radius:5px;
  font-size:11px;font-weight:700;color:#aaa69e;cursor:pointer;background:#161819}
.photo-opt:hover{border-color:#57482f;color:#e9e4db}
.photo-opt input{width:auto;margin:0;accent-color:var(--gold)}
.photo-tile.is-main .photo-opt input[type=radio]+*,.photo-tile.is-main .photo-opt:first-child{color:var(--gold2);border-color:#5a4930}
/* V1.13 - not found page */
.notfound{margin:26px 0 10px}
.notfound h2{font-family:Georgia,serif;font-size:20px;margin:0 0 12px}
.notfound .tag-list{gap:8px}
.notfound .tag-list a{padding:8px 14px;font-size:13px}
/* V1.14 - buttons sized like the pills used elsewhere, with a couple of exceptions */
.hero-actions .btn{padding:11px 22px;font-size:15px}      /* the one big call to action on the homepage */
.filters .btn{padding:10px 18px}                          /* line up with the search inputs beside it */
.form > .btn{padding:9px 20px;font-size:14px}             /* the save button at the foot of a form */
.compact-hero .btn,.hero .btn{margin:2px 3px 2px 0}
.admin-table td:last-child .btn{margin-bottom:2px}
/* V1.15 - copy-to-clipboard row */
.copy-row{display:flex;align-items:center;gap:8px;margin:10px 0;padding:9px 11px;background:#101213;border:1px solid #3b3428;border-radius:7px}
.copy-row .copy-target{flex:1;min-width:0;overflow-wrap:anywhere;font-size:11px;line-height:1.5;color:#d5b77f}
.copy-row .btn{flex:0 0 auto}

/* V1.17 - unsold slots vanish for visitors; admins keep a faint marker. Affiliate links. */
.ad-slot.ad-ghost{min-height:0;margin:12px 0;padding:5px 10px;opacity:.4;font-size:9px;letter-spacing:1.4px}
.kit strong a{color:var(--gold2);text-decoration:underline;text-underline-offset:3px}
.kit strong a:hover{color:#fff}
.aff-note{margin:8px 0 0;font-size:11px;line-height:1.55;color:#77736c}
.gear-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.gear-list li{display:flex;flex-direction:column;gap:2px;padding:9px 11px;border:1px solid #33302b;border-radius:6px;background:rgba(255,255,255,.015)}
.gear-list a{color:var(--gold2);font-weight:600;text-decoration:none}
.gear-list a:hover{text-decoration:underline}
.gear-list span{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:#77736c}
.gear-panel .aff-note{margin-top:10px}
/* V1.18 - richer Recent records row: metadata line plus a checklist of small icons */
.rec-meta{display:block;margin-top:4px;font-size:11.5px;letter-spacing:.2px;color:#8d8a84}
.rec-meta em{font-style:normal;color:#5f5c57}
.flags{display:inline-flex;align-items:center;gap:7px}
.flags a,.flags span{display:inline-flex;line-height:0;color:var(--gold2)}
.flags .off{color:#4a4741}
.flags a:hover{color:#fff}
/* V1.21 - inbox bulk triage: tick column, sticky action bar, repeat highlighting */
.bulk-bar{display:flex;flex-wrap:wrap;align-items:center;gap:9px;padding:10px 13px;margin:0 0 6px;background:#15191a;border:1px solid #3b3428;border-radius:8px;position:sticky;top:0;z-index:5}
.bulk-bar .check-label{margin:0;font-size:13px}
.bulk-count{font-size:12px;color:#8d8a84;margin-left:auto}
.inbox-item{grid-template-columns:auto minmax(0,1fr) auto}
.inbox-tick{padding-top:3px}
.inbox-tick input{width:17px;height:17px;accent-color:#c9a227;cursor:pointer}
.inbox-item.is-repeat{opacity:.72;border-color:#3b3428;background:#131617}
.inbox-item.is-repeat:hover{opacity:1}
.inbox-item .pill{margin:0 6px 6px 0}
@media(max-width:700px){.inbox-item{grid-template-columns:auto minmax(0,1fr)}.inbox-tick{grid-row:1}}
/* V1.22 - one row of buttons at the foot of the find editor, delete pushed clear of the other two */
.form-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:4px}
.form-actions .btn{padding:9px 20px;font-size:14px;width:auto}
.form-actions .danger-btn{margin-left:auto}
@media(max-width:560px){.form-actions .danger-btn{margin-left:0}}
/* V1.22 - news coverage kept with a find: reader links, and the admin review panel */
.also-reported{margin:22px 0 0;padding:13px 16px;background:#121516;border:1px solid #303435;border-radius:7px}
.also-reported strong{display:block;margin-bottom:8px;font-size:10px;letter-spacing:1.8px;text-transform:uppercase;color:#8d8a84}
.also-reported ul{list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0}
.also-reported a{display:inline-block;padding:5px 12px;border:1px solid #3b3428;border-radius:999px;color:var(--gold2);font-size:12px;text-decoration:none}
.also-reported a:hover{background:#241e14;color:#fff}
.coverage-list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:10px}
.coverage-list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;padding:10px;background:#171a1b;border:1px solid #303435;border-radius:7px}
.coverage-list img{display:block;width:130px;height:84px;object-fit:cover;border-radius:5px;border:1px solid #303435}
.coverage-pub{display:block;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:#8d8a84;margin-bottom:3px}
.coverage-title{display:block;color:#eae6de;font-size:14px;line-height:1.35;text-decoration:none;margin-bottom:5px}
.coverage-title:hover{color:var(--gold2)}
.coverage-sum{display:block;margin-top:5px;color:#8f8b84;font-size:12px;line-height:1.5}
@media(max-width:560px){.coverage-list li{grid-template-columns:1fr}.coverage-list img{width:100%;height:150px}}
.kw-form{display:flex;gap:6px;align-items:center}
.kw-form input{width:150px;padding:6px 9px;font-size:12px}
.kw-form .btn{padding:5px 11px;font-size:11px}
.bulk-approve{display:inline-flex;align-items:center;gap:0}
.bulk-approve .btn{border-top-right-radius:0;border-bottom-right-radius:0}
.bulk-approve select{padding:6px 9px;font-size:12px;border:1px solid #45494a;border-left:0;border-top-right-radius:999px;border-bottom-right-radius:999px;background:#292d2e;color:#ddd}
/* V1.26 - one size for every hero on the site. The homepage adds a row layout on top
   (.hero.split, call to action on the right); the type and spacing are identical, so a
   page reached by clicking through looks like a sibling of the one you came from.
   Change these two rules and every hero moves together. */
.hero.split,.compact-hero{padding:32px 38px}
.hero.split h1,.compact-hero h1{font-size:clamp(30px,3.6vw,46px);margin:5px 0 7px}
.hero.split p,.compact-hero p{font-size:16px}
.hero.split:after,.compact-hero:after{right:-120px;bottom:-160px}

.hero.split{display:flex;align-items:center;justify-content:space-between;gap:36px;margin:24px 0 20px}
.hero.split .hero-copy{position:relative;z-index:1;min-width:0}
.hero.split p{max-width:620px}
.hero.split .hero-actions{flex:0 0 auto;margin:0}
@media(max-width:780px){
  .hero.split{display:block}
  .hero.split .hero-actions{margin-top:18px}
}
@media(max-width:560px){
  .hero.split,.compact-hero{padding:26px 22px}
  .hero.split h1,.compact-hero h1{font-size:28px}
}
.dupe-note{display:block;margin-top:3px;font-size:11px;line-height:1.5;color:#8d8a84;white-space:normal}
.dupe-note a{color:var(--gold2)}
/* V1.33 - the four counts are the dashboard's navigation, so they look and behave
   like buttons. The two panels that used to repeat them are gone. */
a.stat{display:block;text-decoration:none;color:#c8c4bc;transition:border-color .15s ease,background .15s ease}
a.stat:hover{border-color:#5a4930;background:#1c2021;color:#e8e3da}
a.stat b{margin:2px 0}
a.stat small{display:block;font-size:11px;color:#77736c}
a.stat:hover small{color:#8d8a84}
a.stat.stat-live b{color:var(--gold2)}
a.stat.stat-live{border-color:#4a3d27}
/* V1.34 - Advertising, Backups and the map were three tall boxes saying one thing
   each. One line apiece, whole row clickable, same as the counts above them. */
.admin-strip{display:grid;gap:7px;margin:16px 0 22px}
.strip-row{display:flex;align-items:center;gap:14px;padding:10px 15px;background:#171a1b;border:1px solid #303435;border-radius:7px;text-decoration:none;color:#c8c4bc;transition:border-color .15s ease,background .15s ease}
.strip-row:hover{border-color:#5a4930;background:#1c2021}
.strip-label{flex:0 0 120px;font-weight:700;font-size:13px;color:#e8e3da}
.strip-fact{flex:1;min-width:0;font-size:13px;color:#a6a29a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.strip-fact b{color:var(--gold2);font-weight:700}
.strip-go{flex:0 0 auto;font-size:12px;color:var(--gold2);white-space:nowrap}
.strip-row:hover .strip-go{color:#fff}
@media(max-width:620px){
  .strip-row{flex-wrap:wrap;gap:3px 12px;padding:11px 14px}
  .strip-label{flex:0 0 100%}
  .strip-fact{flex:1 1 auto;white-space:normal}
}
/* V1.36 - a page whose main content is a table needs the WIDE column first, unlike
   .admin-ad-layout which leads with a narrow form. The top margin stops the side
   panels butting straight into the counts above them, and align-items:start keeps
   each column its own height instead of stretching to match. */
.admin-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,380px);gap:22px;margin:22px 0;align-items:start}
.admin-split > div > h2:first-child{margin-top:0}
.admin-split > div{display:grid;gap:16px;align-content:start}   /* .panel carries no margin of its own */
@media(max-width:900px){.admin-split{grid-template-columns:1fr}}
/* V1.36 - Every card carries its article number, bottom right. It is the same id the
   admin tables and the edit screen use, so a page on the site and a row in the review
   queue can be matched without opening either. Quiet enough to ignore when reading. */
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.card-tags{display:flex;align-items:center;flex-wrap:wrap}
.card-no{margin-left:auto;flex:0 0 auto;font-size:11px;letter-spacing:.7px;text-transform:uppercase;color:#6f6b64;font-variant-numeric:tabular-nums;white-space:nowrap}
.card:hover .card-no{color:#9a958c}
/* V1.37 - Recent records became All records: it pages through everything rather than
   stopping at twelve, and carries the Ref number shown on each card so a page on the
   site and a row here can be matched by eye. */
.count-note{font-family:system-ui,sans-serif;font-size:12px;font-weight:400;color:#85827c;letter-spacing:.3px}
.records-table td.ref-cell{color:#a88a5c;font-variant-numeric:tabular-nums;text-align:right;font-weight:700}
.records-table th:nth-child(2){text-align:right}

/* V1.38 - empty-state rows. A cell that spans the table is both the first child and
   the last, so the "actions column" right-alignment above was catching it and pushing
   "Nothing waiting" over to the right. Spanning cells are prose, never actions. */
.admin-table td[colspan]{text-align:left}

/* V1.39 - country pages can now be filtered to one category. The note says what is being
   shown and how to get back out of it, because a filtered list that looks like the whole
   list is how you end up doubting the counts. */
.filter-note{margin:0 0 14px;padding:10px 13px;background:#1c1a16;border-left:3px solid var(--gold);color:#c9c2b4;font-size:14px}
.filter-note a{color:var(--gold)}
.quick-list li.is-on a{color:var(--gold);font-weight:700}
.quick-list li.is-on{background:#1a1815;margin:0 -13px;padding-left:13px;padding-right:13px}

/* V1.40 - the About page photograph. Sized to sit inside the prose column rather than
   break out of it, because it is illustration, not a hero image. */
.about-figure{margin:22px 0}
.about-figure img{width:100%;max-width:400px;height:auto;border:1px solid #303435;border-radius:6px;display:block}
.about-figure figcaption{max-width:400px}
.about-figure figcaption{margin-top:8px;font-size:13px;color:#85827c}

/* V1.41 - About page: the story on the left, the kit on the right. Collapses to a single
   column on a phone, where side-by-side would leave both halves too narrow to read. */
.about-split{display:grid;grid-template-columns:1fr 300px;gap:24px;align-items:start}
.about-split-text>p:first-child{margin-top:0}
.about-split .about-figure{margin:0}
.about-split .about-figure img,.about-split .about-figure figcaption{max-width:100%}
@media(max-width:760px){.about-split{grid-template-columns:1fr}.about-split .about-figure{margin:18px auto 0;max-width:340px}}
/* The contact link is a <span> until site.js turns it into a real mailto, so it has to look
   and behave like a link from the moment the page paints. */
.mail-link{color:var(--gold);cursor:pointer;text-decoration:underline}
a.mail-link.btn,span.mail-link.btn{text-decoration:none}

/* V1.42 - the pre-publish check. Three weights of message: a stop, something to look at,
   and an all-clear. The stop is red because it is the only one that actually prevents you. */
.notice-stop{background:#2a1a1a;border-left-color:#c0392b;color:#e8d5d2}
.notice-watch{background:#241f14;border-left-color:#d99b2b}
.notice-ok{background:#16231a;border-left-color:#4f9d69;color:#cfe3d4}
.check-list{margin:10px 0 0;padding-left:20px}
.check-list li{margin-bottom:7px;line-height:1.5}

/* V1.43 - the "Before you dig" panel. Each row is a link with a line of explanation under
   it, because "NCMD" means nothing to someone who has owned a detector for a week. */
.guidance-panel .panel-intro{margin:10px 0 12px;font-size:13px;color:#8e8a83;line-height:1.5}
.guidance-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 24px}
.guidance-list li{padding:10px 0;border-bottom:1px solid #292d2e}
.guidance-list li:last-child{border-bottom:0}
.guidance-list a{text-decoration:none;font-weight:700;display:block}
.guidance-list span{display:block;margin-top:3px;font-size:12px;color:#7d7973;line-height:1.45}
.guidance-panel .panel-foot{margin:12px 0 0;font-size:12px;color:#6f6c66;line-height:1.5}

/* V1.44 - the jurisdiction block under the guidance list. Quieter than the links above it:
   this is context for people who travel with a machine, not a call to action. */
.guidance-where{margin-top:16px;padding-top:14px;border-top:1px solid #292d2e}
/* Folded away by default. The summary still carries the point when closed - somebody who
   only ever reads that line has learned the thing that matters, which is that the rules are
   not the same everywhere. */
.guidance-where>summary{cursor:pointer;list-style:none;font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:#8e8a83;padding:2px 0}
.guidance-where>summary::-webkit-details-marker{display:none}
.guidance-where>summary::before{content:'A';display:inline-block;margin-right:7px;transition:transform .15s ease;color:var(--gold)}
.guidance-where[open]>summary::before{transform:rotate(90deg)}
.guidance-where>summary:hover{color:#b3aea5}
.guidance-where[open]>summary{margin-bottom:9px}
.guidance-where p{margin:0 0 9px;font-size:12.5px;line-height:1.55;color:#7d7973}
.guidance-where strong{color:#a9a49c}
.guidance-where a{color:var(--gold);text-decoration:none;white-space:nowrap}

/* V1.49 - place finder in the find editor. Results are buttons, not links: choosing one
   fills the two boxes below rather than going anywhere. */
.place-finder{margin:0 0 14px;padding:12px 13px;background:#171a1b;border:1px solid #303435;border-radius:4px}
.place-finder>label{display:block;font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:#8e8a83;margin-bottom:7px}
.place-row{display:flex;gap:8px;align-items:stretch}
.place-row input{flex:1 1 auto;min-width:0}
.place-results{list-style:none;margin:10px 0 0;padding:0;max-height:260px;overflow:auto}
.place-results li{margin:0 0 5px}
.place-hit{display:block;width:100%;text-align:left;background:#1d2122;border:1px solid #303435;border-radius:3px;padding:8px 10px;cursor:pointer;color:inherit;font:inherit}
.place-hit:hover{border-color:var(--gold);background:#23282a}
.place-name{display:block;font-size:13px;line-height:1.35}
.place-meta{display:block;margin-top:3px;font-size:11px;color:#85827c;font-variant-numeric:tabular-nums}
.place-note{font-size:12.5px;color:#8e8a83;padding:6px 2px;line-height:1.5}

/* V1.54 - skip link. Off-screen until it has keyboard focus, then it lands where a sighted
   keyboard user expects: top left, over everything, unmistakably a control. */
.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--gold);color:#12100d;
  padding:10px 16px;border-radius:0 0 4px 0;font-weight:700;text-decoration:none}
.skip-link:focus{left:0}
main:focus{outline:none}

/* V1.56 - X-Terra Elite target ID table on the About page.
   Sits in the text column beside the photo, so it has to stay narrow: one range column instead
   of the sheet's three. Group colours echo Rob's spreadsheet bands and are decoration only -
   each group is also named in its heading row. When the COLUMN is under 520px the table
   stops being a table: each row becomes a two-line block, find and number on top, note
   underneath. A container query, not a media query, because the column beside the photo is
   only ~350px on an 820px tablet - the screen is wide but the space is not. Browsers without
   container queries keep the table and scroll it sideways inside .tid-wrap. */
.about-split-text{container-type:inline-size;min-width:0}
.tid-title{margin:26px 0 10px;font-size:17px}
.tid-wrap{overflow-x:auto}
.tid{width:100%;border-collapse:collapse;font-size:14px;line-height:1.45;background:#151819;border:1px solid var(--line)}
.tid th,.tid td{padding:8px 11px;text-align:left;vertical-align:top;border-bottom:1px solid #26292a}
.tid thead th{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);background:#1c1f20;border-bottom:1px solid var(--line)}
.tid tbody th[scope=row]{font-weight:600;color:var(--text)}
.tid .tid-num{white-space:nowrap;text-align:center;font-variant-numeric:tabular-nums;font-weight:700;color:var(--gold2)}
.tid .tid-note{color:#c9c4ba}
.tid .tid-group th{padding:7px 11px;font-size:11px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;
  background:#1a1c1d;border-left:4px solid var(--tid-band);color:var(--tid-band)}
.tid tbody tr:not(.tid-group) th{border-left:4px solid var(--tid-band)}
.tid-silver{--tid-band:#d4b35e}
.tid-medium{--tid-band:#7fa3c8}
.tid-high  {--tid-band:#86b06f}
.tid-trash {--tid-band:#c7765d}
.tid-caveat{margin-top:8px}
@container (max-width:520px){
  .tid thead{display:none}
  .tid tbody tr:not(.tid-group){display:grid;grid-template-columns:1fr auto;border-left:4px solid var(--tid-band);border-bottom:1px solid #26292a}
  .tid tbody tr:not(.tid-group) th,.tid tbody tr:not(.tid-group) td{border:0}
  .tid tbody tr:not(.tid-group) th{padding-bottom:2px}
  .tid .tid-note{grid-column:1 / -1;padding-top:0;font-size:13px}
  .tid .tid-group{display:block}.tid .tid-group th{display:block}
}

/* V1.57 - guide pages (guides/). Same prose layout as About; a lede to set the question up,
   and a sources list that reads as a reference list rather than body text. */
.guide .guide-lede{font-size:18px;line-height:1.6;color:#e6e1d8}
.guide h2{margin-top:30px}
.guide-sources{padding-left:18px}.guide-sources li{margin:5px 0;font-size:14px;color:#c9c4ba}
/* Two bordered boxes stacked with no gap read as one broken box. The guide page is the first
   where the panel directly follows an article; 30px matches the gap .related leaves below one. */
.article + .guidance-panel{margin-top:30px}

/* V1.58 - second guide, guides index, Harvard references.
   Figures are full column width with their dimensions set in the HTML, so nothing jumps while
   they load. Tables scroll sideways inside their wrapper on a narrow phone rather than widening
   the page. References use a hanging indent, the usual look for a Harvard list. */
.guide-credit{margin:18px 0;padding:12px 16px;background:#1a1c1d;border-left:3px solid var(--gold);border-radius:0 6px 6px 0;font-size:14px;color:#c9c4ba}
.guide .cite{color:var(--muted);font-size:.9em}
.guide-figure{margin:24px 0}
.guide-figure img{display:block;width:100%;height:auto;border-radius:8px;border:1px solid var(--line)}
.guide-figure figcaption{margin-top:7px;font-size:13px;line-height:1.45;color:var(--muted)}
.guide-figure-credit{display:block;font-size:12px;opacity:.8}
.guide-table-wrap{overflow-x:auto;margin:14px 0}
.guide-table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.45;background:#151819;border:1px solid var(--line)}
.guide-table th,.guide-table td{padding:8px 11px;text-align:left;vertical-align:top;border-bottom:1px solid #26292a}
.guide-table thead th{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);background:#1c1f20;border-bottom:1px solid var(--line)}
/* the number column shrinks to its numbers, so the names get the width */
.guide-table .num{width:1%}
.guide-table td.num{white-space:nowrap;font-weight:700;color:var(--gold2);font-variant-numeric:tabular-nums}
.guide-flag{margin-left:6px;padding:1px 6px;border:1px solid #5a4930;border-radius:999px;font-size:11px;font-weight:600;color:var(--gold2)}
.guide-refs{list-style:none;padding-left:0}
.guide-refs li{padding-left:2em;text-indent:-2em;margin:9px 0;font-size:14px;line-height:1.5;color:#c9c4ba;overflow-wrap:anywhere}
.guide-index{list-style:none;padding:0;margin:20px 0 0}
.guide-index li{padding:18px 0;border-top:1px solid var(--line)}
.guide-index li:first-child{border-top:0;padding-top:4px}
.guide-index h2{margin:0 0 6px;font-size:21px}
.guide-index h2 a{color:#f0ece5;text-decoration:none}.guide-index h2 a:hover{color:var(--gold2)}
.guide-index p{margin:0 0 6px}

/* V1.59 - compact home search, one-line admin login.
   Home: was five stacked rows (search, three dropdowns, button). Now the search box and its
   button share one row and the three dropdowns share the next. Scoped to .filters-home because
   the admin inbox uses .filters for its own, different search bar. On a phone the three
   dropdowns stack again: at ~110px each, "All categories" and its arrow would not fit. */
.filters-home{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.filters-home .filters-search{grid-column:1 / -1;display:flex;gap:9px;min-width:0}
.filters-home .filters-search input{flex:1;min-width:0}
.filters-home .filters-search .btn{flex:none;white-space:nowrap}
@media(max-width:600px){.filters-home{grid-template-columns:minmax(0,1fr)}}
/* Admin login: username, password, Sign in on one line, the button aligned with the boxes
   rather than the labels. Stacks on a phone. */
.form-inline{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:end}
.form-inline > .btn{padding:0 22px;height:39px;white-space:nowrap}   /* same height as the boxes beside it */
@media(max-width:600px){.form-inline{grid-template-columns:minmax(0,1fr)}}

/* V1.60 - compact footer. It was 377px on a desktop and 705px on a phone, nearly a whole
   iPhone screen, because twelve links stood one per line in narrow columns. Now each group is
   a label and a row of links that wraps, with the site name and blurb beside them on wider
   screens. Nothing removed, only rearranged. These rules come after the V1.5 footer rules and
   their media queries, so they carry their own breakpoint below. */
.footer{margin-top:36px;padding:20px 0 14px}
.footer-cols{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:10px 34px;padding-bottom:14px;align-items:start}
.footer-cols > div:first-child{grid-row:span 2}
.footer-cols > div:first-child strong{margin-bottom:4px}
.footer-cols > div + div{display:grid;grid-template-columns:74px minmax(0,1fr);gap:12px;align-items:baseline}
.footer-cols > div + div strong{margin:0;font-size:13px}
.footer-cols ul{display:flex;flex-wrap:wrap;gap:4px 18px}
.footer-cols li{padding:0}
.footer-base{padding-top:10px}
@media(max-width:700px){
  .footer-cols{grid-template-columns:minmax(0,1fr);gap:12px}
  .footer-cols > div:first-child{grid-row:auto}
  /* fingers, not a mouse: taller tap areas and more room between rows of links */
  .footer-cols ul{gap:6px 20px}
  .footer-cols a{display:inline-block;padding:4px 0}
}

/* V1.61 - third guide. Citations that close a list sit on their own line; deadlines stand out in
   the who-to-tell table; and that table becomes a stack of labelled cards on a phone, because four
   columns of sentences at 340px would leave each one a word or two wide. */
.guide-cites{margin:-4px 0 14px;font-size:.9em}
.guide-table td.deadline{font-weight:700;color:var(--gold2);white-space:nowrap}
.guide-table-stack tbody th{font-weight:700;color:var(--text);white-space:nowrap}
.guide-checklist li{margin:4px 0}
@media(max-width:600px){
  .guide-table-stack thead{display:none}
  .guide-table-stack,.guide-table-stack tbody,.guide-table-stack tr,.guide-table-stack th,.guide-table-stack td{display:block;width:auto}
  .guide-table-stack tr{padding:10px 12px;border-bottom:1px solid var(--line)}
  .guide-table-stack tr:last-child{border-bottom:0}
  .guide-table-stack th,.guide-table-stack td{padding:2px 0;border:0}
  .guide-table-stack tbody th{font-size:15px;color:var(--gold2);margin-bottom:4px;white-space:normal}
  .guide-table-stack td::before{content:attr(data-label) ": ";font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
  .guide-table-stack td.deadline{white-space:normal}
}

/* V1.62 - "get the app" box in the found-something guide. The QR code is our own, generated for
   what3words' official download page and verified by decoding it back, rather than the one in
   their marketing artwork, whose destination we can't vouch for. On a phone the code is pointless
   (the reader is already on the phone), so it's hidden and the link does the job. */
.app-get{display:flex;gap:16px;align-items:center;margin:18px 0;padding:14px 16px;background:#1a1c1d;border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:0 8px 8px 0}
.app-get-qr{flex:none;width:112px;height:112px;border-radius:6px;background:#fff}
.app-get p{margin:0 0 6px}.app-get p:last-child{margin:0}
@media(max-width:600px){.app-get-qr,.app-get-desktop{display:none}.app-get{display:block}}
