*{box-sizing:border-box;margin:0;padding:0}

:root{
  --radius:10px;
  --background:oklch(0.301 0.024 156.5);
  --foreground:oklch(0.965 0.014 90);
  --card:oklch(0.352 0.026 157);
  --muted-foreground:oklch(0.79 0.022 120);
  --accent:oklch(0.79 0.075 78);
  --accent-foreground:oklch(0.26 0.022 156.5);
  --border:oklch(0.965 0.014 90 / 18%);
  --font-display:'Cormorant Garamond',Georgia,serif;
  --font-sans:'Jost',ui-sans-serif,system-ui,sans-serif;
}

body{
  background-color:var(--background);
  color:var(--foreground);
  font-family:var(--font-sans);
  min-height:100vh;
  -webkit-text-size-adjust:100%;
}
h1{font-family:var(--font-display)}
a{color:inherit;text-decoration:none}

.link-tile{
  display:flex;
  align-items:center;
  gap:.9rem;
  width:100%;
  padding:1rem 1.15rem;
  border-radius:calc(var(--radius) + 8px);
  border:1px solid var(--border);
  background:color-mix(in oklab,var(--card) 82%,transparent);
  color:var(--foreground);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 26px 60px -30px oklch(0.08 0.01 156 / 0.95);
  transition:transform .26s cubic-bezier(.2,.7,.2,1),box-shadow .26s ease,border-color .26s ease;
  -webkit-tap-highlight-color:transparent;
}
.link-tile:hover,.link-tile:active{
  transform:translateY(-3px);
  border-color:color-mix(in oklab,var(--accent) 55%,transparent);
  box-shadow:0 0 0 1px oklch(0.84 0.07 88 / 0.55),0 0 24px -6px oklch(0.84 0.07 88 / 0.35),0 22px 54px -22px oklch(0.08 0.01 156 / 0.85);
}
.link-tile.featured{border-color:color-mix(in oklab,var(--accent) 70%,transparent);background:var(--accent);color:var(--accent-foreground)}
.link-tile .tx{display:flex;min-width:0;flex-direction:column;text-align:left}
.link-tile .tx b{font-size:.96rem;font-weight:500;letter-spacing:.01em}
.link-tile .tx span{font-size:.75rem;color:var(--muted-foreground);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.link-tile.featured .tx span{color:color-mix(in oklab,var(--accent-foreground) 80%,transparent)}
.link-tile svg.go{margin-left:auto;flex:0 0 auto;width:16px;height:16px;color:var(--muted-foreground);opacity:.7;transition:transform .2s ease}
.link-tile:hover svg.go,.link-tile:active svg.go{transform:translate(2px,-2px)}
.link-tile .num{font-family:var(--font-display);font-size:.72rem;letter-spacing:.2em;color:color-mix(in oklab,var(--accent) 80%,transparent);flex:0 0 auto}
.link-tile.featured .num{color:color-mix(in oklab,var(--accent-foreground) 70%,transparent)}
.link-tile .divider{width:1px;height:1.75rem;flex:0 0 auto;background:color-mix(in oklab,var(--accent) 30%,transparent)}
.link-tile.featured .divider{background:color-mix(in oklab,var(--accent-foreground) 25%,transparent)}

/* ============ SIGNATURE ============ */
.theme-signature{
  --background:oklch(0.16 0.014 156);
  --foreground:oklch(0.97 0.014 95);
  --card:oklch(0.21 0.016 156 / 0.6);
  --muted-foreground:oklch(0.8 0.04 92);
  --accent:oklch(0.84 0.07 88);
  --accent-foreground:oklch(0.16 0.014 156);
  --border:oklch(0.84 0.07 88 / 30%);
  background-color:var(--background);
  color:var(--foreground);
}

/* utils */
.container{margin:0 auto;width:100%;max-width:28rem;padding:0 1.5rem}
.center{display:flex;flex-direction:column;align-items:center;text-align:center}
.bg-fixed{position:absolute;inset:0;overflow:hidden}
.bg-fixed video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.veil{position:absolute;inset:0}

/* ============ MOBILE ============ */
@media (max-width:480px){
  main{padding:1.75rem .9rem !important}
  .container{padding:0 .35rem}
  header img{width:10.5rem !important}
  header p{margin-top:1rem !important;font-size:.66rem !important}
  nav[aria-label="Canais oficiais"]{margin-top:1.25rem !important;gap:.55rem !important}
  .link-tile{padding:.75rem .85rem !important;gap:.7rem !important}
  .link-tile .num{display:none}
  .link-tile .divider{display:none}
  .link-tile .tx b{font-size:.88rem !important}
  .link-tile .tx span{font-size:.68rem !important}
  footer{margin-top:1.5rem !important}
}
@media (max-height:700px) and (max-width:480px){
  main{padding-top:1rem !important;padding-bottom:1rem !important}
  header img{width:9rem !important}
  nav[aria-label="Canais oficiais"]{margin-top:1rem !important;gap:.45rem !important}
  .link-tile{padding:.6rem .8rem !important}
  footer{margin-top:1rem !important}
}