/* community.css - lovault.app/CommunityProjects (4 Nov 2026): the site's look (site-gaming/gaming.css) for the projects made
   public: maps that can be gone through. */
:root{--bg:#05070b;--ink:#e8edf5;--mute:rgba(214,224,238,.62);--cy:#2ee6f0;--am:#f0b74a;--line:rgba(255,255,255,.1);--panel:rgba(12,16,22,.94)}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:300 16px/1.55 'Segoe UI Light','Segoe UI',-apple-system,BlinkMacSystemFont,'Helvetica Neue',Inter,Roboto,sans-serif;letter-spacing:.04em}
body{min-height:100vh;background:radial-gradient(120% 80% at 50% -10%,#0f2230 0%,#05070b 60%)}
a{color:inherit;text-decoration:none}
header{display:flex;align-items:center;gap:20px;padding:16px max(16px,4vw);border-bottom:1px solid var(--line)}
.mark{display:flex;align-items:center}
.word{font-weight:300;font-size:26px;letter-spacing:.1em;color:#fff;text-shadow:0 0 10px rgba(46,230,240,.55),0 0 30px rgba(46,230,240,.3)}
.mark svg{width:28px;height:28px}
nav{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
nav a{padding:8px 14px;color:var(--mute);font-size:16px;letter-spacing:.1em;transition:color .25s,text-shadow .25s}
nav a:hover{color:#e8edf5}
nav a.on,nav a:active{color:#fff;text-shadow:0 0 8px rgba(46,230,240,.9),0 0 22px rgba(46,230,240,.6)}
.tag{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cy);border:1px solid rgba(46,230,240,.45);border-radius:999px;padding:3px 9px}
main{max-width:1160px;margin:0 auto;padding:36px max(16px,4vw) 80px}
.hero{min-height:38vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px}
.hero h1{margin:0;font-weight:300;font-size:clamp(40px,8vw,96px);letter-spacing:.1em;color:#fff;text-shadow:0 0 18px rgba(46,230,240,.55),0 0 60px rgba(46,230,240,.35)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.card{border-radius:16px;background:rgba(255,255,255,.035);border:1px solid var(--line);padding:18px;display:flex;flex-direction:column;gap:10px;transition:border-color .2s,transform .2s}
.card:hover{border-color:rgba(46,230,240,.55);transform:translateY(-2px)}
.card .art{height:140px;border-radius:12px;background:linear-gradient(135deg,#123142,#0b1520 60%,#2a1530);position:relative;overflow:hidden}
.card .art svg{position:absolute;inset:0;width:100%;height:100%}
.card b{font-size:20px;font-weight:300;letter-spacing:.06em;color:#fff;text-shadow:0 0 12px rgba(46,230,240,.35)}
small,.mute{color:var(--mute)}
.btn{display:inline-block;padding:10px 18px;border-radius:999px;font-weight:300;color:#fff;background:rgba(46,230,240,.14);border:1px solid rgba(46,230,240,.6);cursor:pointer;font:300 15px inherit;letter-spacing:.08em}
.btn.lo{background:none;border-color:var(--line)}
footer{border-top:1px solid var(--line);padding:22px max(16px,4vw);color:var(--mute);font-size:13px;display:flex;gap:16px;flex-wrap:wrap}
/* the map pages */
.mapwrap{position:relative;height:calc(100vh - 74px);min-height:520px}
#map{position:absolute;inset:0;background:#070a0f}
.side{position:absolute;top:12px;left:12px;z-index:500;width:min(360px,calc(100% - 24px));max-height:calc(100% - 24px);overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px;backdrop-filter:blur(8px)}
.side h1{font-size:24px;font-weight:300;margin:0 0 2px;letter-spacing:.1em;color:#fff;text-shadow:0 0 12px rgba(46,230,240,.45)}
.side h2{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);font-weight:400;margin:16px 0 8px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font:300 13px inherit;letter-spacing:.06em;color:var(--ink);background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:999px;padding:5px 11px;cursor:pointer}
.chip.on{background:rgba(46,230,240,.16);border-color:rgba(46,230,240,.6)}
.info{position:absolute;top:12px;right:12px;z-index:500;width:min(380px,calc(100% - 24px));max-height:calc(100% - 24px);overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px;display:none}
.info.on{display:block}
.info h3{margin:0 0 4px;font-size:20px;font-weight:300;letter-spacing:.06em;line-height:1.3}
.info .x{float:right;background:none;border:0;color:var(--mute);font-size:20px;cursor:pointer}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
.stats div{background:rgba(255,255,255,.04);border-radius:10px;padding:8px;text-align:center}
.stats b{display:block;font-size:20px;font-weight:300}.stats small{font-size:11px}
.coord{font:13px ui-monospace,Menlo,monospace;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:8px;padding:3px 8px;cursor:pointer}
.warn{border-left:3px solid var(--am);padding:6px 10px;background:rgba(240,183,74,.08);border-radius:6px;font-size:14px;margin-top:10px}
.legend{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mute)}
.legend i{display:inline-block;width:12px;height:12px;border-radius:50%}
input[type=range]{width:100%;accent-color:var(--cy)}
input[type=search]{width:100%;font:inherit;color:#fff;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;padding:9px 12px}
.leaflet-container{font:inherit}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:#10151d;color:var(--ink)}
.leaflet-control-attribution{background:rgba(5,7,11,.7)!important;color:var(--mute)!important}
.leaflet-control-attribution a{color:var(--cy)!important}
.method{max-width:900px;margin:40px auto;padding:0 max(16px,4vw)}
.method table{width:100%;border-collapse:collapse;font-size:15px;margin:12px 0}
.method th,.method td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.method th{color:var(--mute);font-weight:400}
@media (max-width:700px){.side{position:relative;top:0;left:0;width:100%;max-height:none;border-radius:0}.mapwrap{height:auto}#map{position:relative;height:70vh}.info{position:fixed;top:auto;bottom:0;right:0;left:0;width:100%;max-height:60vh;border-radius:16px 16px 0 0}}
b,strong,h2,h3,h4{font-weight:400}
/* 5 Nov 2026: "have all of the UI of the text be in the same as community from the picture" (Matei): every text in the
   hero's light, spaced letters; the word "community" beside the logo replaces LOVAULT and the pill. */
.soon{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--am);border:1px solid rgba(240,183,74,.5);border-radius:999px;padding:2px 9px;align-self:flex-start}
.empty{text-align:center;color:var(--mute);padding:40px 0}
@media (max-width:560px){header{flex-wrap:wrap;gap:10px}nav{margin-left:0;width:100%}.word{font-size:22px}}
/* 6 Nov 2026: "list the landscapes by elevation project on the same ui as steam ... in the middle with some arrow sliders
   that move pictures of the results. we want interactive maps for landscapes and for internet strenght map" (Matei):
   the showcase - a live map in the middle, the result beside it, arrows and pictures of the results under it. */
.show{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:0;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:16px;overflow:hidden;position:relative;box-shadow:0 0 40px rgba(46,230,240,.06)}
.show .stage{position:relative;min-height:430px;height:100%;background:#070a0f}
.show #smap{position:absolute;inset:0}
.show .side2{padding:20px;display:flex;flex-direction:column;gap:10px;border-left:1px solid var(--line);background:rgba(8,12,18,.85);min-height:430px}
.show .side2 h2{margin:0;font-size:24px;font-weight:300;letter-spacing:.06em;color:#fff;text-shadow:0 0 12px rgba(46,230,240,.4)}
.show .side2 .what{font-size:14px;color:var(--mute)}
.show .side2 .res{margin-top:4px;border-top:1px solid var(--line);padding-top:12px}
.show .side2 .res b{display:block;font-size:17px;color:#fff;letter-spacing:.04em}
.show .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.show .tags span{font-size:12px;letter-spacing:.06em;background:rgba(46,230,240,.08);border:1px solid rgba(46,230,240,.25);border-radius:6px;padding:2px 8px;color:#cfe}
.show .open{margin-top:auto}
.arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:600;width:44px;height:84px;border:0;background:rgba(5,7,11,.55);color:#fff;font:300 34px/1 inherit;cursor:pointer;transition:background .2s,text-shadow .2s}
.arrow:hover{background:rgba(46,230,240,.18);text-shadow:0 0 10px rgba(46,230,240,.9)}
.arrow.l{left:0;border-radius:0 10px 10px 0}.arrow.r{right:0;border-radius:10px 0 0 10px}
.pics{display:flex;gap:10px;margin-top:12px;overflow-x:auto;padding-bottom:6px;scroll-behavior:smooth}
.pic{flex:none;width:150px;cursor:pointer;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:#0b1118;transition:border-color .2s,box-shadow .2s;padding:0;color:inherit;text-align:left;font:inherit}
.pic.on{border-color:rgba(46,230,240,.8);box-shadow:0 0 14px rgba(46,230,240,.35)}
.pic .ph{position:relative;height:90px;overflow:hidden;background:#0d1620}
.pic .ph img{position:absolute;width:256px;height:256px;max-width:none}
.pic .ph i{position:absolute;left:50%;top:50%;width:8px;height:8px;margin:-4px;border-radius:50%;background:#2ee6f0;box-shadow:0 0 8px #2ee6f0}
.pic small{display:block;padding:6px 8px;font-size:12px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dots{display:flex;justify-content:center;gap:8px;margin:14px 0 30px}
.dots button{border:0;background:none;color:var(--mute);font:300 14px inherit;letter-spacing:.1em;padding:6px 10px;cursor:pointer;transition:color .2s,text-shadow .2s}
.dots button.on{color:#fff;text-shadow:0 0 8px rgba(46,230,240,.9),0 0 22px rgba(46,230,240,.6)}
.empty-map{position:absolute;z-index:500;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(8,12,18,.85);border:1px solid var(--line);border-radius:12px;padding:12px 18px;color:var(--mute);font-size:14px;text-align:center}
.more{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:10px 0 12px}
@media (max-width:820px){.show{grid-template-columns:1fr}.show .stage{min-height:340px;height:340px}.show .side2{border-left:0;border-top:1px solid var(--line);min-height:0}}
/* 6 Nov 2026: the projects listed like Steam's new releases, each with its project page, and the listing form */
.rows{display:flex;flex-direction:column;gap:6px}
.row{display:grid;grid-template-columns:230px minmax(0,1fr) auto;gap:16px;align-items:center;background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:6px;overflow:hidden;transition:background .2s,border-color .2s}
.row:hover{background:rgba(46,230,240,.07);border-color:rgba(46,230,240,.35)}
.rimg{height:86px;background:#0b1118;position:relative;overflow:hidden}
.rimg svg{width:100%;height:100%;display:block}
.rtxt{padding:8px 0;min-width:0}
.rtxt b{display:block;font-size:18px;color:#fff;letter-spacing:.04em}
.rtags{font-size:13px;color:var(--mute);margin-top:2px}
.rdesc{font-size:13px;color:#c8d2de;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rmeta{font-size:12px;color:var(--mute);margin-top:4px}
.roff{padding-right:14px}
.offer{display:inline-block;font-size:13px;letter-spacing:.06em;padding:6px 12px;border-radius:4px;white-space:nowrap}
.offer.prev{background:rgba(255,255,255,.06);color:#c8d2de}
.offer.free{background:rgba(46,230,240,.16);color:#bff6fa;box-shadow:inset 0 0 0 1px rgba(46,230,240,.4)}
.offer.sale{background:rgba(164,208,7,.18);color:#d6f07a;box-shadow:inset 0 0 0 1px rgba(164,208,7,.45)}
.pin{position:absolute;left:50%;top:50%;width:10px;height:10px;margin:-5px;border-radius:50%;background:#2ee6f0;box-shadow:0 0 10px #2ee6f0}
.listyours{margin-top:18px}
.ppage .pbanner{height:300px;border-radius:12px;overflow:hidden;position:relative;background:#0b1118;border:1px solid var(--line)}
.ppage .pbanner svg{width:100%;height:100%;display:block}
.pbody{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;margin-top:22px}
.pmain h1{margin:0 0 6px;font-weight:300;font-size:32px;letter-spacing:.06em;color:#fff;text-shadow:0 0 14px rgba(46,230,240,.4)}
.pmain p{color:#c8d2de;line-height:1.7}
.pside{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:12px;padding:16px;align-self:start}
.pkv{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line);font-size:14px}
.pkv span{color:var(--mute)}.pkv b{font-weight:400;color:#fff;text-align:right}
.pacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.listform{max-width:720px}
.listform h1{font-weight:300;font-size:32px;letter-spacing:.06em;color:#fff;text-shadow:0 0 14px rgba(46,230,240,.4);margin:0 0 6px}
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}
.offers label{border:1px solid var(--line);border-radius:10px;padding:12px;cursor:pointer;display:flex;flex-direction:column;gap:4px}
.offers label:has(input:checked){border-color:rgba(46,230,240,.6);box-shadow:0 0 14px rgba(46,230,240,.2)}
.offers input{accent-color:var(--cy)}.offers span{font-size:13px;color:var(--mute)}
#lf{display:flex;flex-direction:column;gap:12px}
#lf label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--mute)}
#lf input,#lf textarea{font:inherit;color:#fff;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;padding:9px 12px}
#lf .btn{align-self:flex-start}
@media (max-width:700px){.row{grid-template-columns:120px minmax(0,1fr)}.rimg{height:100%;min-height:80px}.roff{grid-column:2;padding:0 0 10px}.pbody{grid-template-columns:1fr}.offers{grid-template-columns:1fr}.ppage .pbanner{height:200px}}
#lf label[hidden]{display:none}
/* 6 Nov 2026: live projects - the LIVE mark, the dining menus */
.livedot{display:inline-block;font-size:11px;letter-spacing:.14em;color:#ff5f7e;border:1px solid rgba(255,95,126,.5);border-radius:4px;padding:1px 6px;vertical-align:middle;margin-left:6px;text-shadow:0 0 8px rgba(255,95,126,.6);animation:lvlive 2s ease-in-out infinite}
@keyframes lvlive{50%{opacity:.55}}
.dining .dhead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.dining h1{font-weight:300;font-size:32px;letter-spacing:.06em;color:#fff;text-shadow:0 0 14px rgba(46,230,240,.4);margin:0}
.dbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:18px 0 10px}
.dbar input{flex:1;min-width:200px;font:inherit;color:#fff;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;padding:9px 12px}
.halls,.meals{display:flex;gap:4px;flex-wrap:wrap}
.halls button,.meals button{border:0;background:none;color:var(--mute);font:300 16px inherit;letter-spacing:.08em;padding:8px 12px;cursor:pointer;transition:color .2s,text-shadow .2s}
.halls button.on,.meals button.on{color:#fff;text-shadow:0 0 8px rgba(46,230,240,.9),0 0 22px rgba(46,230,240,.6)}
.meals{border-bottom:1px solid var(--line);margin-bottom:10px}
.diets{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.stations{columns:2 360px;column-gap:18px}
.station{break-inside:avoid;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.station h3{margin:0 0 6px;font-weight:300;font-size:17px;letter-spacing:.08em;color:#fff}
.dish{border-top:1px solid rgba(255,255,255,.05)}
.dish summary{list-style:none;cursor:pointer;display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:7px 0}
.dish summary::-webkit-details-marker{display:none}
.dn{color:#e8edf5;margin-right:auto}
.dt{font-size:11px;letter-spacing:.06em;color:#bff6fa;background:rgba(46,230,240,.1);border-radius:4px;padding:1px 6px}
.cal,.hall{font-size:12px;color:var(--mute)}
.dinfo{font-size:13px;color:var(--mute);padding:0 0 10px;display:flex;flex-wrap:wrap;gap:4px 14px}
.dinfo div{flex-basis:100%}
.hit small{color:var(--mute);font-size:12px}
.small{font-size:13px;margin-top:24px}
/* the Eduroam Internet Map: the colour bar like a weather map's, the building's floors */
.heatbar{position:absolute;top:12px;left:12px;right:12px;z-index:600;max-width:640px;margin:0 auto;background:rgba(8,12,18,.86);border:1px solid var(--line);border-radius:14px;padding:10px 14px;backdrop-filter:blur(6px)}
.hb-title{font-size:17px;letter-spacing:.06em;color:#fff;margin-bottom:6px}
.hb-scale{height:10px;border-radius:6px}
.hb-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--mute);margin-top:3px}
.hb-row{display:flex;gap:6px;align-items:center;margin-top:8px}.hb-n{margin-left:auto;font-size:12px}
.heat{pointer-events:none}
.hint{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);z-index:600;background:rgba(8,12,18,.86);border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:13px;color:var(--mute);white-space:nowrap}
.bpop .leaflet-popup-content-wrapper{background:rgba(10,14,20,.95);color:var(--ink);border:1px solid var(--line)}
.bcard b{display:block;font-size:16px;font-weight:400;color:#fff;margin-bottom:8px}
.floors{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}
.floors button{min-width:30px;border:1px solid var(--line);background:none;color:var(--mute);border-radius:6px;padding:3px 6px;cursor:pointer;font:300 13px inherit}
.floors button.has{color:#fff;border-color:rgba(46,230,240,.35)}
.floors button.on{color:#fff;background:rgba(46,230,240,.18);border-color:rgba(46,230,240,.7);text-shadow:0 0 6px rgba(46,230,240,.8)}
.bstat span{font-size:20px}.bstat small{display:block;color:var(--mute);font-size:12px;margin-top:2px}
@media (max-width:700px){.hint{white-space:normal;width:90%;text-align:center}}
/* 6 Nov 2026: "add a featured text on the top left of the landscapes by elevation map" (Matei) */
.featured{position:absolute;top:14px;left:14px;z-index:650;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:#fff;background:rgba(5,7,11,.6);border:1px solid rgba(46,230,240,.45);border-radius:6px;padding:5px 12px;text-shadow:0 0 8px rgba(46,230,240,.9);pointer-events:none;backdrop-filter:blur(4px)}
.pics{scrollbar-width:thin;scrollbar-color:rgba(46,230,240,.35) transparent}
.pics::-webkit-scrollbar{height:6px}.pics::-webkit-scrollbar-track{background:transparent}
.pics::-webkit-scrollbar-thumb{background:rgba(46,230,240,.3);border-radius:3px}
/* the satellite / map switch (maptoggle.js) */
.basesw{display:flex;background:rgba(5,7,11,.72);border:1px solid var(--line);border-radius:999px;padding:3px;backdrop-filter:blur(4px)}
.basesw button{border:0;background:none;color:var(--mute);font:300 13px Inter,'Segoe UI',sans-serif;letter-spacing:.08em;padding:5px 12px;border-radius:999px;cursor:pointer}
.basesw button.on{color:#fff;background:rgba(46,230,240,.16);text-shadow:0 0 6px rgba(46,230,240,.9)}
#live{margin-top:34px}
/* 6 Nov 2026: "remove apps from here / change projects to tools / add an upload butto" (Matei): the logo alone on the left;
   Upload, the way to list a tool, at the end of the tabs. */
nav a.acct{display:inline-flex;align-items:center;margin-left:6px;color:var(--cy);border:1px solid rgba(46,230,240,.45);border-radius:999px;padding:7px 16px}
nav a.acct:hover,nav a.acct.on{color:#fff;background:rgba(46,230,240,.12);text-shadow:0 0 8px rgba(46,230,240,.9)}
nav a.up{display:inline-flex;align-items:center;gap:7px;color:var(--cy);border:1px solid rgba(46,230,240,.45);border-radius:999px;padding:7px 15px;margin-left:6px}
nav a.up svg{width:15px;height:15px}
nav a.up:hover,nav a.up.on{color:#fff;background:rgba(46,230,240,.12);text-shadow:0 0 8px rgba(46,230,240,.9)}

/* 7 Nov 2026: Data verification on the World Landscape Finder */
.verify .vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin-top:14px}
.verify .vcard{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column}
.verify .vcard img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.verify .vcard b{padding:10px 12px 2px;color:#fff;font-weight:500}
.verify .vcard small{padding:0 12px 12px;color:var(--mute);font-size:13px}

/* 7 Nov 2026: the World Landscape Finder as a tool */
.side.lt{padding:18px 18px 12px;width:min(380px,calc(100% - 24px))}
.lt-head{display:flex;align-items:center;gap:10px;justify-content:space-between}
.side.lt h1{font-size:19px;letter-spacing:.04em;white-space:nowrap}
.lt-paid{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#f0b74a;border:1px solid rgba(240,183,74,.5);border-radius:6px;padding:3px 7px;white-space:nowrap}
.lt-paid.lt-free{color:#3dd68c;border-color:rgba(61,214,140,.5)}   /* 6 Nov 2026: free to use, new maps cost */
.lt-seg{display:flex;gap:4px;margin:12px 0 4px;padding:3px;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px}
.lt-seg .chip{flex:1;border:0;border-radius:8px;text-align:center;padding:7px 8px;background:none}
.lt-seg .chip.on{background:rgba(46,230,240,.16);box-shadow:inset 0 0 0 1px rgba(46,230,240,.5)}
.lt-count{display:flex;align-items:baseline;gap:8px;margin:14px 0 4px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.lt-count b{font-size:30px;font-weight:300;color:#fff;font-variant-numeric:tabular-nums}
.lt-count span{color:var(--mute);font-size:13px;flex:1}
.lt-reset{font:13px inherit;color:var(--cy);background:none;border:0;cursor:pointer;padding:4px}
.lt-f{padding:12px 0;border-bottom:1px solid var(--line)}
.side.lt .lt-f h2{margin:0 0 9px;display:flex;justify-content:space-between;align-items:baseline}
.lt-v{font-size:13px;letter-spacing:.02em;text-transform:none;color:#fff}
.lt-hint{margin:6px 0 0;font-size:12px;color:var(--mute)}
/* 7 Nov 2026: the new search of the World Landscape Finder */
.side.lt [hidden],.lt-new [hidden]{display:none!important}
.lt-new{border-bottom:0}
.lt-lab{display:block;margin:12px 0 6px;font-size:12px;letter-spacing:.08em;color:var(--mute)}
.lt-new input[type=search],.lt-new input[type=number]{width:100%;box-sizing:border-box;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--ink);font:300 15px inherit}
.lt-new .chip.on{border-color:#2ee6f0;color:#fff}
.lt-f input[type=range]{width:100%;accent-color:#2ee6f0}
.lt-dual{position:relative;height:22px}
.lt-dual::before{content:'';position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-2px;border-radius:2px;background:rgba(255,255,255,.18)}
#routes .chip{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lt-dual input{position:absolute;inset:0;width:100%;pointer-events:none;background:none;-webkit-appearance:none;appearance:none}
.lt-dual input::-webkit-slider-thumb{pointer-events:auto}
.lt-dual input::-moz-range-thumb{pointer-events:auto}
.lt-res{list-style:none;margin:0;padding:0;max-height:240px;overflow:auto}
.lt-res li button{display:block;width:100%;text-align:left;background:none;border:0;border-radius:8px;padding:7px 8px;color:var(--ink);cursor:pointer}
.lt-res li button:hover{background:rgba(255,255,255,.05)}
.lt-res .n{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lt-res .d{display:block;font-size:12px;color:var(--mute)}
.lt-none{color:var(--mute);font-size:13px;padding:6px 8px}
.lt-foot{display:flex;gap:14px;margin:12px 0 0;font-size:12px}
.lt-foot a{color:var(--cy)}
.vtab{width:100%;margin:12px 0 18px}
.vtab tbody tr{cursor:pointer}
.vtab .v-ok,.vcard .v-ok{color:#3ddc84}
.vtab .v-no,.vcard .v-no{color:var(--mute)}
.roff .use{display:inline-block;font-size:13px;letter-spacing:.06em;color:#04161a;background:#2ee6f0;border-radius:999px;padding:8px 16px;cursor:pointer;white-space:nowrap}
.roff .use:hover{filter:brightness(1.1)}
.cost{display:block;margin-top:6px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);text-align:center}
.cost.paid{color:#f0b74a}
.pacts .cost{display:inline-block;margin:0 0 0 8px}
.me-btn{font:13px inherit;letter-spacing:.04em;color:#e8eef3;background:rgba(10,14,20,.9);border:1px solid var(--line);border-radius:999px;padding:9px 14px;cursor:pointer;margin-bottom:8px}
.me-btn.on{border-color:#4f9cff;color:#cfe3ff}
.edu-box{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.edu-list{background:rgba(10,14,20,.95);border:1px solid var(--line);border-radius:12px;padding:6px;max-height:50vh;overflow:auto}
.edu-it{display:block;width:100%;text-align:left;font:13px inherit;color:var(--ink);background:none;border:0;border-radius:8px;padding:7px 10px;cursor:pointer}
.edu-it:hover{background:rgba(255,255,255,.06)}
/* 8 Nov 2026: the search in the header and the filters on the left of a list (filters.js) */
header .hsearch{flex:1 1 auto;max-width:460px;margin:0 28px;height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:#fff;font:inherit;font-size:14px;letter-spacing:.02em}
header .hsearch:focus{outline:none;border-color:rgba(46,230,240,.55)}
.lvf-wrap{display:grid;grid-template-columns:210px minmax(0,1fr);gap:24px;align-items:start}
.lvf-side{position:sticky;top:16px;display:flex;flex-direction:column;gap:18px;padding:16px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025)}
.lvf-g{display:flex;flex-direction:column;gap:6px}
.lvf-h{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-bottom:2px}
.lvf-r{display:flex;align-items:center;gap:8px;font-size:14px;color:#dfe6ee;cursor:pointer}
.lvf-r input{accent-color:#2ee6f0;margin:0}
.lvf-s{display:flex;flex-direction:column;gap:6px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.lvf-s select{height:36px;padding:0 10px;border-radius:8px;border:1px solid var(--line);background:#0c1118;color:#fff;font:inherit;font-size:14px;letter-spacing:0;text-transform:none}
.lvf-price{display:flex;flex-direction:column;gap:6px;font-size:14px;color:#dfe6ee}
.lvf-price input{accent-color:#2ee6f0;width:100%}
.lvf-n{font-size:12px;color:var(--mute)}
@media (max-width:820px){.lvf-wrap{grid-template-columns:1fr}.lvf-side{position:static}header .hsearch{margin:0 10px;max-width:none;min-width:0}}