/* The 100 — global styles (ported from the design canvas) */

*{ box-sizing:border-box; margin:0; padding:0; }
html,body{ background:#0D0D0D; color:#FFE2C0; font-family:'Poppins',system-ui,sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
::selection{ background:#FFE2C0; color:#0D0D0D; }
body{ font-synthesis:none; -webkit-font-synthesis:none; }
[style*="Forum"]{ font-weight:400 !important; font-synthesis:none !important; }
::-webkit-scrollbar{ width:9px; height:9px; }
::-webkit-scrollbar-track{ background:#0D0D0D; }
::-webkit-scrollbar-thumb{ background:#242424; border-radius:9px; }

button{ font-family:'Poppins',system-ui,sans-serif; }

@keyframes b100-up{ from{ opacity:0; transform:translateY(26px); } to{ opacity:1; transform:translateY(0); } }
@keyframes b100-fade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes b100-tickL{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@keyframes b100-tickR{ from{ transform:translateX(-50%); } to{ transform:translateX(0); } }
@keyframes b100-colUp{ from{ transform:translateY(0); } to{ transform:translateY(-50%); } }
@keyframes b100-blink{ 0%,100%{ opacity:1; } 50%{ opacity:.2; } }
@keyframes b100-flip{ 0%,42%{ transform:rotateY(0deg); } 50%,92%{ transform:rotateY(180deg); } 100%{ transform:rotateY(360deg); } }

/* hover states (the canvas used style-hover attributes; --ac carries the accent color) */
.hv-navlink:hover{ color:#FFE2C0 !important; }
.hv-op75:hover{ opacity:.75; }
.hv-op82:hover{ opacity:.82; }
.hv-op85:hover{ opacity:.85; }
.hv-close:hover{ background:#242424 !important; }
.hv-city:hover{ border-color:var(--ac) !important; transform:translateY(-3px); background:#222 !important; }
.hv-featured:hover{ border-color:rgba(255,226,192,.4) !important; }
.hv-sample:hover{ border-color:var(--ac) !important; transform:translateY(-3px); }
.hv-citycard:hover{ transform:translateY(-6px); border-color:rgba(255,226,192,.4) !important; }
.hv-explore:hover{ border-color:rgba(255,226,192,.5) !important; background:#141414 !important; }
.hv-bg16:hover{ background:#161616 !important; }
.hv-bg14:hover{ background:#141414 !important; }
.hv-slot:hover{ border-color:var(--ac) !important; transform:translateY(-2px); }
.hv-link:hover{ border-color:rgba(255,226,192,.45) !important; opacity:.82; }

input:focus, textarea:focus, select:focus{ border-color:rgba(255,226,192,.5) !important; }

/* responsive collapses for the fixed grids */
@media (max-width:760px){
  .g-profile-hero{ grid-template-columns:1fr !important; }
  .g-profile-hero > div:first-child{ max-width:340px; }
  .g-story{ grid-template-columns:1fr !important; gap:14px !important; }
}
@media (max-width:900px){
  .g-nominate{ grid-template-columns:1fr !important; gap:38px !important; }
}
@media (max-width:560px){
  .g-nominate-row{ grid-template-columns:1fr !important; }
  .g-qrow{ grid-template-columns:1fr !important; gap:10px !important; }
  .track-cols{ grid-template-columns:1fr !important; max-width:420px !important; }
  .track-cols > div:nth-child(n+2){ display:none; }
}
