/* Final shared layer, including after page-specific styles. Garden / warm sun. */
:root, [data-theme="dark"] {
  --bg:#101b14; --surface:#19291e; --surface-elevated:#23382a;
  --text:#f3f6e9; --text-dim:#c0cfbb; --accent:#b6db83;
  --accent-strong:#c6ea91; --accent-warm:#ffda70;
  --border:#536950; --border-strong:#829c73; --accent-glow:#9ecb5138;
  --nav-bg:#101b14f5; --nav-bg-scrolled:#101b14;
  --maxw:1060px; --button-bg:#ffda70; --button-text:#203516;
  color-scheme:dark;
}
[data-theme="light"] {
  --bg:#f5f8e9; --surface:#ffffff; --surface-elevated:#eaf1dd;
  --text:#183822; --text-dim:#41573e; --accent:#315e29;
  --accent-strong:#265820; --accent-warm:#765200;
  --border:#809375; --border-strong:#526f41; --accent-glow:#50823326;
  --nav-bg:#f5f8e9f5; --nav-bg-scrolled:#f5f8e9;
  --button-bg:#ffda70; --button-text:#203516;
  color-scheme:light;
}
body { overflow-x:visible; }
[hidden] { display:none !important; }
.wrap { width:100%; }
main, section, article, .panel, .profile-meta, .nav-links, .nav-actions, .nav-account { min-width:0; }
p, h1, h2, h3, .desc, .profile-meta, .hint, .file-info, .tag { overflow-wrap:anywhere; }
.reveal, .reveal.up, .reveal.down, .reveal.left, .reveal.right, .reveal.scale, .reveal.rotate { opacity:1; transform:none; }
/* No scroll-triggered hiding: public text remains readable without JS or observers. */
section.reveal h2::after { transform:scaleX(1); }
body .bg-atmosphere { opacity:.28; }
body .particles { opacity:.3; }
.btn, .btn-primary, .nav-actions > .btn {
  background:var(--button-bg); color:var(--button-text); border:1px solid var(--button-bg);
  box-shadow:none; text-align:center; justify-content:center;
}
.btn-ghost { background:var(--surface); color:var(--text); border:1px solid var(--border); }
.btn:hover { filter:brightness(.98); }
.btn-ghost:hover { color:var(--accent-strong); background:var(--surface-elevated); }
a, button, input, select, textarea { -webkit-tap-highlight-color:transparent; }
button, .btn, input:not([type="checkbox"]), select, .nav-links a, .nav-account-link, .footer-links a { min-height:44px; }
button, .btn { min-width:44px; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, [tabindex]:focus-visible {
  outline:3px solid var(--accent-warm) !important; outline-offset:3px; box-shadow:0 0 0 6px var(--bg);
}
button:disabled { cursor:not-allowed; }
.theme-toggle { height:44px; width:44px; margin:0; flex:none; }
html[data-theme="dark"] .icon-sun { opacity:1; transform:none; }
html[data-theme="dark"] .icon-moon { opacity:0; transform:rotate(-90deg); }
html[data-theme="light"] .icon-sun { opacity:0; transform:rotate(90deg); }
html[data-theme="light"] .icon-moon { opacity:1; transform:none; }
nav.wrap { height:auto; min-height:80px; max-width:1320px; gap:12px; padding:14px 24px; flex-wrap:wrap; }
.wordmark { flex-shrink:0; white-space:nowrap; min-height:44px; }
.nav-links { gap:12px; flex:1 1 540px; flex-wrap:wrap; }
.nav-links a { display:inline-flex; align-items:center; font-size:.88rem; }
.nav-actions { flex-wrap:wrap; gap:8px; }
.nav-account { flex-wrap:wrap; gap:2px; }
.nav-account-link { padding:8px; }
.nav-account-user span { max-width:15ch; overflow:hidden; text-overflow:ellipsis; }
.footer-links { gap:8px 18px; }
.footer-links a { display:inline-flex; align-items:center; }
.footer-legal { color:var(--text-dim); }
.page-hero { padding-top:56px; padding-bottom:30px; }
.page-hero h1 { font-size:clamp(2rem,5vw,3.5rem); line-height:1.1; }
.page-hero p { color:var(--text-dim); }
.eyebrow { color:var(--accent-strong); font-weight:700; text-transform:uppercase; font-size:.78rem; letter-spacing:.08em; }
.hero-status, .status-badge { color:var(--accent-strong); background:var(--surface-elevated); }
.auth-shell { padding:8px 24px 60px; max-width:540px; }
.auth-card, .panel { box-shadow:0 8px 28px #00000008; }
.field .hint, .hint { color:var(--text-dim); font-size:.85rem; line-height:1.6; }
input::placeholder, textarea::placeholder { color:var(--text-dim); opacity:1; }
input[type="file"] { max-width:100%; font-size:.85rem; }
input[type="file"]::file-selector-button { min-height:44px; background:var(--surface-elevated); color:var(--text); border:1px solid var(--border); border-radius:6px; padding:8px; margin-right:8px; }
.field label.btn { display:inline-flex; color:var(--text); }
.form-message.error { color:#ffbebe; }
[data-theme="light"] .form-message.error { color:#992626; }
.form-message.success { color:var(--accent-strong); }
.tag.banned, table.data td.actions button.danger { color:#ffbebe; }
[data-theme="light"] .tag.banned, [data-theme="light"] table.data td.actions button.danger { color:#992626; }
.metric-grid { grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr)); }
.card-grid, .games-grid { grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); }
.hero-preview .preview-card { color:var(--text); }
.game-card::before, .list-row::before, .gallery-tile::before { pointer-events:none; }
.faq-a { max-height:none; opacity:1; }
.nav-ready .faq-a { max-height:0; opacity:0; }
.nav-ready .faq-item.open .faq-a { max-height:none; opacity:1; }
.faq-q { text-align:left; }
.gallery-grid { grid-template-columns:repeat(auto-fill,minmax(min(235px,100%),1fr)); align-items:start; }
.gallery-figure { aspect-ratio:auto; gap:0; display:block; cursor:default; }
.gallery-figure img { width:100%; height:220px; object-fit:cover; display:block; border-radius:0; }
.gallery-tile.gallery-figure:hover { transform:none; }
.gallery-tile.gallery-figure:hover img { transform:none; filter:none; }
.gallery-tile .tile-overlay { position:relative; inset:auto; transform:none; pointer-events:auto; background:var(--surface); color:var(--text); padding:14px; width:100%; }
.gallery-tile .tile-overlay .tile-title { color:var(--text); white-space:normal; }
.gallery-tile .tile-overlay .tile-meta { color:var(--text-dim); font-size:.82rem; }
.gallery-tile .tile-overlay .tile-meta a { display:inline-flex; align-items:center; min-height:44px; text-decoration:underline; color:var(--accent-strong); }
.tile-description { margin:8px 0 0; color:var(--text-dim); white-space:pre-wrap; }
.tile-actions { opacity:1; z-index:2; }
.tile-actions button { width:44px; height:44px; background:var(--surface); color:var(--text); }
.tile-actions button:hover, .tile-actions button.is-liked { color:var(--accent-strong); }
.tile-actions button[data-action="delete"]:hover { color:var(--text); }
.profile-meta .bio { white-space:pre-wrap; }
#profile-status:empty { display:none; }
#avatar-input:focus-visible + label { outline:3px solid var(--accent-warm); outline-offset:3px; }
.profile-header { padding:0; }
.table-scroll { max-width:100%; }
.table-scroll:focus-visible { outline:3px solid var(--accent-strong); }
table.data { min-width:720px; }
.post-feed { display:grid; gap:22px; }
.post-card { padding:24px; border:1px solid var(--border); border-radius:18px; background:var(--surface); overflow:hidden; }
.post-header { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:0; }
.post-author { display:flex; align-items:center; gap:10px; min-width:0; color:var(--accent-strong); font-weight:650; }
.post-author > span:last-child { overflow-wrap:anywhere; min-width:0; }
.post-avatar { width:44px; height:44px; flex:none; display:grid; place-items:center; border-radius:50%; background:var(--surface-elevated); overflow:hidden; }
.post-avatar img { width:44px; height:44px; object-fit:cover; }
.post-date { font-size:.82rem; color:var(--text-dim); }
.post-text { white-space:pre-wrap; margin:20px 0; color:var(--text); line-height:1.8; }
.post-text:empty { display:none; }
.post-text a, .hint a { text-decoration:underline; color:var(--accent-strong); text-underline-offset:3px; }
.post-image { display:block; width:100%; max-height:580px; object-fit:contain; height:auto; border-radius:10px; background:var(--surface-elevated); }
.post-delete { margin-top:18px; }
.compose-shell { max-width:800px; }
.compose-actions { display:flex; gap:12px; flex-wrap:wrap; }
.post-preview { width:auto; max-width:100%; max-height:240px; display:block; margin:12px 0; border-radius:10px; }
.nojs-note { margin:18px auto; color:var(--text-dim); }
.theme-system { border:1px solid var(--border); background:var(--surface); color:var(--text-dim); border-radius:8px; padding:8px; font:inherit; font-size:.78rem; }
/* The canvas palette stays true to the original game; chrome and HUD follow the theme. */
body.corta-hierbas-page { background:var(--bg); color:var(--text); }
.corta-hierbas-page .garden-shell { background:var(--bg); color:var(--text); }
.corta-hierbas-page .hud-card { background:var(--surface); color:var(--text); border-color:var(--border); }
.corta-hierbas-page .stat-value { color:var(--accent-strong); }
.corta-hierbas-page .game-title { text-shadow:none; color:var(--text); }
.corta-hierbas-page .creator-credit { color:var(--text-dim); opacity:1; }
.corta-hierbas-page .gameover-card { background:var(--surface); color:var(--text); }
.corta-hierbas-page .result-item { background:var(--surface-elevated); }
.corta-hierbas-page .result-label, .corta-hierbas-page .result-value { color:var(--text); }
.corta-hierbas-page .result-status { color:var(--accent-warm); }
.corta-hierbas-page .touch-button, .corta-hierbas-page .restart-button { background:var(--button-bg); color:var(--button-text); }
@media(max-width:1150px) {
  nav.wrap { position:relative; }
  .nav-toggle { display:flex; margin-left:auto; order:2; width:44px; height:44px; }
  .nav-links { order:4; flex-basis:100%; display:flex; flex-direction:column; align-items:stretch; gap:0; overflow:visible; }
  .nav-ready .nav-links { display:none; }
  .nav-ready .nav-links.is-open { display:flex; }
  .nav-links a { padding:10px 4px; }
  .nav-actions { order:3; flex-basis:100%; justify-content:flex-start; }
  .nav-links a::after { display:none; }
}
@media(min-width:1151px) { .nav-toggle { display:none; } }
@media(max-width:560px) {
  nav.wrap { padding:12px 16px; gap:8px; }
  .wrap { padding-left:16px; padding-right:16px; }
  .nav-account { width:100%; }
  .nav-account-user { margin-right:auto; }
  .page-hero { padding-top:32px; padding-bottom:24px; }
  .panel, .post-card, .auth-card { padding:18px; border-radius:14px; }
  .hero-title { font-size:clamp(2rem,10vw,3rem); }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .profile-meta { width:100%; }
  .quota-label { flex-wrap:wrap; gap:4px; }
  .game-card { padding:18px; }
  .profile-meta h2 { overflow-wrap:anywhere; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto !important; }
  *, *::before, *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .particles { display:none; }
}
/* Hidden file input must not inherit full field width/minimum control dimensions. */
.field input.visually-hidden { width:1px !important; height:1px !important; min-width:0 !important; min-height:0 !important; padding:0 !important; border:0 !important; }
header.hero.wrap { padding:64px 24px; }
.hero-badge { color:var(--accent-strong); background:var(--surface-elevated); border-color:var(--border); }
.features-grid { grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); }
@media(max-width:560px) { header.hero.wrap { padding:36px 16px; } }
.footer-legal, .game-card .author { opacity:1; }
/* Primary links inside paragraph/hero rules keep dark ink on yellow, in both themes. */
a.btn.btn-primary, .page-hero a.btn.btn-primary, main p a.btn.btn-primary { color:var(--button-text); text-decoration:none; }
/* Shared section spacing must not add 120px of blank space inside the original HUD. */
.corta-hierbas-page .hud-grid { padding:0; border:0; }
.corta-hierbas-page .controls-area { border:0; }
.corta-hierbas-page .garden-shell { min-height:0; }
.corta-hierbas-page .gameover-title { color:var(--text); text-transform:none; letter-spacing:normal; }
.corta-hierbas-page .gameover-title::after { content:none; }
