/* World Engine, 2026-10: shared modern layer for /projects, the community page and 404.
   Original black / gold / silver; homepage top bar; glass panels, pills, rounded corners.
   Pages opt in with body.we-modern. The installed client's community view is excluded. */
@font-face{font-family:"Archivo";src:url("/community/fonts/archivo-latin.woff2") format("woff2");font-weight:400 900;font-stretch:62% 125%;font-display:swap}
.we-modern{
  --m-gold:linear-gradient(145deg,#fff1ad 0%,#e4ba4d 48%,#bb831f 100%);
  --m-silver:linear-gradient(145deg,#ffffff 0%,#dbe1e3 40%,#9aa3a6 100%);
  --m-wide:"Archivo",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --m-glass:rgba(255,255,255,.045);--m-line:rgba(255,255,255,.09);--m-r-lg:22px;--m-r-md:14px;
  color:#e7e9ea;font-family:var(--m-wide)
}
body.we-modern:not(.we-community-desktop){
  background:radial-gradient(1100px 650px at 75% -10%,rgba(228,190,98,.16),transparent 60%),radial-gradient(800px 500px at 0% 40%,rgba(228,190,98,.06),transparent 60%),#000 fixed!important
}

/* ---------- top bar (same as the homepage) ---------- */
.we-modern .we-site-header{position:sticky;top:0;z-index:30;background:rgba(0,0,0,.55)!important;backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border:0!important;box-shadow:none!important}
.we-modern .we-site-header::before,.we-modern .we-site-header::after{display:none!important}
.we-modern .we-site-header .topbar-inner{max-width:none;min-height:0;padding:14px clamp(16px,3.2vw,48px);gap:clamp(14px,2.4vw,34px)}
.we-modern .we-site-header .brand img,.we-modern .we-site-header .we-brand-studio,.we-modern .we-site-header .brand-dot{display:none}
.we-modern .we-site-header .we-brand-name{display:flex;align-items:center;gap:10px;font:900 15px/1 var(--m-wide);font-variation-settings:"wdth" 125;letter-spacing:-.01em;color:#fff}
.we-modern .we-site-header .we-brand-name::before{content:"";width:14px;height:14px;border-radius:50%;background:var(--m-gold)}
.we-modern .we-site-header .arcade-nav{gap:clamp(14px,2.4vw,34px)}
.we-modern .we-site-header .arcade-nav a,.we-modern .we-site-header .account-button{position:relative;padding:0;font:600 15px/1.2 var(--m-wide)!important;font-variation-settings:"wdth" 62!important;text-transform:uppercase;letter-spacing:.06em;color:#fff!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.we-modern .we-site-header .arcade-nav a::after,.we-modern .we-site-header .account-button::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:2px;background:currentColor;transition:right .25s}
.we-modern .we-site-header .arcade-nav a:hover::after,.we-modern .we-site-header .account-button:hover::after{right:0}
.we-modern .we-site-header .arcade-nav a:hover,.we-modern .we-site-header .account-button:hover{color:#f2ce7c!important}

/* ---------- shared pieces ---------- */
.we-modern ::selection{background:#e4be62;color:#000}
.we-modern :focus-visible{outline:2px solid #f2ce7c;outline-offset:3px}
.we-modern .eyebrow{font:600 12px/1 var(--m-wide);letter-spacing:.22em;text-transform:uppercase;color:#e4be62}
.we-modern h1{font:900 clamp(44px,6vw,88px)/.9 var(--m-wide);font-variation-settings:"wdth" 125;text-transform:uppercase;letter-spacing:-.02em;background:var(--m-silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.we-modern input,.we-modern select{border:0;border-radius:0;background:var(--m-glass);box-shadow:0 0 0 1px var(--m-line) inset;color:#f5f5f2;padding:11px 18px}
.we-modern input:focus,.we-modern select:focus{box-shadow:0 0 0 1px rgba(228,190,98,.6) inset;outline:none}
.we-modern footer{border-top:1px solid rgba(255,255,255,.06)}

/* ---------- /projects ---------- */
.we-modern main{max-width:1240px}
.we-modern .page-heading{align-items:flex-end;margin-bottom:40px}
.we-modern .page-heading p{font:500 13px var(--m-wide);color:#8f969c}
.we-modern .filters{border:0;padding:0 0 10px}
.we-modern .tabs{gap:6px;padding:5px;border-radius:0;background:var(--m-glass);box-shadow:0 0 0 1px var(--m-line) inset}
.we-modern .tabs button{border-radius:0;font:600 13px var(--m-wide);padding:9px 18px;color:#9ba3aa}
.we-modern .tabs button[aria-pressed=true]{background:var(--m-gold);color:#120e05}
.we-modern .legend{font:500 11px var(--m-wide);letter-spacing:.04em}
.we-modern .legend i{border-radius:0;width:9px;height:9px}
#project-list:has(.project-row){display:grid;gap:12px}
.we-modern .project-row{grid-template-columns:150px minmax(0,1fr) 140px;padding:16px;border:0;border-radius:0;background:var(--m-glass);box-shadow:0 0 0 1px var(--m-line) inset;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.we-modern .project-row:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(228,190,98,.45) inset,0 24px 60px rgba(0,0,0,.5)}
.we-modern .project-art{height:94px;border-radius:0;overflow:hidden}
.we-modern .project-art img{filter:none;image-rendering:pixelated}
.we-modern .project-title h2{font:800 19px/1.2 var(--m-wide);font-variation-settings:"wdth" 110}
.we-modern .status{font:600 11px var(--m-wide);letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;border-radius:0;background:rgba(228,190,98,.1);color:#f2ce7c}
.we-modern .status.next{background:rgba(255,255,255,.06);color:#aab2b8}
.we-modern .composition,.we-modern .support-bar{border-radius:0;overflow:hidden;height:8px}
.we-modern .composition span{border-right:0}
.we-modern .project-meta{font:500 11.5px var(--m-wide);color:#7d858c}
.we-modern .play-action{border-radius:0;padding:11px 20px;font:800 13px var(--m-wide);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 8px 30px rgba(228,190,98,.25)}
.we-modern .map-action{border-radius:0;font:600 12px var(--m-wide)}
.we-modern .map-action:hover{background:var(--m-glass)}
.we-modern .vote{border:0;border-radius:0;background:var(--m-glass);box-shadow:0 0 0 1px var(--m-line) inset;font:700 14px var(--m-wide)}
.we-modern .suggest-section{border:0;margin-top:56px;padding:30px 32px;border-radius:0;background:linear-gradient(120deg,rgba(255,255,255,.06),rgba(255,255,255,.015));box-shadow:0 0 0 1px var(--m-line) inset}
.we-modern .suggest-section h2{font:900 clamp(22px,2.4vw,32px)/1 var(--m-wide);font-variation-settings:"wdth" 125;text-transform:uppercase;background:var(--m-silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.we-modern .suggest-section button{border:0;border-radius:0;background:var(--m-gold);color:#120e05;font:800 13px var(--m-wide);padding:11px 20px}
.we-modern dialog{border:0;border-radius:0;background:rgba(10,12,14,.92);backdrop-filter:blur(24px);box-shadow:0 0 0 1px var(--m-line) inset,0 40px 120px rgba(0,0,0,.7)}
.we-modern dialog .detail-heading h2{font:900 clamp(26px,3vw,40px)/1 var(--m-wide);font-variation-settings:"wdth" 125;text-transform:uppercase;background:var(--m-silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.we-modern dialog .detail-heading>button{border:0;width:44px;height:44px;padding:0;background:var(--m-glass);box-shadow:0 0 0 1px var(--m-line) inset}
.we-modern .map-heading{border-top:1px solid rgba(255,255,255,.06)}
.we-modern #build-map{border-radius:0;overflow:hidden}
@media(max-width:720px){.we-modern .project-row{grid-template-columns:1fr}.we-modern .project-art{height:150px}}

/* ---------- community page (browser only; the desktop client keeps its look) ---------- */
body.we-community-standalone.we-modern:not(.we-community-desktop) #we-community{font-family:var(--m-wide)}
body.we-community-standalone.we-modern:not(.we-community-desktop) #we-community button,
body.we-community-standalone.we-modern:not(.we-community-desktop) #we-community textarea,
body.we-community-standalone.we-modern:not(.we-community-desktop) #we-community input{border:0!important;border-radius:0!important;background:var(--m-glass)!important;box-shadow:0 0 0 1px var(--m-line) inset}
body.we-community-standalone.we-modern:not(.we-community-desktop) #we-community .we-send,
body.we-community-standalone.we-modern:not(.we-community-desktop) #we-community button[aria-expanded=true]{background:var(--m-gold)!important;color:#120e05!important;border-radius:0!important}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-panel,
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-dock{background:transparent!important;border:0!important;box-shadow:none!important}

/* ---------- 404 ---------- */
.we-404{min-height:calc(100vh - 60px);display:grid;place-items:center;text-align:center;padding:40px 20px}
.we-404 h1{font-size:clamp(90px,22vw,320px);margin:0;line-height:.8}
.we-404 p{margin:18px 0 30px;color:#8f969c;font-size:17px}
.we-404 .go{display:inline-flex;gap:12px;align-items:center;padding:16px 30px;border-radius:0;background:var(--m-gold);color:#120e05;font:900 15px var(--m-wide);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;box-shadow:0 12px 40px rgba(228,190,98,.3)}

/* community page layout: centered column, pill switch, glass messages */
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-dock{left:50%!important;right:auto!important;top:18px!important;translate:-50% 0;width:min(420px,calc(100vw - 32px));height:auto!important;padding:5px;gap:4px;border-radius:0!important;background:var(--m-glass)!important;box-shadow:0 0 0 1px var(--m-line) inset!important;backdrop-filter:blur(18px)}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-dock button{border-radius:0!important;box-shadow:none!important;background:transparent!important;padding:11px 18px!important;font-weight:600}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-dock button+button{border-left:0!important}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-dock button[aria-expanded=true]{background:var(--m-gold)!important;color:#120e05!important}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-panel{inset:82px 0 0!important;margin:0 auto;width:min(760px,calc(100vw - 32px))!important;max-width:none}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-head{background:none!important;border:0!important;padding:18px 4px 14px}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-head strong{font:900 clamp(26px,3vw,40px)/1 var(--m-wide);font-variation-settings:"wdth" 125;text-transform:uppercase;background:var(--m-silver);-webkit-background-clip:text;background-clip:text;color:transparent}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-list{padding:0 4px}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-list>*{background:var(--m-glass);box-shadow:0 0 0 1px var(--m-line) inset;border-radius:0;padding:12px 16px;margin:0 0 10px;border:0}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-list>p:only-child{background:none;box-shadow:none;color:#8f969c}
body.we-community-standalone.we-modern:not(.we-community-desktop) .we-community-form{border-top:0;padding:14px 4px 22px}

/* ---------- sharp pass: no rounded corners; cut controls, cut panels, viewfinder brackets ---------- */
.we-modern{--cut:10px;--cut-lg:22px;
  --brackets:linear-gradient(#e4be62,#e4be62) top left/18px 2px,linear-gradient(#e4be62,#e4be62) top left/2px 18px,
    linear-gradient(#e4be62,#e4be62) top right/18px 2px,linear-gradient(#e4be62,#e4be62) top right/2px 18px,
    linear-gradient(#e4be62,#e4be62) bottom left/18px 2px,linear-gradient(#e4be62,#e4be62) bottom left/2px 18px,
    linear-gradient(#e4be62,#e4be62) bottom right/18px 2px,linear-gradient(#e4be62,#e4be62) bottom right/2px 18px}
body.we-modern:not(.we-community-desktop) *,
body.we-modern:not(.we-community-desktop) *::before,
body.we-modern:not(.we-community-desktop) *::after{border-radius:0!important}
.we-modern .we-site-header .we-brand-name::before{border-radius:50%!important}
.we-modern .project-row{position:relative}
.we-modern .project-row::after{content:"";position:absolute;inset:6px;pointer-events:none;background:var(--brackets) no-repeat;opacity:0;transform:scale(1.01);transition:opacity .25s,transform .3s}
.we-modern .project-row:hover::after{opacity:1;transform:none}
.we-modern .project-row:hover{box-shadow:0 0 0 1px rgba(255,255,255,.12) inset}

/* edges, final: square, hairlines, one cut corner on gold calls to action, brackets on hover */
body.we-modern:not(.we-community-desktop) :is(.play-action,.suggest-section button,.go,.tabs button[aria-pressed=true],#we-community .we-send){clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.we-modern .play-action,.we-modern .go{box-shadow:none}
body.we-modern:not(.we-community-desktop) :is(input,select){background:transparent;box-shadow:none;border-bottom:1px solid rgba(255,255,255,.2);padding-left:2px}
body.we-modern:not(.we-community-desktop) :is(input,select):focus{border-bottom-color:#e4be62;box-shadow:none}
.we-modern .tabs{background:none;box-shadow:none;padding:0;gap:2px}
.we-modern .project-row::after{background-repeat:no-repeat}
