/* ArcheAge World · beta — site layer on top of kit tokens.css + base.css.
   Only what the kit does not cover: real content (articles, class guides, legal),
   real Traits data (skill icons, budget/name, device/controls, modals),
   ranking/build view, i18n font fallbacks. Generated into /beta/css/aw-site.css
   (+ the production modal/combo rules appended by build_beta.py). */

/* ---- system-font fallbacks for non-Latin scripts (kit woff2 are Latin-only) ---- */
:root:lang(ko) { --aw-font-display: "Cinzel", "Noto Serif CJK KR", "Noto Serif KR", "Nanum Myeongjo", "AppleMyungjo", "Batang", "Apple SD Gothic Neo", "Malgun Gothic", serif;
  --aw-font-ui: "EB Garamond", "Noto Serif CJK KR", "Noto Serif KR", "Nanum Myeongjo", "AppleMyungjo", "Batang", "Apple SD Gothic Neo", "Malgun Gothic", serif;
  --aw-font-body: "Inter", "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans CJK KR", "Noto Sans KR", "Nanum Gothic", system-ui, sans-serif; }
:root:lang(ja) { --aw-font-display: "Cinzel", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "Noto Serif CJK JP", "Noto Serif JP", "MS PMincho", serif;
  --aw-font-ui: "EB Garamond", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "Noto Serif CJK JP", "Noto Serif JP", "MS PMincho", serif;
  --aw-font-body: "Inter", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", "Noto Sans CJK JP", "Noto Sans JP", system-ui, sans-serif; }
:root:lang(ru) { --aw-font-display: "Cinzel", "Georgia", "Times New Roman", "PT Serif", "Noto Serif", serif;
  --aw-font-ui: "EB Garamond", "Georgia", "Times New Roman", "PT Serif", "Noto Serif", serif;
  --aw-font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "PT Sans", Arial, sans-serif; }
/* Cinzel has no Cyrillic/CJK glyphs; uppercase serif display text reads badly in fallback */
:root:lang(ko) .aw-h1, :root:lang(ja) .aw-h1, :root:lang(ru) .aw-h1 { letter-spacing: 0; }

/* ---- beta: untranslated placeholders (visible only in beta builds) ---- */
.aw-beta [data-todo-i18n] { outline: 1px dashed rgba(226,162,76,.55); outline-offset: 6px; position: relative; }
.aw-beta [data-todo-i18n]::before { content: "TODO " attr(data-todo-i18n); position: absolute; top: -18px; right: 0; font: 600 10px/1 var(--aw-font-body);
  letter-spacing: .08em; color: var(--aw-keyword); background: rgba(0,0,0,.6); padding: 3px 5px; border-radius: 2px; }
.aw-beta-flag { position: fixed; right: 0; top: 50%; transform: translateY(-50%); writing-mode: vertical-rl; border-radius: 2px 0 0 2px; z-index: 9999; font: 700 10px/1 var(--aw-font-body); letter-spacing: .14em; color: var(--aw-cream-ink);
  background: var(--aw-keyword); padding: 6px 3px; pointer-events: none; opacity: .8; }

/* ---- chrome ---- */
.aw-brand { text-decoration: none; }
.aw-legend--site .aw-legend__note a { color: var(--aw-ink-2); }
.aw-langlinks { display: flex; flex-wrap: wrap; gap: 4px 12px; font: 400 var(--aw-fs-sm)/1.4 var(--aw-font-body); color: var(--aw-ink-muted); margin: 0; padding: 0; list-style: none; }
.aw-langlinks a { color: var(--aw-ink-2); text-decoration: none; }
.aw-langlinks a:hover, .aw-langlinks a[aria-current] { color: var(--aw-ink-hi); }
.aw-legend--site { flex-wrap: wrap; }
.aw-legend__foot { flex: 1 0 100%; display: flex; justify-content: space-between; align-items: center; gap: 8px 24px; flex-wrap: wrap; border-top: 1px solid var(--aw-line-soft); padding-top: 10px; margin-top: 4px; }

/* ---- articles / guides / legal ---- */
.aw-prose a { color: var(--aw-ink-hi); text-decoration-color: rgba(238,232,218,.4); text-underline-offset: 3px; }
.aw-prose a:hover { text-decoration-color: currentColor; }
.aw-prose img, .aw-prose picture img { width: 100%; height: auto; border: var(--aw-border); border-radius: var(--aw-r-xs); margin: 1.4em 0; }
.aw-prose img.portrait { max-width: 520px; margin-inline: auto; }
.aw-prose .q { font-family: var(--aw-font-ui); font-size: 1.1875rem; line-height: 1.4; color: var(--aw-ink-hi); margin-top: 1.8em; }
.aw-prose ul, .aw-prose ol { padding-left: 1.3em; }
.aw-prose li + li { margin-top: .35em; }
.aw-prose .src, .aw-prose .aw-src { font-size: var(--aw-fs-sm); line-height: 1.6; color: var(--aw-ink-muted); border-top: 1px solid var(--aw-line-soft); padding-top: 14px; margin-top: 2em; word-break: break-word; }
.aw-prose .aw-summary { border: var(--aw-border); background: rgba(0,0,0,.25); border-radius: var(--aw-r-xs); padding: 14px 18px; }
.aw-prose .aw-sources { font-size: var(--aw-fs-sm); line-height: 1.55; color: var(--aw-ink-2); word-break: break-word; }
.aw-article__meta a { color: var(--aw-ink-2); }
.aw-original { display: grid; gap: 10px; border: var(--aw-border-strong); border-radius: var(--aw-r-xs); background: rgba(0,0,0,.3); padding: 16px 18px; margin: 1.6em 0; }
.aw-original p { margin: 0; }
.aw-original .aw-btn { justify-self: start; white-space: normal; max-width: 100%; }
.aw-original { min-width: 0; }
.aw-facts dd a { color: var(--aw-ink-2); }
.aw-article__main { min-width: 0; }
.aw-page .aw-prose h2:first-child { margin-top: .6em; }
.aw-legal { max-width: 78ch; }
.aw-empty { color: var(--aw-ink-muted); padding: 24px 0; }
.aw-cards--guide-list { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }

/* ---- Traits (real data) ---- */
.tt-zoom { transform: none; }
.skills-page .tt-zoom { margin-inline: 0; transform-origin: 0 0; transition: none; }
.tnode__ico.is-img { background: none; }
.tnode__ico.is-img img { width: 100%; height: 100%; object-fit: contain; display: block; pointer-events: none; user-select: none; -webkit-user-drag: none; }
.aw-ico-disc .tnode__ico.is-img { inset: 18%; position: absolute; }
.aw-ico-disc { position: relative; }
.tnode.is-default { cursor: default; }
.tt-page { padding-bottom: calc(var(--aw-legend-h) + 24px); }
.tt-page .aw-intro, .tt-page .aw-faq { padding-inline: 0; }
.tt-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 6px; }
.tt-field { display: inline-flex; align-items: center; gap: 8px; font: 400 var(--aw-fs-md)/1 var(--aw-font-ui); color: var(--aw-ink-2); }
.tt-field input { height: 32px; padding: 0 10px; border: var(--aw-border); border-radius: var(--aw-r-sm); background: rgba(0,0,0,.35); color: var(--aw-ink-hi); font: 400 var(--aw-fs-sm)/1 var(--aw-font-body); }
.tt-field input[type="number"] { width: 78px; }
.tt-field input[type="text"] { width: 190px; }
.tt-field input[aria-invalid="true"] { border-color: var(--aw-danger); }
.tt-tools { display: inline-flex; align-items: center; gap: 10px; margin-left: auto; }
.tt-points b.is-over { color: var(--aw-cost); }
.device-pills { display: inline-flex; gap: 4px; }
.aw .device-pill { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 9px; border: var(--aw-border); border-radius: var(--aw-r-sm); background: rgba(0,0,0,.3); color: var(--aw-ink-2); font: 500 var(--aw-fs-xs)/1 var(--aw-font-body); cursor: pointer; }
.aw .device-pill img { width: 16px; height: 16px; }
.aw .device-pill.is-on, .aw .device-pill:hover { border-color: var(--aw-line-hi); color: var(--aw-ink-hi); }
.aw-detail__media { padding: 0 16px; }
.aw-detail__media video, .aw-detail__media img { width: 100%; height: auto; border: var(--aw-border); border-radius: var(--aw-r-xs); }
.aw-detail__combo { padding: 8px 16px 0; font: 400 var(--aw-fs-sm)/1.5 var(--aw-font-body); color: var(--aw-ink); }
.aw-detail__statuses { padding: 0 16px 12px; font: 400 var(--aw-fs-sm)/1.5 var(--aw-font-body); }
.aw-detail__statuses summary { cursor: pointer; color: var(--aw-ink-2); font-family: var(--aw-font-ui); font-size: var(--aw-fs-md); }
.aw-status { margin-top: 8px; }
.aw-status b { display: flex; align-items: center; gap: 6px; color: var(--aw-keyword); font-weight: 600; }
.aw-status p { color: var(--aw-ink-2); margin: 2px 0 0; }
.aw-detail__desc .skill-ref, .aw-detail__desc .status-ref, .aw-detail__combo .skill-ref { color: var(--aw-keyword); cursor: pointer; }
.aw-detail__btns { display: inline-flex; gap: 6px; }
.aw-detail.is-empty .aw-detail__desc { color: var(--aw-ink-2); }
.is-share-view .aw-pick[disabled] { opacity: .45; cursor: default; }
.is-share-view .tt-hint, .is-share-view [data-act="reset-all"], .is-share-view [data-act="reset"], .is-share-view [data-act="apply"], .is-share-view [data-act="share"],
.is-share-view .tt-field--budget, .is-share-view .tt-field--name { display: none !important; }
@media (max-width: 899px) {
  .tt-field input[type="text"] { width: 150px; }
  .tt-tools { margin-left: 0; }
}

/* Traits interaction restored on the new kit: old frames, no selection bloom,
   info card next to the pointer, wheel zoom inside a bounded stage. */
.skills-page .tnode {
  --rim-w: 0px;
  --frame: rgba(154, 148, 138, .85);
  filter: none;
}
.skills-page .tnode--passive {
  --sz: var(--aw-node);
  --mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 1L39 20L20 39L1 20Z'/%3E%3C/svg%3E");
}
.skills-page .tnode__shape { background: transparent; }
.skills-page .tnode__shape::after { inset: 0; }
.skills-page .tnode__frame {
  position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible;
  pointer-events: none; z-index: 2;
}
.skills-page .tnode__ico { z-index: 3; }
.skills-page .tnode__empty {
  position: absolute; inset: 0; z-index: 4; display: grid; place-items: center;
  font: 600 .8rem/1 var(--aw-font-ui); color: var(--aw-ink-muted); pointer-events: none;
}
/* Square (active) and diamond share this stroke. Do not give .frame-sq a different width. */
.skills-page .tnode__frame .frame-stroke,
.skills-page .tnode__frame .frame-sq {
  fill: none;
  stroke: var(--frame);
  stroke-width: 1.5px;
  vector-effect: non-scaling-stroke;
}
.skills-page .tnode__frame .filigree {
  fill: none;
  stroke: var(--frame);
  stroke-width: 1px;
  vector-effect: non-scaling-stroke;
  opacity: .75;
}
.skills-page .tnode.is-available,
.skills-page .tnode.is-available:hover,
.skills-page .tnode.is-learned,
.skills-page .tnode.is-learned:hover,
.skills-page .tnode.is-locked,
.skills-page .tnode.is-locked:hover,
.skills-page .tnode.is-excluded,
.skills-page .tnode:hover { filter: none; }
.skills-page .tnode.is-available { --frame: rgba(236, 229, 212, .9); }
.skills-page .tnode.is-learned {
  --frame: #e6d7b0;
  --rim: #e6d7b0;
  --ico-filter: brightness(0);
}
.skills-page .tnode.is-locked { --frame: rgba(154, 148, 138, .45); }
.skills-page .tnode.is-excluded { --frame: rgba(154, 148, 138, .28); }
.skills-page .tnode.is-focus { filter: none; --frame: #e7dcc0; z-index: 2; }
.skills-page .tnode.is-focus::after { content: none; display: none; animation: none; background: none; }
.skills-page .tnode.is-chosen::before {
  inset: -2px;
  background: #e4d3a2;
  opacity: 1;
  filter: none;
}
.skills-page .tt-stage { overflow: hidden; touch-action: none; cursor: grab; }
.skills-page .tt-stage.is-panning { cursor: grabbing; }
.skills-page .tt-stage.is-catalog-stage { overflow: auto; cursor: auto; }
.skills-page .tt-views { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; align-items: center; }
.skills-page .tt-views .is-on { border-color: var(--aw-line-hi); color: var(--aw-ink-hi); }
.skills-page .tt-report-note { max-width: 28ch; white-space: normal; text-align: left; height: auto; min-height: 30px; padding-block: 4px; }
.skills-page .tt-selected { max-height: 132px; overflow: auto; margin-top: 8px; }
.skills-page .tt-selected__label,
.skills-page .tt-remaining { margin: 0 0 4px; font: 400 var(--aw-fs-sm)/1.3 var(--aw-font-ui); color: var(--aw-ink-2); }
.skills-page .tt-remaining.is-over,
.skills-page .tt-remaining.is-over b { color: var(--aw-cost); }
.skills-page .tt-selected ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.skills-page .tt-selected li { display: flex; justify-content: space-between; gap: 8px; font: 400 var(--aw-fs-sm)/1.35 var(--aw-font-body); color: var(--aw-ink); }
.skills-page .tt-selected li.is-empty { color: var(--aw-ink-muted); }
.skills-page .tt-canvas.is-catalog { width: auto !important; height: auto !important; min-height: 240px; padding: 4px 4px 28px; }
.skills-page .tt-catalog__head { display: flex; justify-content: flex-end; }
.skills-page .tt-catalog__sec { margin-top: 14px; }
.skills-page .tt-catalog__sec h3 { margin: 0 0 8px; font: 500 var(--aw-fs-md)/1.2 var(--aw-font-ui); color: var(--aw-ink-2); }
.skills-page .tt-catalog__grid { display: flex; flex-wrap: wrap; gap: 12px 8px; }
.skills-page .tt-catalog__item { width: 86px; display: grid; justify-items: center; gap: 4px; }
.skills-page .tt-catalog__name { font: 400 .7rem/1.25 var(--aw-font-ui); color: var(--aw-ink-2); text-align: center; }
.skills-page .tt-canvas.is-catalog .tnode { position: relative; left: auto; top: auto; margin: 16px 0 0; }
@media (min-width: 900px) {
  .skills-page .tt-body { grid-template-columns: minmax(0, 1fr); }
  .skills-page .tt-side {
    position: fixed;
    z-index: 45;
    width: min(340px, calc(100vw - 16px));
    max-height: min(70vh, 620px);
    margin: 0;
    padding: 0;
    top: 8px;
    left: 8px;
    right: auto;
    bottom: auto;
    overflow: auto;
    pointer-events: none;
  }
  .skills-page .tt-side.is-anchored { pointer-events: auto; }
  .skills-page .tt-side [data-d-report] { pointer-events: auto; }
  .skills-page .tt-side.is-closed { display: none; }
  .skills-page .tt-side .aw-detail {
    width: 100%;
    max-width: none;
    max-height: min(70vh, 620px);
    overflow: auto;
  }
}
@media (max-width: 899px) {
  .skills-page .tt-stage {
    height: min(68vh, 560px);
    min-height: 300px;
    overflow: hidden;
    cursor: grab;
    padding-inline: 0;
    margin-inline: 0;
  }
  .skills-page .tt-stage.is-catalog-stage { overflow: auto; }
}

/* ---- ranking / build view ---- */
.bld-filters { display: flex; flex-wrap: wrap; gap: 10px 14px; margin: 18px 0 14px; }
.bld-filters label { display: grid; gap: 4px; font: 400 var(--aw-fs-sm)/1 var(--aw-font-ui); color: var(--aw-ink-2); }
.bld-filters select, .bld-filters input { height: 34px; min-width: 120px; padding: 0 10px; border: var(--aw-border); border-radius: var(--aw-r-sm); background: rgba(0,0,0,.35); color: var(--aw-ink-hi); font: 400 var(--aw-fs-sm)/1 var(--aw-font-body); }
.bld-list { display: grid; gap: 6px; }
.bld-row { grid-template-columns: 56px minmax(0,1fr) auto; }
.bld-rank { font: 500 1.25rem/1 var(--aw-font-ui); color: var(--aw-ink-2); text-align: center; }
.bld-row.is-top .bld-rank { color: var(--aw-gold); }
.bld-row .aw-row__label { display: grid; gap: 3px; white-space: normal; }
.bld-name { font: 400 var(--aw-fs-lg)/1.2 var(--aw-font-ui); }
.bld-sub { font: 400 var(--aw-fs-xs)/1.3 var(--aw-font-body); color: var(--aw-ink-muted); }
.aw-row.is-selected .bld-sub, .aw-row:hover .bld-sub { color: inherit; }
.bld-rating { display: grid; justify-items: end; gap: 3px; }
.bld-stars { color: var(--aw-gold); letter-spacing: 2px; }
.bld-votes { font: 400 var(--aw-fs-xs)/1 var(--aw-font-body); color: var(--aw-ink-muted); }
.bld-pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 18px 0 0; }
.bld-status { padding: 18px 0; color: var(--aw-ink-2); }
.bld-status.is-error { color: var(--aw-danger); }
.bv-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; align-items: end; }
.bv-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.aw-tag-pill { font: 400 var(--aw-fs-xs)/1 var(--aw-font-body); color: var(--aw-ink-2); border: var(--aw-border); border-radius: 999px; padding: 5px 9px; }
.aw-tag-pill b { color: var(--aw-ink-hi); font-weight: 600; }
.bv-rating { text-align: right; }
.bv-rating .bld-stars { font-size: 1.25rem; }
.bv-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.bv-rate { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 12px; }
.star-picker { display: inline-flex; gap: 2px; }
.star-picker button { font-size: 1.35rem; line-height: 1; color: var(--aw-ink-dim); padding: 2px; }
.star-picker button.is-on, .star-picker button:hover { color: var(--aw-gold); }
.bv-build .tt-body { margin-top: 12px; }
.build-comments { padding-block: 32px; }
.bv-comment-form { display: grid; gap: 8px; max-width: 640px; }
.bv-comment-form textarea { min-height: 90px; padding: 10px; border: var(--aw-border); border-radius: var(--aw-r-sm); background: rgba(0,0,0,.35); color: var(--aw-ink-hi); font: 400 var(--aw-fs-md)/1.5 var(--aw-font-body); }
.bv-comment-form .aw-btn { justify-self: start; }
.bv-comments { list-style: none; padding: 0; margin: 16px 0 0; display: grid; gap: 10px; max-width: 760px; }
.bv-comments time { font: 400 var(--aw-fs-xs)/1 var(--aw-font-body); color: var(--aw-ink-muted); }
.bv-comments p { margin: 4px 0 0; }

/* ---- production modals (report / controls) themed with kit tokens ---- */
.aw { --ink: var(--aw-ink); --muted: var(--aw-ink-2); --acc: var(--aw-cream); --line: var(--aw-line-strong); --card: #1a1916; }
.aw .report-modal { background: var(--aw-scrim); }
.aw .report-card { background: var(--aw-surface-panel); border: var(--aw-border-strong); border-radius: var(--aw-r-md); box-shadow: var(--aw-shadow-panel); color: var(--aw-ink); font-family: var(--aw-font-body); }
.aw .report-card h2 { font: 500 var(--aw-fs-xl)/1.2 var(--aw-font-ui); color: var(--aw-ink-hi); }
.aw .report-send { background: var(--aw-cream-grad); color: var(--aw-cream-ink); border-color: transparent; }
.aw .report-field input, .aw .report-field textarea, .aw .report-field select { background: rgba(0,0,0,.35); color: var(--aw-ink-hi); }

/* =====================================================================================
   DIS build (menu, home, Traits mobile, character selector). Colors and background
   effects of the beta are untouched; only layout, type and lines change.
   ===================================================================================== */
:root { --aw-topbar-h: 84px; --cs-gold: #e6d7b0; --cs-gray: #8a857a; }
@media (max-width: 899px) { :root { --aw-topbar-h: 116px; } }

/* ---- 1. top menu: bigger bar, serif like the game's menu, sober selected state ---- */
.aw-topbar { background: linear-gradient(180deg, rgba(12,11,10,.97), rgba(16,15,13,.92)); border-bottom: 1px solid var(--aw-line); }
.aw-topbar__in { gap: clamp(14px, 1.4vw, 24px); max-width: 1680px; padding-inline: clamp(16px, 1.9vw, 32px); }
.aw-brand { font-size: 1.5rem; letter-spacing: .02em; }
.aw-tabs { position: relative; gap: 4px; --fl: 0px; --fr: 0px; }
.aw-tabs.can-left { --fl: 34px; }
.aw-tabs.can-right { --fr: 44px; }
.aw-tabs__list { flex: 0 1 auto; gap: 2px; padding-inline: 2px;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--fl), #000 calc(100% - var(--fr)), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 var(--fl), #000 calc(100% - var(--fr)), transparent 100%); }
.aw-tabs > .aw-kbd { flex: none; margin-inline: 6px; }
.aw-tab-li { display: flex; align-items: stretch; flex: none; }
.aw-topbar { --tab-h: 66px; --tab-pt: 20px; }
.aw-tab { height: var(--tab-h); padding: var(--tab-pt) 7px 0; align-items: flex-start; font: 400 1.1875rem/1 var(--aw-font-ui); letter-spacing: .02em; color: var(--aw-ink-2); }
.aw-tab:hover { color: var(--aw-ink-hi); }
.aw-tab:focus-visible, .aw-tab-caret:focus-visible, .aw-menu__item:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: -4px; }
/* selected: bright white text + one fine white line, no glow */
.aw-tab[aria-current="page"], .aw-tab[aria-current="true"], .aw-tab.is-active { color: #fff; text-shadow: none; }
.aw-tab[aria-current="page"]::after, .aw-tab[aria-current="true"]::after, .aw-tab.is-active::after { left: 7px; right: 7px; top: calc(var(--tab-pt) + 1em + 8px); bottom: auto; height: 1px; background: #fff; }
.aw-subtabs .aw-tab { height: 46px; padding: 0 10px; align-items: center; font-size: 1.1875rem; }
.aw-subtabs .aw-tab.is-active::after { left: 10px; right: 10px; top: auto; bottom: 6px; }
/* disabled: no link, tiny "coming soon" underneath */
.aw-tab.is-disabled { color: #6e695f; cursor: default; flex-direction: column; align-items: center; justify-content: flex-start; }
.aw-tab.is-disabled small { margin: 6px 0 0; font: 500 .625rem/1 var(--aw-font-body); letter-spacing: .03em; color: var(--aw-ink-muted); white-space: nowrap; }
/* Traits caret + dropdown */
.aw-tab-li--split { position: relative; }
.aw-tab-li--split .aw-tab { padding-right: 2px; }
.aw-tab-caret { display: inline-flex; align-items: flex-start; justify-content: center; width: 28px; height: var(--tab-h); padding-top: calc(var(--tab-pt) + .5em + 3px); font-size: 1.1875rem; color: var(--aw-ink-2); }
.aw-tab-caret svg { width: 10px; height: 6px; transition: transform var(--aw-t-fast); }
.aw-tab-caret:hover { color: #fff; }
.aw-tab-caret[aria-expanded="true"] { color: #fff; }
.aw-tab-caret[aria-expanded="true"] svg { transform: rotate(180deg); }
.aw-menu { position: absolute; z-index: 60; min-width: 220px; padding: 4px; background: rgba(18,17,15,.98); border: 1px solid var(--aw-line-strong); border-radius: var(--aw-r-xs); box-shadow: 0 14px 34px rgba(0,0,0,.55); }
.aw-menu[hidden] { display: none; }
.aw-menu__item { display: flex; align-items: center; min-height: 46px; padding: 0 18px; font: 400 1.25rem/1.2 var(--aw-font-ui); color: var(--aw-ink); text-decoration: none; white-space: nowrap; border-radius: var(--aw-r-xs); }
.aw-menu__item:hover, .aw-menu__item:focus-visible { background: var(--aw-cream-grad); color: var(--aw-cream-ink); }
.aw-menu__item[aria-current="page"] { color: #fff; box-shadow: inset 0 -1px 0 rgba(255,255,255,.9); }
.aw-menu__item[aria-current="page"]:hover, .aw-menu__item[aria-current="page"]:focus-visible { color: var(--aw-cream-ink); }
.aw-lang select { height: 38px; font-size: .875rem; }
/* non-Latin scripts: no extra tracking, a touch heavier, serif CJK stack comes from --aw-font-ui */
html[data-script^="cjk"] .aw-tab { letter-spacing: .03em; font-weight: 500; font-size: 1.0625rem; }
html[data-script^="cjk"] .aw-menu__item { letter-spacing: .03em; font-weight: 500; }
html[data-script="cyrillic"] .aw-tab { letter-spacing: .01em; }
html[data-script^="cjk"] .aw-tab.is-disabled small { letter-spacing: .03em; }
@media (max-width: 1599px) { .aw-social { display: none; } }
/* compact desktop (laptops): keycaps hidden, smaller brand/tabs so the whole menu still fits when possible */
@media (min-width: 900px) and (max-width: 1399px) { .aw-tabs > .aw-kbd { display: none; } .aw-brand { font-size: 1.375rem; } .aw-tab.is-disabled small { font-size: .5625rem; } }
@media (min-width: 900px) and (max-width: 1399px) { .aw-tab { padding-inline: 6px; font-size: 1.0625rem; } .aw-tab[aria-current="page"]::after, .aw-tab[aria-current="true"]::after, .aw-tab.is-active::after { left: 6px; right: 6px; } .aw-tab-caret { width: 22px; font-size: 1.0625rem; } html[data-script^="cjk"] .aw-tab { font-size: 1rem; } }
@media (max-width: 899px) {
  .aw-topbar__in { padding-top: 8px; }
  .aw-brand { font-size: 1.5rem; min-height: 44px; align-items: center; }
  .aw-tabs { -webkit-mask: none; mask: none; margin-top: 2px; gap: 0; }
  .aw-tabs.can-right { --fr: 52px; }
  .aw-topbar { --tab-h: 58px; --tab-pt: 14px; }
  .aw-tab { font-size: 1.25rem; padding-inline: 10px; }
  .aw-tab[aria-current="page"]::after, .aw-tab[aria-current="true"]::after, .aw-tab.is-active::after { left: 10px; right: 10px; }
  .aw-tab-caret { width: 44px; font-size: 1.25rem; }
  html[data-script^="cjk"] .aw-tab { font-size: 1.125rem; }
  .aw-lang select { height: 44px; font-size: .875rem; padding-right: 30px; }
  .aw-menu__item { min-height: 48px; }
  .aw-subtabs .aw-tab { height: 48px; }
}

/* ---- 2. home: hero image a bit brighter / more contrasted (same image) ---- */
.aw-hero__art img { opacity: .66; filter: saturate(.85) contrast(1.22) brightness(1.14); }
@media (max-width: 899px) { .aw-hero__art img { opacity: .56; } }

/* ---- 3. home: "Qué es ArcheAge World" = prose + quick access (right column) ---- */
.aw-intro--split .aw-intro__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 420px); gap: clamp(28px, 5vw, 80px); align-items: start; }
.aw-intro__main { min-width: 0; }
.aw-quick { margin-top: 6px; padding: 18px 22px 10px; border: var(--aw-border); border-radius: var(--aw-r-xs); background: var(--aw-surface); }
.aw-quick__title { margin: 0 0 6px; font: 600 .75rem/1 var(--aw-font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--aw-ink-muted); }
.aw-quick__list { list-style: none; margin: 0; padding: 0; }
.aw-quick__list li + li .aw-quick__link { border-top: 1px solid var(--aw-line-soft); }
.aw-quick__link { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 52px; padding: 6px 10px; margin-inline: -10px; color: var(--aw-ink); text-decoration: none; border-radius: var(--aw-r-xs); }
.aw-quick__name { font: 400 1.3125rem/1.2 var(--aw-font-ui); color: var(--aw-ink-hi); }
.aw-quick__go { display: inline-flex; align-items: center; gap: 6px; font: 500 .8125rem/1.2 var(--aw-font-body); color: var(--aw-ink-2); text-align: right; }
.aw-quick__go svg { width: 12px; height: 12px; flex: none; }
a.aw-quick__link:hover, a.aw-quick__link:focus-visible { background: var(--aw-cream-grad); color: var(--aw-cream-ink); }
a.aw-quick__link:hover .aw-quick__name, a.aw-quick__link:focus-visible .aw-quick__name, a.aw-quick__link:hover .aw-quick__go, a.aw-quick__link:focus-visible .aw-quick__go { color: var(--aw-cream-ink); }
.aw-quick__link.is-disabled { cursor: default; }
.aw-quick__link.is-disabled .aw-quick__name { color: #6e695f; }
.aw-quick__link.is-disabled .aw-quick__go { color: var(--aw-ink-muted); text-transform: uppercase; letter-spacing: .08em; font-size: .6875rem; }
@media (max-width: 899px) { .aw-intro--split .aw-intro__grid { grid-template-columns: 1fr; } }

/* ---- 4. home: Tools block = the game's Tools menu (vertical rows, hairlines, cream on hover/selected) ---- */
.aw-tools .aw-settings { grid-template-columns: minmax(300px, 400px) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); }
.aw-tools .aw-settings__rows { padding-right: 0; }
.aw-tools .aw-settings__rows::after { display: none; }
.aw-tools .aw-rows { gap: 0; border-top: 1px solid var(--aw-line); }
.aw-tools .aw-row { --row-h: 60px; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 0 20px; background: transparent; border: 0; border-bottom: 1px solid var(--aw-line); border-radius: 0; box-shadow: none; }
.aw-tools .aw-row__chev, .aw-tools .aw-row__pips { display: none; }
.aw-tools .aw-row__label { font: 400 1.5rem/1.15 var(--aw-font-ui); overflow: visible; text-overflow: clip; }
.aw-tools .aw-row__value { display: block; font: 500 .75rem/1.2 var(--aw-font-body); letter-spacing: .07em; text-transform: uppercase; color: var(--aw-ink-2); text-align: right; }
.aw-tools .aw-row:hover, .aw-tools .aw-row:focus-visible, .aw-tools .aw-row.is-selected { background: var(--aw-cream-grad); color: var(--aw-cream-ink); box-shadow: none; border-bottom-color: rgba(29,27,23,.28); }
.aw-tools .aw-row:hover .aw-row__value, .aw-tools .aw-row:focus-visible .aw-row__value, .aw-tools .aw-row.is-selected .aw-row__value { color: var(--aw-cream-ink-2); }
.aw-tools .aw-row:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: -4px; }
.aw-tools .aw-row.is-disabled { background: transparent; color: #6e695f; border-bottom-color: var(--aw-line); }
.aw-tools .aw-row.is-disabled .aw-row__value { color: var(--aw-ink-muted); }
.aw-tools .aw-desc__title { font-size: 1.5rem; }
.aw-tools .aw-desc__body { font-family: var(--aw-font-body); }
@media (max-width: 899px) {
  .aw-tools .aw-settings { grid-template-columns: 1fr; }
  .aw-tools .aw-row { --row-h: 56px; padding: 0 14px; }
}

/* ---- 5. news / communiqués: our own intro = smaller than the body AND italic (rule 04-DISENO) ---- */
.aw-prose .intro, .aw-prose p.intro, .aw-article .intro, p.intro { font-size: .875rem; line-height: 1.6; font-style: italic; color: var(--aw-ink-2); }

/* ---- 6. Traits: budget field wide enough for "Sin límite", mobile fold + smaller H1 ---- */
.tt-field input[type="number"] { width: 9.5rem; text-overflow: ellipsis; }
.tt-field input[type="number"]::placeholder { color: var(--aw-ink-2); opacity: 1; }
.tt-opts-toggle { display: none; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 44px; margin-top: 6px; padding: 0 14px; border: var(--aw-border); border-radius: var(--aw-r-sm); background: rgba(0,0,0,.3); color: var(--aw-ink); font: 400 var(--aw-fs-md)/1.2 var(--aw-font-ui); text-align: left; }
.tt-opts-toggle svg { width: 10px; height: 6px; flex: none; transition: transform var(--aw-t-fast); }
.tt-opts-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.tt-opts-toggle[aria-expanded="true"] { border-color: var(--aw-line-strong); }
.tt-title__tools { margin: 10px 0 0; }
.cs-open { gap: 8px; }
@media (max-width: 899px) {
  /* mobile: the tree should come up the page. Order: points, build/budget/controls fold, view tabs, TREE, then hint / selected list / links.
     (CSS only: head + views dissolve into the tree column; the Traits engine and its DOM are untouched) */
  .skills-page .aw-topbar { position: static; }
  .skills-page .tt-tree { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 8px; align-content: start; }
  .skills-page .tt-head, .skills-page .tt-views { display: contents; }
  .skills-page .tt-tree > .tt-stage, .skills-page .tt-head > *, .skills-page .tt-views > * { grid-column: 1 / -1; }
  .skills-page .tt-views > .aw-btn { min-height: 44px; }
  .skills-page .tt-views > [data-view-tab] { grid-column: auto; order: 4; justify-content: center; }
  .skills-page .tt-points { order: 1; }
  .skills-page .tt-opts-toggle { order: 2; margin-top: 0; }
  .skills-page .tt-controls { order: 3; }
  .skills-page .tt-stage { order: 5; margin-top: 0; }
  .skills-page .tt-hint { order: 6; }
  .skills-page .tt-selected { order: 7; margin-top: 0; }
  .skills-page .tt-views > [data-act="download"] { order: 8; }
  .skills-page .tt-views > .tt-report-note { order: 9; max-width: none; }
  .skills-page .aw-picker__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .skills-page .aw-pick { height: 64px; }
  .skills-page .aw-picker--sm .aw-pick { height: 60px; }
  .skills-page .aw-pickers { gap: 6px; }
  .tt-opts-toggle { display: flex; }
  .tt-opts-toggle + .tt-controls { display: none; margin-top: 8px; }
  .tt-opts-toggle[aria-expanded="true"] + .tt-controls { display: flex; }
  .tt-field input[type="number"], .tt-field input[type="text"] { height: 44px; }
  .skills-page .tt-title .aw-h2 { font-size: 1.0625rem; letter-spacing: 0; line-height: 1.2; }
  .tt-title__tools { margin-top: 8px; }
  .cs-open { min-height: 44px; }
}

/* ---- 7. character selector (mock-up): class icons left, weapons as square frames, text below ---- */
html.cs-lock { overflow: hidden; }
.cs { position: fixed; inset: 0; z-index: 70; display: grid; place-items: center; padding: 20px; }
.cs[hidden] { display: none; }
.cs__backdrop { position: absolute; inset: 0; background: rgba(8,8,7,.84); }
.cs__panel { position: relative; width: min(1040px, 100%); max-height: calc(100vh - 40px); max-height: calc(100dvh - 40px); overflow: auto; padding: 18px clamp(18px, 3vw, 44px) 40px; background: linear-gradient(180deg, rgba(24,23,20,.985), rgba(14,13,11,.99)); border: 1px solid var(--aw-line-strong); border-radius: var(--aw-r-xs); box-shadow: var(--aw-shadow-panel); }
.cs__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 8px; margin-bottom: 22px; border-bottom: 1px solid var(--aw-line-soft); }
.cs__title { font: 600 .75rem/1 var(--aw-font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--aw-ink-2); }
.cs__close { display: grid; place-items: center; width: 44px; height: 44px; color: var(--aw-ink-2); border: 1px solid transparent; border-radius: var(--aw-r-xs); }
.cs__close:hover { color: var(--aw-ink-hi); border-color: var(--aw-line-strong); }
.cs__close svg { width: 16px; height: 16px; }
.cs__body { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: clamp(20px, 4vw, 56px); align-items: start; }
.cs__classes { display: grid; gap: 12px; justify-items: center; }
.cs__class { display: grid; place-items: center; width: 68px; height: 68px; border-radius: var(--aw-r-xs); }
.cs__diamond { position: relative; display: grid; place-items: center; width: 60px; height: 60px; }
.cs__diamond::before { content: ""; position: absolute; inset: 10px; transform: rotate(45deg); border: 1px solid transparent; transition: border-color var(--aw-t-fast); }
.cs__diamond img { position: relative; width: 32px; height: 32px; object-fit: contain; opacity: .5; transition: opacity var(--aw-t-fast); }
.cs__class:hover .cs__diamond img { opacity: .85; }
.cs__class.is-on .cs__diamond img { opacity: 1; }
.cs__class.is-on .cs__diamond::before { border-color: var(--cs-gold); }
.cs__class:focus-visible, .cs__close:focus-visible, .cs__weapon:focus-visible { outline: none; }
.cs__class:focus-visible .cs__diamond::before { border-color: var(--aw-focus); }
.cs__class:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: 0; }
.cs__close:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: 0; }
.cs__main { min-width: 0; }
.cs__name { font: 400 clamp(2rem, 4.4vw, 3rem)/1.1 var(--aw-font-ui); letter-spacing: .01em; color: var(--aw-ink-hi); }
.cs__sub { margin: 14px 0 22px; padding-bottom: 8px; font: 400 1.125rem/1.2 var(--aw-font-ui); color: var(--aw-ink-2); border-bottom: 1px solid rgba(230,215,176,.45); }
.cs__weapons { display: flex; flex-wrap: wrap; gap: 20px 24px; margin-bottom: 26px; }
.cs__weapon { display: grid; justify-items: center; gap: 12px; width: 112px; margin: 6px; color: var(--cs-gray); }
.cs__frame { position: relative; display: grid; place-items: center; width: 104px; height: 104px; border: 1px solid var(--cs-gray); background: rgba(0,0,0,.35); transition: border-color var(--aw-t-fast); }
.cs__frame::before { content: ""; position: absolute; inset: -6px; border: 1px solid transparent; transition: border-color var(--aw-t-fast); }
.cs__frame img { width: 64px; height: 64px; object-fit: contain; opacity: .5; transition: opacity var(--aw-t-fast); }
.cs__wname { font: 400 1.1875rem/1.2 var(--aw-font-ui); text-align: center; }
.cs__weapon:hover .cs__frame { border-color: #b9b3a6; }
.cs__weapon:hover .cs__frame img { opacity: .8; }
.cs__weapon:hover .cs__wname { color: #b9b3a6; }
.cs__weapon.is-on { color: var(--cs-gold); }
.cs__weapon.is-on .cs__frame, .cs__weapon.is-on:hover .cs__frame { border-color: var(--cs-gold); }
.cs__weapon.is-on .cs__frame::before { border-color: var(--cs-gold); }
.cs__weapon.is-on .cs__frame img { opacity: 1; }
.cs__weapon.is-on .cs__wname { color: var(--cs-gold); }
.cs__weapon:focus-visible .cs__frame { outline: 2px solid var(--aw-focus); outline-offset: 9px; }
.cs__desc, .cs__traits { max-width: 62ch; margin: 0; font: 400 1.1875rem/1.6 var(--aw-font-ui); color: var(--aw-ink); }
.cs__traits { margin-top: 14px; }
.cs__traits b { font-weight: 600; color: var(--cs-gold); }
.cs__desc.is-hueco, .cs__traits.is-hueco { color: var(--aw-keyword); outline: 1px dashed rgba(226,162,76,.7); outline-offset: 4px; }
@media (max-width: 719px) {
  .cs { padding: 0; place-items: stretch; }
  .cs__panel { width: 100%; max-height: none; height: 100vh; height: 100dvh; padding: 8px 16px 32px; border: 0; border-radius: 0; }
  .cs__head { margin-bottom: 12px; }
  .cs__body { grid-template-columns: 1fr; gap: 16px; }
  .cs__classes { grid-auto-flow: column; justify-content: center; gap: 6px; }
  .cs__class { width: 72px; height: 56px; }
  .cs__diamond { width: 52px; height: 52px; }
  .cs__diamond::before { inset: 8px; }
  .cs__weapons { flex-wrap: nowrap; gap: 8px; margin-bottom: 20px; }
  .cs__weapon { width: auto; flex: 1 1 0; min-width: 0; margin: 6px; }
  .cs__frame { width: 100%; height: auto; aspect-ratio: 1; }
  .cs__frame img { width: 58%; height: 58%; }
  .cs__wname { font-size: 1rem; overflow-wrap: anywhere; }
  .cs__desc, .cs__traits { font-size: 1.125rem; }
}
@media (prefers-reduced-motion: reduce) { .aw-tab-caret svg, .tt-opts-toggle svg { transition: none; } }

/* ---- news game filter + tags (live UX, beta aesthetics) ---- */
.game-tag {
  display: inline-block; font: 700 .72rem/1.35 var(--aw-font-body); color: #12100e;
  background: var(--aw-cream, #e8c37a); border-radius: 6px; padding: 2px 8px; margin: 0 4px 6px 0;
}
.aw-card .game-tag { margin-bottom: 2px; }
.aw-card[hidden] { display: none !important; }
.aw-card__title a {
  color: inherit; text-decoration: none;
}
.aw-card__title a:hover { color: var(--aw-cream, #e8c37a); text-decoration: underline; }
.aw-card__media { display: block; color: inherit; text-decoration: none; }
.aw-card__more { text-decoration: none; }
.news-filter.aw-subtabs { margin-top: 8px; }
@media (max-width: 719px) {
  .news-filter .aw-tabs__list { flex-wrap: nowrap; }
  .news-filter .aw-tab { padding-inline: 8px; font-size: .85rem; white-space: nowrap; }
  .game-tag { font-size: .7rem; }
}

/* ---- admin article upload (hidden, noindex) ---- */
.aw-admin { max-width: 720px; margin: 0 auto; padding: 24px 16px 64px; }
.aw-admin h1 { font: 500 1.75rem/1.2 var(--aw-font-ui); margin: 0 0 8px; }
.aw-admin .aw-muted { color: var(--aw-ink-muted); margin: 0 0 20px; }
.aw-admin label { display: block; font: 500 .875rem/1.3 var(--aw-font-body); margin: 14px 0 6px; }
.aw-admin input[type="password"], .aw-admin input[type="file"], .aw-admin textarea {
  width: 100%; max-width: 100%; box-sizing: border-box; padding: 10px 12px;
  background: var(--aw-surface); border: var(--aw-border); border-radius: 6px; color: var(--aw-ink);
}
.aw-admin textarea { min-height: 180px; font-family: ui-monospace, monospace; font-size: .8rem; }
.aw-admin .aw-admin__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.aw-admin .aw-admin__msg { margin-top: 16px; padding: 12px 14px; border-radius: 6px; background: #1c1916; border: 1px solid var(--aw-line-soft); white-space: pre-wrap; font-size: .875rem; }
.aw-admin .aw-admin__msg.is-err { border-color: #a44; color: #f0c0c0; }
.aw-admin .aw-admin__msg.is-ok { border-color: #4a8; color: #c0f0d0; }
.aw-admin .aw-admin__warn { font-size: .8rem; color: var(--aw-ink-muted); margin-top: 8px; }

/* =========================================================================================
   LORE (index + 14 chapters). Text by Build; layout = beta kit (serif menu look, cream selection, hairlines).
   Built only from kit tokens. Spanish only.
   ========================================================================================= */

/* ---- marked image gap ("Imagen pendiente"): sober frame, no invented art ---- */
.aw-hueco-img { display: grid; place-items: center; width: 100%; min-height: 120px; padding: 12px;
  background: #171614; border: 1px dashed var(--aw-line-strong); border-radius: var(--aw-r-xs); }
.aw-hueco-img > span { font: 500 var(--aw-fs-xs)/1.2 var(--aw-font-body); letter-spacing: .12em; text-transform: uppercase; color: var(--aw-ink-2); text-align: center; }
.aw-hueco-img--cover { aspect-ratio: 16 / 9; min-height: 0; }
.aw-card__media > .aw-hueco-img { position: absolute; inset: 0; width: auto; border: 0; border-radius: 0; background: #171614; }
.aw-card__media:has(> .aw-hueco-img)::after { display: none; }

/* ---- index ---- */
.aw-lore-head { padding-bottom: var(--aw-s-6); margin-bottom: var(--aw-s-8); border-bottom: 1px solid var(--aw-line); }
.aw-lore-head .aw-prose { max-width: 68ch; margin-top: var(--aw-s-2); font: 400 1.1875rem/1.6 var(--aw-font-ui); color: var(--aw-ink); }
.aw-lore-h2 { margin: 0 0 var(--aw-s-5); }
.aw-lore-cards { gap: var(--aw-s-6); }
.aw-lore-cards .aw-card { border-color: var(--aw-line); background: var(--aw-surface); }
.aw-lore-cards .aw-card__media { aspect-ratio: 4 / 3; }
.aw-lore-cards .aw-card__media img { object-position: 50% 24%; }
.aw-lore-cards .aw-card__meta { color: var(--aw-ink-2); letter-spacing: .12em; }
.aw-lore-cards .aw-card__title { font-size: 1.375rem; line-height: 1.2; color: var(--aw-ink-hi); }
.aw-lore-cards .aw-card__more { margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--aw-line-soft); font-size: 1.0625rem; min-height: 44px; align-items: flex-end; }
.aw-lore-cards .aw-card:hover, .aw-lore-cards .aw-card:focus-visible { border-color: var(--aw-line-hi); background: var(--aw-surface-hover); }
.aw-lore-cards .aw-card:hover .aw-card__more, .aw-lore-cards .aw-card:focus-visible .aw-card__more { color: var(--aw-ink-hi); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.aw-lore-cards .aw-card:focus-visible, .aw-lore-article a:focus-visible, .aw-lore-side a:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: 3px; }

/* ---- chapter ---- */
.aw-lore-article .aw-article__meta { font-size: var(--aw-fs-sm); }
.aw-lore-cover { margin: var(--aw-s-6) 0 var(--aw-s-8); }
.aw-lore-cover img { display: block; width: 100%; height: auto; border: var(--aw-border); border-radius: var(--aw-r-xs); }
.aw-lore-cover--tall { max-width: 360px; }
.aw-lore-cover figcaption, .aw-lore-fig figcaption { margin-top: var(--aw-s-2); font: 400 var(--aw-fs-sm)/1.5 var(--aw-font-body); color: var(--aw-ink-muted); }
.aw-lore-cover--hueco figcaption { color: var(--aw-ink-2); }
.aw-lore-article .aw-prose h2 { margin-top: 2em; padding-top: .8em; border-top: 1px solid var(--aw-line); }
.aw-lore-fig { margin: 1.4em 0; }
.aw-prose .aw-lore-fig img, .aw-lore-fig img { display: block; width: 100%; height: auto; margin: 0; border: var(--aw-border); border-radius: var(--aw-r-xs); }
.aw-prose .aw-lore-fig img.is-tall { max-width: min(100%, 460px); }
.aw-lore-fig--hueco .aw-hueco-img { min-height: 180px; }
.aw-prose .aw-lore-hueco, .aw-lore-hueco { margin: 0; padding: var(--aw-s-3) var(--aw-s-4); border: 1px dashed var(--aw-keyword); border-radius: var(--aw-r-xs);
  background: color-mix(in srgb, var(--aw-keyword) 7%, transparent); color: var(--aw-keyword); font: 500 .875rem/1.55 var(--aw-font-body); }
.aw-prose .aw-lore-hueco a { color: inherit; text-decoration-color: currentColor; }
.aw-lore-sources { margin-top: var(--aw-s-10); max-width: 70ch; }
.aw-lore-sources h2 { font: 500 1.5rem/1.25 var(--aw-font-ui); color: var(--aw-ink-hi); margin: 0 0 var(--aw-s-2); }
.aw-lore-sources ul { margin: 0; padding: 0; list-style: none; font: 400 var(--aw-fs-md)/1.5 var(--aw-font-body); }
.aw-lore-sources li { border-bottom: 1px solid var(--aw-line-soft); }
.aw-lore-sources a { display: flex; align-items: center; min-height: 44px; color: var(--aw-ink); text-underline-offset: 3px; }
.aw-lore-sources a:hover { color: var(--aw-ink-hi); }
.aw-article__main > .src { max-width: 70ch; margin-top: var(--aw-s-6); font: 400 var(--aw-fs-sm)/1.6 var(--aw-font-body); color: var(--aw-ink-muted); }
.aw-lore-pager { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--aw-s-3); margin-top: var(--aw-s-8); max-width: 70ch; }
.aw-lore-pager .aw-btn { height: auto; min-height: 48px; max-width: 100%; padding: 10px 16px; white-space: normal; text-align: left; line-height: 1.3; color: var(--aw-ink);
  border: 1px solid var(--aw-line); background: var(--aw-surface); }
.aw-lore-pager .aw-btn:hover, .aw-lore-pager .aw-btn:focus-visible { background: var(--aw-cream-grad); color: var(--aw-cream-ink); border-color: rgba(255,250,236,.6); }
.aw-lore-pager .is-next { margin-left: auto; text-align: right; }
.aw-lore-comments { margin-top: var(--aw-s-10); padding-top: var(--aw-s-6); border-top: 1px solid var(--aw-line); max-width: 70ch; }
.aw-lore-comments .aw-muted { margin: 0; font-size: var(--aw-fs-md); color: var(--aw-ink-2); }

/* ---- side: details + lore index (menu rows, current = cream, thin line) + "in this chapter" ---- */
.aw-lore-side .aw-rows { gap: 0; border-top: 1px solid var(--aw-line); }
.aw-lore-side .aw-row { --row-h: 44px; grid-template-columns: auto minmax(0, 1fr) 24px; gap: 10px; padding: 0 8px 0 12px; background: transparent; border: 0; border-bottom: 1px solid var(--aw-line); border-radius: 0; box-shadow: none; }
.aw-lore-side .aw-row:not(:has(.aw-row__num)) { grid-template-columns: minmax(0, 1fr) 24px; }
.aw-lore-side .aw-row__label { font: 400 1.0625rem/1.2 var(--aw-font-ui); color: inherit; white-space: normal; padding-block: 8px; overflow: visible; }
.aw-lore-side .aw-row__num { font: 500 var(--aw-fs-xs)/1 var(--aw-font-body); letter-spacing: .08em; color: var(--aw-ink-2); min-width: 1.6em; }
.aw-lore-side .aw-row__chev { color: var(--aw-ink-2); }
.aw-lore-side .aw-row:hover { background: var(--aw-surface-hover); }
.aw-lore-side .aw-row[aria-current="page"], .aw-lore-side .aw-row[aria-current="page"]:hover { background: var(--aw-cream-grad); color: var(--aw-cream-ink); border-bottom-color: rgba(29,27,23,.28); }
.aw-lore-side .aw-row[aria-current="page"] .aw-row__num, .aw-lore-side .aw-row[aria-current="page"] .aw-row__chev { color: var(--aw-cream-ink-2); }
.aw-lore-side .aw-facts { background: transparent; }
@media (min-width: 900px) {
  .aw-lore-side { max-height: calc(100vh - var(--aw-topbar-h) - 40px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding-right: 6px; }
}
@media (max-width: 899px) {
  .aw-lore-cards.aw-cards--3 { grid-template-columns: 1fr; }
  .aw-lore-pager { flex-direction: column; }
  .aw-lore-pager .aw-btn, .aw-lore-pager .is-next { width: 100%; margin-left: 0; text-align: left; }
  .aw-lore-side { margin-top: var(--aw-s-8); }
  .aw-lore-side .aw-facts > div { grid-template-columns: minmax(0, 42%) minmax(0, 1fr); }
  .aw-lore-cover--tall { max-width: 100%; }
}
@media (min-width: 600px) and (max-width: 899px) { .aw-lore-cards.aw-cards--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* touch targets >= 44 px in the footer legend / language links and in the lore details panel (small screens) */
@media (max-width: 899px) {
  .aw-legend--site .aw-legend__item { min-height: 44px; min-width: 44px; }
  .aw-legend--site .aw-langlinks { gap: 0 4px; }
  .aw-legend--site .aw-langlinks a { display: inline-flex; align-items: center; min-height: 44px; padding-inline: 8px; }
  .aw-lore-side .aw-facts dd a { display: inline-flex; align-items: center; min-height: 44px; }
}

/* long raw URLs in source lists (translated release-date pages) must wrap at 390 px */
.aw-prose a, .aw-prose li, .aw-prose p { overflow-wrap: anywhere; }

/* ---- lore: "Índice" jump button (top right, sticky, scrolls to the index block) ---- */
.aw-lore-jump { position: sticky; top: 10px; z-index: 30; display: flex; justify-content: flex-end; pointer-events: none; margin: 0 0 var(--aw-s-4); }
.aw-lore-jump__btn { pointer-events: auto; min-height: 44px; display: inline-flex; align-items: center; padding: 0 18px; font: 400 1.0625rem/1 var(--aw-font-ui); letter-spacing: .02em; color: var(--aw-ink-hi);
  background: rgba(14,13,11,.94); border: 1px solid var(--aw-line-hi); border-radius: var(--aw-r-xs); box-shadow: 0 2px 10px rgba(0,0,0,.5); }
.aw-lore-jump__btn:hover, .aw-lore-jump__btn:focus-visible { background: var(--aw-cream-grad); color: var(--aw-cream-ink); border-color: rgba(255,250,236,.6); }
.aw-lore-jump__btn:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: 3px; }
#indice, #capitulos { scroll-margin-top: 72px; }
@media (max-width: 899px) { .aw-lore-jump { top: 8px; } .aw-lore-jump__btn { padding: 0 16px; } }
@media (prefers-reduced-motion: no-preference) { html:has(.aw-lore) { scroll-behavior: smooth; } }

/* ---- top menu, selection that LIGHTS UP like the game's menu (David 03/10): warm bright text + soft glow + glowing fine underline.
   Scope: only the main menu (.aw-tabs); Traits skill glow stays removed. ---- */
.aw-tabs .aw-tab:not(.is-disabled) { position: relative; transition: color .18s ease, text-shadow .18s ease; }
.aw-tabs .aw-tab:not(.is-disabled)::after { content: ""; position: absolute; left: 7px; right: 7px; top: calc(var(--tab-pt) + 1em + 8px); bottom: auto; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, rgba(255,226,160,0), #fff3d0 18%, #fff3d0 82%, rgba(255,226,160,0)); box-shadow: 0 0 8px 1px rgba(255,222,150,.7), 0 0 18px 2px rgba(255,200,110,.35);
  opacity: 0; transform: scaleX(.35); transform-origin: 50% 50%; transition: opacity .18s ease, transform .22s ease; }
.aw-tabs .aw-tab:not(.is-disabled):hover, .aw-tabs .aw-tab:not(.is-disabled):focus-visible { color: #fff0cf; text-shadow: 0 0 8px rgba(255,226,160,.55), 0 0 16px rgba(255,200,110,.25); }
.aw-tabs .aw-tab:not(.is-disabled):hover::after, .aw-tabs .aw-tab:not(.is-disabled):focus-visible::after { opacity: .6; transform: scaleX(1); }
.aw-tabs .aw-tab[aria-current="page"], .aw-tabs .aw-tab[aria-current="true"], .aw-tabs .aw-tab.is-active {
  color: #fffaf0; text-shadow: 0 0 6px rgba(255,238,200,.95), 0 0 14px rgba(255,214,140,.75), 0 0 28px rgba(255,190,100,.4); }
.aw-tabs .aw-tab[aria-current="page"]::after, .aw-tabs .aw-tab[aria-current="true"]::after, .aw-tabs .aw-tab.is-active::after { opacity: 1; transform: scaleX(1); }
/* soft light pooled behind the selected tab, like the lit entry in the game's menu */
.aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"]) { background: radial-gradient(ellipse 70% 60% at 50% 100%, rgba(255,222,150,.16), rgba(255,222,150,0) 75%); }
.aw-tabs .aw-tab-caret:hover, .aw-tabs .aw-tab-caret[aria-expanded="true"] { color: #fff0cf; filter: drop-shadow(0 0 5px rgba(255,214,140,.7)); }
.aw-menu__item[aria-current="page"] { color: #fffaf0; text-shadow: 0 0 6px rgba(255,238,200,.9), 0 0 14px rgba(255,214,140,.6); box-shadow: inset 0 -2px 0 rgba(255,236,190,.9); }
.aw-menu__item[aria-current="page"]:hover, .aw-menu__item[aria-current="page"]:focus-visible { text-shadow: none; }
.aw-menu__item:hover, .aw-menu__item:focus-visible { box-shadow: 0 0 14px rgba(255,214,140,.35); }
@media (min-width: 900px) and (max-width: 1399px) { .aw-tabs .aw-tab:not(.is-disabled)::after { left: 6px; right: 6px; } }
@media (max-width: 899px) { .aw-tabs .aw-tab:not(.is-disabled)::after { left: 10px; right: 10px; } }
@media (prefers-reduced-motion: reduce) { .aw-tabs .aw-tab, .aw-tabs .aw-tab::after { transition: none !important; } }

/* ---- skill detail: status/skill icons stay INLINE so punctuation sticks to the word/icon before it (390 px fix, 03/10) ---- */
.aw-detail__desc .status-ref-icon, .aw-detail__combo .status-ref-icon, .tt-desc .status-ref-icon, .tt-combo .status-ref-icon, .skill-tooltip .status-ref-icon,
.aw-detail__desc .skill-ref img, .aw-detail__combo .skill-ref img { display: inline-block; width: 1.1em; height: 1.1em; margin: 0 0 0 .2em; vertical-align: -0.15em; }
.aw-detail__desc .status-ref, .aw-detail__combo .status-ref, .aw-detail__desc .skill-ref, .aw-detail__combo .skill-ref { display: inline; }

/* ---- top menu: NO underline line (David 03/10: "la línea no me gusta"). Selection = lit text + halo only. ---- */
.aw-tabs .aw-tab::after, .aw-tabs .aw-tab[aria-current="page"]::after, .aw-tabs .aw-tab[aria-current="true"]::after, .aw-tabs .aw-tab.is-active::after,
.aw-tabs .aw-tab:not(.is-disabled):hover::after, .aw-tabs .aw-tab:not(.is-disabled):focus-visible::after { content: none !important; display: none !important; }
.aw-menu__item[aria-current="page"] { box-shadow: none; }
/* selected tab: warm light rising from the bottom edge, no line (David 03/10) */
.aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"]) {
  background: radial-gradient(ellipse 85% 85% at 50% 100%, rgba(255,226,160,.42), rgba(255,210,130,.18) 45%, rgba(255,210,130,0) 78%); }
.aw-tabs .aw-tab-li:not(:has(> .aw-tab.is-disabled)):hover:not(:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"])) {
  background: radial-gradient(ellipse 85% 85% at 50% 100%, rgba(255,226,160,.21), rgba(255,210,130,.09) 45%, rgba(255,210,130,0) 78%); }
.aw-tabs .aw-tab-li { transition: background .2s ease; }

/* ---- top menu desktop: ALL title buttons the same size (David 03/10). Traits = tab + caret inside the same width. ---- */
@media (min-width: 900px) {
  .aw-tabs { --tab-w: 92px; }
  .aw-tabs .aw-tab-li { width: var(--tab-w); flex: none; }
  .aw-tabs .aw-tab-li > .aw-tab { flex: 1 1 auto; min-width: 0; justify-content: center; text-align: center; padding-inline: 4px; }
  .aw-tabs .aw-tab-li--split > .aw-tab { padding-right: 0; }
  .aw-tabs .aw-tab-li--split > .aw-tab-caret { flex: none; width: 24px; }
}
@media (min-width: 1400px) { .aw-tabs { --tab-w: 108px; } }
@media (min-width: 900px) { .aw-tabs .aw-tab-li--split > .aw-tab { padding-left: 24px; } }

/* ---- skill detail: combo line + description use the FULL width of the skill panel (David 03/10), same side gutter for image/combo/desc/statuses ---- */
.aw-detail__media, .aw-detail__combo, .aw-detail__desc, .aw-detail__statuses { padding-inline: 10px; max-width: none; width: auto; box-sizing: border-box; }
.aw-detail__combo, .aw-detail__desc { text-wrap: wrap; overflow-wrap: break-word; }

/* ---- top menu glow v3 (David 03/10 "se corta la iluminación"): a feathered bloom that is NOT clipped by the tab box, the list mask or the bar:
   it sits behind the word, is strongest there and melts downwards into the background, no edge, no line. ---- */
.aw-tabs .aw-tab-li, .aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"]),
.aw-tabs .aw-tab-li:not(:has(> .aw-tab.is-disabled)):hover:not(:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"])) { background: none; }
.aw-topbar, .aw-topbar .aw-tabs { overflow: visible; }
.aw-tabs:not(.can-left):not(.can-right) .aw-tabs__list { -webkit-mask-image: none; mask-image: none; }
.aw-tabs .aw-tab-li { position: relative; isolation: isolate; }
.aw-tabs .aw-tab-li::before { content: ""; position: absolute; z-index: -1; pointer-events: none; left: -55%; right: -55%; top: -10%; height: 170%;
  background: radial-gradient(ellipse 50% 52% at 50% 42%, rgba(255,228,165,.50) 0%, rgba(255,212,135,.26) 34%, rgba(255,200,110,.10) 62%, rgba(255,200,110,0) 100%);
  opacity: 0; transition: opacity .25s ease; }
.aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"])::before { opacity: 1; }
.aw-tabs .aw-tab-li:not(:has(> .aw-tab.is-disabled)):hover::before { opacity: .5; }
.aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"]):hover::before { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .aw-tabs .aw-tab-li::before { transition: none; } }
/* glow needs room: desktop list is not a scroller (no clipping); mobile scroller gets extra vertical room so the bloom fades out inside it */
@media (min-width: 900px) { .aw-tabs .aw-tabs__list { overflow: visible; -webkit-mask-image: none; mask-image: none; } .aw-tabs > .aw-kbd { position: relative; z-index: 1; } }
@media (max-width: 899px) { .aw-tabs .aw-tabs__list { padding-block: 24px 40px; margin-block: -24px -40px; } }

/* ---- top menu glow v4 (David 03/10): light is born on the bottom EDGE of the bar under the button and rises as a half-circle (semicircle gradient);
   unselected labels have a soft shadow underneath. ---- */
.aw-tabs .aw-tab-li::before { left: -30%; right: -30%; top: auto; bottom: calc(var(--tab-h) * -0 - 0px); height: 100%;
  background: radial-gradient(ellipse 50% 100% at 50% 100%, rgba(255,230,170,.62) 0%, rgba(255,214,140,.34) 30%, rgba(255,200,110,.13) 62%, rgba(255,200,110,0) 100%); }
.aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"]):hover::before { opacity: 1; }
.aw-tabs .aw-tab:not([aria-current]):not(.is-active) { text-shadow: 0 2px 3px rgba(0,0,0,.85), 0 3px 8px rgba(0,0,0,.6); }
.aw-tabs .aw-tab:not([aria-current]):not(.is-active):not(.is-disabled):hover { text-shadow: 0 0 8px rgba(255,226,160,.5), 0 2px 3px rgba(0,0,0,.7); }
@media (min-width: 900px) { .aw-tabs .aw-tab-li::before { bottom: -9px; height: 115%; } }

/* ---- top menu glow v5 (David 03/10): subtler + smaller bloom; bright lit EDGE at the bottom of the bar that fades out to both sides ---- */
.aw-tabs .aw-tab-li::before { left: -8%; right: -8%; top: auto; bottom: -9px; height: 62%;
  background: radial-gradient(ellipse 50% 100% at 50% 100%, rgba(255,228,165,.30) 0%, rgba(255,214,140,.15) 38%, rgba(255,200,110,.05) 68%, rgba(255,200,110,0) 100%); }
.aw-tabs .aw-tab-li::after { content: ""; position: absolute; z-index: -1; pointer-events: none; left: -30%; right: -30%; bottom: -9px; height: 3px;
  background: linear-gradient(90deg, rgba(255,226,160,0) 0%, rgba(255,226,160,.55) 30%, rgba(255,244,215,.95) 50%, rgba(255,226,160,.55) 70%, rgba(255,226,160,0) 100%);
  box-shadow: 0 0 8px 1px rgba(255,214,140,.35); opacity: 0; transition: opacity .25s ease; }
.aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"])::after { opacity: 1; }
.aw-tabs .aw-tab-li:not(:has(> .aw-tab.is-disabled)):hover::after { opacity: .5; }

/* ---- top menu v6 (David 03/10): the whole-bar light line is dimmed to a barely-there dark edge; the selection line is thinner, softer in the centre,
   and its gradient ends in exactly that same edge colour ---- */
.aw-topbar { --aw-menu-edge: #25221e; border-bottom: 1px solid var(--aw-menu-edge); }
.aw-tabs .aw-tab-li::after { height: 1px; bottom: -9px; left: -34%; right: -34%; box-shadow: none;
  background: linear-gradient(90deg, var(--aw-menu-edge) 0%, rgba(150,124,82,.8) 32%, #b79a66 50%, rgba(150,124,82,.8) 68%, var(--aw-menu-edge) 100%); }

/* =====================================================================================
   MOBILE BOTTOM BAR (< 900 px) — proposal A, chosen by David 03/10/2026.
   Everything is scoped to .aw-mnav (new classes) or lives inside @media (max-width: 899px);
   the desktop menu (.aw-tabs, >= 900 px) is not touched. Selected = cream text + warm light rising from below, NO line.
   ===================================================================================== */
.aw-mnav { display: none; }
@media (max-width: 899px) {
  :root { --aw-mtab-h: 64px; --aw-mnav-h: calc(var(--aw-mtab-h) + env(safe-area-inset-bottom, 0px)); --aw-topbar-h: 65px; }
  /* header: brand only (tabs, language and socials live in the bottom bar / «Más» sheet) */
  .aw-topbar .aw-tabs, .aw-topbar .aw-topbar__tools { display: none; }
  .aw-topbar__in { padding-block: 0; min-height: 64px; align-items: center; }
  .aw-topbar { height: auto; }
  .aw-topbar .aw-brand { min-height: 48px; }
  /* room for the bar: page content, footer and the fixed Traits legend / detail sheet / toast stay above it */
  body.aw { padding-bottom: var(--aw-mnav-h); }
  body.aw.aw-app { padding-bottom: calc(var(--aw-legend-h) + var(--aw-mnav-h)); }
  body.aw .aw-legend--fixed { bottom: var(--aw-mnav-h); }
  body.aw .tt-side { bottom: calc(var(--aw-legend-h) + var(--aw-mnav-h) + 8px); }
  body.aw .aw-toast { bottom: calc(var(--aw-legend-h) + var(--aw-mnav-h) + 16px); }
  html.aw-mnav-lock { overflow: hidden; }
  /* lore «Índice» button is sticky: it must stick below the (sticky) header, not behind it */
  body.aw .aw-lore-jump { top: calc(var(--aw-topbar-h) + 8px); }

  .aw-mnav { display: block; --m-ink: #d2ccbe; --m-ink-2: #a8a296; --m-ink-hi: #eee8da; --m-muted: #8a857a; --m-cream: #f8f1de; --m-surface: rgba(24,23,21,.82); --m-focus: #efe6cf; }
  .aw-mnav *, .aw-mnav *::before, .aw-mnav *::after { box-sizing: border-box; }
  .aw-mtabs { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: flex; padding-bottom: env(safe-area-inset-bottom, 0px);
    background: linear-gradient(180deg, rgba(20,19,17,.94), rgba(9,8,7,.98)); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: 0 -14px 30px rgba(0,0,0,.6); }
  .aw-mtab { position: relative; isolation: isolate; overflow: hidden; flex: 1 1 0; min-width: 48px; height: var(--aw-mtab-h); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    padding: 0 2px; color: var(--m-ink-2); text-decoration: none; background: none; border: 0; border-radius: 0; cursor: pointer; font: 500 .875rem/1 var(--aw-font-ui); letter-spacing: .01em; white-space: nowrap; -webkit-tap-highlight-color: transparent; }
  .aw-mtab > span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
  html[data-script^="cjk"] .aw-mtab, html[data-script^="cjk"] .aw-mchip { letter-spacing: 0; font-weight: 500; }
  .aw-mico { display: block; width: 24px; height: 24px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
  .aw-mico--fill { fill: currentColor; stroke: none; }
  .aw-mtab:focus-visible, .aw-mrow:focus-visible, .aw-mchip:focus-visible { outline: 2px solid var(--m-focus); outline-offset: -3px; }
  /* selection light: rises from below */
  .aw-mtab::before, .aw-mrow::before, .aw-mchip::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; border-radius: inherit; opacity: 0; transform: translateY(38%);
    background: radial-gradient(95% 105% at 50% 108%, rgba(232,195,122,.46) 0%, rgba(232,195,122,.20) 42%, rgba(232,195,122,0) 78%), linear-gradient(0deg, rgba(232,195,122,.18), rgba(232,195,122,0) 62%);
    transition: opacity .22s ease, transform .32s cubic-bezier(.2,.7,.2,1); }
  .aw-mrow, .aw-mchip { position: relative; isolation: isolate; overflow: hidden; }
  .aw-mtab[aria-current], .aw-mtab.is-within, .aw-mrow[aria-current], .aw-mchip[aria-current], .aw-mtab--more[aria-expanded="true"],
  .aw-mtab:active, .aw-mrow:active, .aw-mchip:active { color: var(--m-cream); text-shadow: 0 0 12px rgba(232,195,122,.65), 0 1px 2px rgba(0,0,0,.6); }
  .aw-mtab[aria-current]::before, .aw-mtab.is-within::before, .aw-mrow[aria-current]::before, .aw-mchip[aria-current]::before, .aw-mtab--more[aria-expanded="true"]::before,
  .aw-mtab:active::before, .aw-mrow:active::before, .aw-mchip:active::before { opacity: 1; transform: none; }
  .aw-mtab[aria-current] .aw-mico, .aw-mtab.is-within .aw-mico, .aw-mtab--more[aria-expanded="true"] .aw-mico { filter: drop-shadow(0 0 6px rgba(232,195,122,.7)); }
  /* while «Más» is open only «Más» is lit */
  .aw-mtabs.is-more-open .aw-mtab[aria-current], .aw-mtabs.is-more-open .aw-mtab.is-within { color: var(--m-ink-2); text-shadow: none; }
  .aw-mtabs.is-more-open .aw-mtab[aria-current]::before, .aw-mtabs.is-more-open .aw-mtab.is-within::before { opacity: 0; }
  .aw-mtabs.is-more-open .aw-mtab[aria-current] .aw-mico, .aw-mtabs.is-more-open .aw-mtab.is-within .aw-mico { filter: none; }
  .aw-mtabs.is-more-open .aw-mtab--more[aria-expanded="true"] { color: var(--m-cream); text-shadow: 0 0 12px rgba(232,195,122,.65), 0 1px 2px rgba(0,0,0,.6); }
  .aw-mtabs.is-more-open .aw-mtab--more[aria-expanded="true"]::before { opacity: 1; }
  .aw-mtabs.is-more-open .aw-mtab--more .aw-mico { filter: drop-shadow(0 0 6px rgba(232,195,122,.7)); }
  @media (hover: hover) { .aw-mtab:hover::before, .aw-mrow:hover::before, .aw-mchip:hover::before { opacity: .55; transform: none; } .aw-mtab:hover, .aw-mrow:hover, .aw-mchip:hover { color: var(--m-ink-hi); } }
  /* «Más» sheet */
  .aw-mscrim { position: fixed; inset: 0; z-index: 55; background: rgba(8,8,7,.72); opacity: 0; visibility: hidden; transition: opacity .2s, visibility 0s .2s; }
  .aw-mscrim.is-open { opacity: 1; visibility: visible; transition: opacity .2s; }
  .aw-msheet { position: fixed; left: 0; right: 0; bottom: var(--aw-mnav-h); z-index: 58; max-height: calc(100vh - var(--aw-mnav-h) - 40px); max-height: calc(100dvh - var(--aw-mnav-h) - 40px); overflow-y: auto; overscroll-behavior: contain;
    padding: 16px var(--aw-gutter, 16px) 18px; background: linear-gradient(180deg, rgba(26,25,22,.98), rgba(16,15,13,.99)); border-radius: 10px 10px 0 0; box-shadow: 0 -10px 40px rgba(0,0,0,.6);
    transform: translateY(24px); opacity: 0; visibility: hidden; transition: transform .25s cubic-bezier(.2,.7,.2,1), opacity .2s, visibility 0s .25s; }
  .aw-msheet.is-open { transform: none; opacity: 1; visibility: visible; transition: transform .25s cubic-bezier(.2,.7,.2,1), opacity .2s; }
  .aw-msheet__h { margin: 16px 0 10px; font: 600 .75rem/1 var(--aw-font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--m-muted); }
  .aw-msheet__h:first-child { margin-top: 0; }
  .aw-mrow { display: flex; align-items: center; gap: 14px; min-height: 56px; padding: 0 16px; margin-bottom: 8px; background: var(--m-surface); border-radius: 2px; color: var(--m-ink); text-decoration: none; font: 400 1.25rem/1.2 var(--aw-font-ui); }
  .aw-mrow > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
  .aw-mrow .aw-mico { color: var(--m-ink-2); }
  .aw-mchips { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .aw-mchips--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aw-mchip { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 8px; background: var(--m-surface); border-radius: 2px; color: var(--m-ink); text-decoration: none; font: 400 1.0625rem/1.15 var(--aw-font-ui); text-align: center; overflow-wrap: anywhere; }
  .aw-mchip .aw-mico { width: 20px; height: 20px; color: var(--m-ink-2); }
}
@media (max-width: 899px) and (max-width: 374px) { .aw-mtab { font-size: .8125rem; } .aw-mchips { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { .aw-mnav *, .aw-mnav *::before, .aw-mnav *::after { transition: none !important; animation: none !important; } .aw-mtab::before, .aw-mrow::before, .aw-mchip::before { transform: none !important; } }

/* ---- top menu background (David 03/10): same dark tone, but over the SAME grain texture as the rest of the site ---- */
.aw-topbar { background: linear-gradient(180deg, rgba(10,9,8,.42), rgba(12,11,10,.34)), url("../kit/assets/textures/grain-256.jpg") 0 0 / 256px 256px repeat, #14130f; }

/* ---- top menu v7 (David 03/10): NO border line under the bar when nothing is selected; only the selection line under the active tab.
   The selection line fades to transparent (no bar edge to match any more). ---- */
.aw-topbar { border-bottom: 0; box-shadow: none; }
.aw-tabs .aw-tab-li::after { bottom: 0; background: linear-gradient(90deg, rgba(183,154,102,0) 0%, rgba(150,124,82,.8) 32%, #b79a66 50%, rgba(150,124,82,.8) 68%, rgba(183,154,102,0) 100%); }
.aw-tabs .aw-tab-li::before { bottom: 0; }
@media (min-width: 900px) { .aw-tabs .aw-tab-li::after { bottom: -9px; } .aw-tabs .aw-tab-li::before { bottom: -9px; } }

/* ---- mobile bottom bar = SAME background and selection effect as the desktop menu (David 03/10) ---- */
@media (max-width: 899px) {
  .aw-mnav .aw-mtabs { background: linear-gradient(180deg, rgba(10,9,8,.42), rgba(12,11,10,.34)), url("../kit/assets/textures/grain-256.jpg") 0 0 / 256px 256px repeat, #14130f;
    -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; border: 0; }
  .aw-mnav .aw-mtab:not([aria-current]):not(.is-within) { text-shadow: 0 2px 3px rgba(0,0,0,.85), 0 3px 8px rgba(0,0,0,.6); }
  .aw-mnav .aw-mtab::before { inset: auto; left: 0; right: 0; bottom: 0; height: 100%; transform: none; transition: opacity .25s ease;
    background: radial-gradient(ellipse 50% 100% at 50% 100%, rgba(255,228,165,.30) 0%, rgba(255,214,140,.15) 38%, rgba(255,200,110,.05) 68%, rgba(255,200,110,0) 100%); }
  .aw-mnav .aw-mtab::after { content: ""; position: absolute; z-index: -1; pointer-events: none; left: 0; right: 0; bottom: 0; height: 1px; opacity: 0; transition: opacity .25s ease;
    background: linear-gradient(90deg, rgba(183,154,102,0) 0%, rgba(150,124,82,.8) 32%, #b79a66 50%, rgba(150,124,82,.8) 68%, rgba(183,154,102,0) 100%); }
  .aw-mnav .aw-mtab[aria-current], .aw-mnav .aw-mtab.is-within, .aw-mnav .aw-mtab--more[aria-expanded="true"] { color: #fffaf0;
    text-shadow: 0 0 6px rgba(255,238,200,.95), 0 0 14px rgba(255,214,140,.75), 0 0 28px rgba(255,190,100,.4); }
  .aw-mnav .aw-mtab[aria-current]::after, .aw-mnav .aw-mtab.is-within::after, .aw-mnav .aw-mtab--more[aria-expanded="true"]::after { opacity: 1; }
  .aw-mnav .aw-mtab[aria-current] .aw-mico, .aw-mnav .aw-mtab.is-within .aw-mico, .aw-mnav .aw-mtab--more[aria-expanded="true"] .aw-mico { filter: drop-shadow(0 0 5px rgba(255,214,140,.6)); }
  .aw-mnav .aw-mtabs.is-more-open .aw-mtab[aria-current]::after, .aw-mnav .aw-mtabs.is-more-open .aw-mtab.is-within::after { opacity: 0; }
  .aw-mnav .aw-mtabs.is-more-open .aw-mtab--more[aria-expanded="true"]::after { opacity: 1; }
  .aw-mnav .aw-mtab:active::before { opacity: 1; }
}
@media (max-width: 899px) and (hover: hover) { .aw-mnav .aw-mtab:hover::before { opacity: .5; } .aw-mnav .aw-mtab:hover::after { opacity: .5; } }
@media (prefers-reduced-motion: reduce) { .aw-mnav .aw-mtab::before, .aw-mnav .aw-mtab::after { transition: none; } }
@media (max-width: 899px) { .aw-mnav .aw-mchip--logo { justify-content: center; } .aw-mnav .aw-mchip--logo .aw-mico { width: 26px; height: 26px; margin: 0; } }

/* ---- Traits catalog (mobile + desktop): it is a normal scrollable list, not the pannable tree (David 03/10: "no se puede desplazar") ---- */
.skills-page .tt-stage.is-catalog-stage { touch-action: pan-x pan-y; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: auto; cursor: auto; }
.skills-page .tt-stage.is-catalog-stage .tt-canvas.is-catalog { position: relative !important; left: auto !important; top: auto !important; transform: none !important; width: 100% !important; max-width: 100%; height: auto !important; box-sizing: border-box; }
.skills-page .tt-stage.is-catalog-stage .tt-catalog__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 12px 8px; }
.skills-page .tt-stage.is-catalog-stage .tt-catalog__item { width: auto; min-width: 0; }
@media (max-width: 899px) { .skills-page .tt-stage.is-catalog-stage { height: min(72vh, 620px); } }
.skills-page .tt-stage.is-catalog-stage .tt-zoom { width: 100% !important; height: auto !important; transform: none !important; position: relative; left: auto; top: auto; }



























/* ===== TANDA 3 (David 03/10 «Vale todo ok»): selección con esquinas ornamentadas + cabeceras de título — INICIO ===== */
:root {
  --orn-ink: #3b3429; --orn-gold: #a98f5e;
  --orn-corner: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%233b3429' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.3'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.105'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.04'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%233b3429' stroke='none'/%3E%3C/svg%3E");
  --orn-corner-gold: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%23a98f5e' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.2'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.02'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='0.96'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%23a98f5e' stroke='none'/%3E%3C/svg%3E");
  --orn-ink-tl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%233b3429' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.3'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.105'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.04'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%233b3429' stroke='none'/%3E%3C/svg%3E");
  --orn-gold-tl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%23a98f5e' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.2'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.02'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='0.96'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%23a98f5e' stroke='none'/%3E%3C/svg%3E");
  --orn-ink-tr: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%233b3429' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='matrix(-1 0 0 1 28 0)'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.3'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.105'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.04'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%233b3429' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --orn-gold-tr: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%23a98f5e' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='matrix(-1 0 0 1 28 0)'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.2'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.02'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='0.96'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%23a98f5e' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --orn-ink-bl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%233b3429' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='matrix(1 0 0 -1 0 28)'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.3'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.105'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.04'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%233b3429' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --orn-gold-bl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%23a98f5e' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='matrix(1 0 0 -1 0 28)'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.2'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.02'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='0.96'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%23a98f5e' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --orn-ink-br: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%233b3429' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='matrix(-1 0 0 -1 28 28)'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.3'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.105'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.04'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%233b3429' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --orn-gold-br: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%23a98f5e' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='matrix(-1 0 0 -1 28 28)'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.2'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.02'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='0.96'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%23a98f5e' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --orn-dot-sel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 42'%3E%3Cpolygon points='21,1.9 40.1,21 21,40.1 1.9,21' fill='none' stroke='rgba(42,37,29,.55)' stroke-width='1'/%3E%3Cpolygon points='21,5.4 36.6,21 21,36.6 5.4,21' fill='%232a251d'/%3E%3Cpolygon points='21,15.34 26.66,21 21,26.66 15.34,21' fill='%23e9e0c6'/%3E%3C/svg%3E");
  --orn-dot-off: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 42'%3E%3Cpolygon points='21,1.9 40.1,21 21,40.1 1.9,21' fill='none' stroke='rgba(168,162,150,.35)' stroke-width='1'/%3E%3Cpolygon points='21,5.4 36.6,21 21,36.6 5.4,21' fill='%231c1a16'/%3E%3C/svg%3E");
  --orn-dot-gold: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpolygon points='12,2.1 21.9,12 12,21.9 2.1,12' fill='none' stroke='rgba(169,143,94,.6)' stroke-width='1'/%3E%3Cpolygon points='12,5.64 18.36,12 12,18.36 5.64,12' fill='%23a98f5e'/%3E%3C/svg%3E");
}
/* -- NO seleccionado: transparente, texto apagado con sombra suave, rectángulo de línea fina 1 px, sin esquinas -- */
.aw-mnav .aw-mrow:not([aria-current]) { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.aw-mnav .aw-mrow:not([aria-current])::before { content: none; }
.aw-mnav .aw-mrow:not([aria-current])::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: var(--orn-dot-off) 12px center/42px 42px no-repeat; }
.aw-tools .aw-row:not(.is-selected):not(.is-disabled) { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.aw-tools .aw-row:not(.is-selected):not(.is-disabled)::before { content: none; }
.aw-tools .aw-row:not(.is-selected):not(.is-disabled)::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: var(--orn-dot-off) 12px center/42px 42px no-repeat; }
.aw-menu__item:not([aria-current="page"]) { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.aw-menu__item:not([aria-current="page"])::before { content: none; }
.aw-menu__item:not([aria-current="page"])::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: var(--orn-dot-off) 6px center/34px 34px no-repeat; }
.aw-lore-side .aw-row:not([aria-current="page"]) { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.aw-lore-side .aw-row:not([aria-current="page"])::before { content: none; }
.aw-mnav .aw-mchip:not([aria-current]) { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.aw-mnav .aw-mchip:not([aria-current])::before { content: none; }
.skills-page .tt-views .aw-btn:not(.is-on) { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.skills-page .tt-views .aw-btn:not(.is-on)::before { content: none; }
.device-pill:not(.is-on) { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.device-pill:not(.is-on)::before { content: none; }
.aw-lidx__btn:not([aria-expanded="true"]) { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.aw-lidx__btn:not([aria-expanded="true"])::before { content: none; }
.aw-cta__a:not(.is-wish) { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.aw-cta__a:not(.is-wish)::before { content: none; }
.aw-lidx__a { background: transparent; color: #a8a296; text-shadow: 0 2px 3px rgba(0,0,0,.85); border: 1px solid rgba(255,255,255,.06); border-radius: 0; box-shadow: none; position: relative; }
.aw-lidx__a::before { content: none; }
/* -- Seleccionado: pergamino #e9e0c6→#ddd2b3, texto #2a251d, líneas finas arriba y abajo unidas a 4 esquinas de filigrana (SVG inline, espejadas) -- */
.aw-mnav .aw-mrow[aria-current] { position: relative; isolation: isolate; background: linear-gradient(180deg, #e9e0c6, #ddd2b3); color: #2a251d; text-shadow: none; border-color: transparent; border-radius: 0; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55), inset 0 0 22px rgba(120,100,60,.16); }
.aw-mnav .aw-mrow[aria-current]::before { content: ""; position: absolute; inset: 1.5px 0; z-index: auto; transform: none; opacity: 1; pointer-events: none; border-radius: 0; background: none; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); transition: none; }
.aw-mnav .aw-mrow[aria-current]::after { content: ""; position: absolute; inset: 0; z-index: auto; pointer-events: none; background: var(--orn-dot-sel) 12px center/42px 42px no-repeat, var(--orn-ink-tl) left top/20px 20px no-repeat, var(--orn-ink-tr) right top/20px 20px no-repeat, var(--orn-ink-bl) left bottom/20px 20px no-repeat, var(--orn-ink-br) right bottom/20px 20px no-repeat; }
.aw-tools .aw-row.is-selected { position: relative; isolation: isolate; background: linear-gradient(180deg, #e9e0c6, #ddd2b3); color: #2a251d; text-shadow: none; border-color: transparent; border-radius: 0; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55), inset 0 0 22px rgba(120,100,60,.16); }
.aw-tools .aw-row.is-selected::before { content: ""; position: absolute; inset: 1.5px 0; z-index: auto; transform: none; opacity: 1; pointer-events: none; border-radius: 0; background: none; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); transition: none; }
.aw-tools .aw-row.is-selected::after { content: ""; position: absolute; inset: 0; z-index: auto; pointer-events: none; background: var(--orn-dot-sel) 12px center/42px 42px no-repeat, var(--orn-ink-tl) left top/20px 20px no-repeat, var(--orn-ink-tr) right top/20px 20px no-repeat, var(--orn-ink-bl) left bottom/20px 20px no-repeat, var(--orn-ink-br) right bottom/20px 20px no-repeat; }
.aw-menu__item[aria-current="page"] { position: relative; isolation: isolate; background: linear-gradient(180deg, #e9e0c6, #ddd2b3); color: #2a251d; text-shadow: none; border-color: transparent; border-radius: 0; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55), inset 0 0 22px rgba(120,100,60,.16); }
.aw-menu__item[aria-current="page"]::before { content: ""; position: absolute; inset: 1.5px 0; z-index: auto; transform: none; opacity: 1; pointer-events: none; border-radius: 0; background: none; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); transition: none; }
.aw-menu__item[aria-current="page"]::after { content: ""; position: absolute; inset: 0; z-index: auto; pointer-events: none; background: var(--orn-dot-sel) 6px center/34px 34px no-repeat, var(--orn-ink-tl) left top/20px 20px no-repeat, var(--orn-ink-tr) right top/20px 20px no-repeat, var(--orn-ink-bl) left bottom/20px 20px no-repeat, var(--orn-ink-br) right bottom/20px 20px no-repeat; }
.aw-lore-side .aw-row[aria-current="page"] { position: relative; isolation: isolate; background: linear-gradient(180deg, #e9e0c6, #ddd2b3); color: #2a251d; text-shadow: none; border-color: transparent; border-radius: 0; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55), inset 0 0 22px rgba(120,100,60,.16); }
.aw-lore-side .aw-row[aria-current="page"]::before { content: ""; position: absolute; inset: 1.5px 0; z-index: auto; transform: none; opacity: 1; pointer-events: none; border-radius: 0; background: none; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); transition: none; }
.aw-lore-side .aw-row[aria-current="page"]::after { content: ""; position: absolute; inset: 0; z-index: auto; pointer-events: none; background: var(--orn-ink-tl) left top/14px 14px no-repeat, var(--orn-ink-tr) right top/14px 14px no-repeat, var(--orn-ink-bl) left bottom/14px 14px no-repeat, var(--orn-ink-br) right bottom/14px 14px no-repeat; }
.aw-mnav .aw-mchip[aria-current] { position: relative; isolation: isolate; background: linear-gradient(180deg, #e9e0c6, #ddd2b3); color: #2a251d; text-shadow: none; border-color: transparent; border-radius: 0; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55); }
.aw-mnav .aw-mchip[aria-current]::before { content: ""; position: absolute; inset: 1.5px 0; z-index: auto; transform: none; opacity: 1; pointer-events: none; border-radius: 0; background: none; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); transition: none; }
.aw-mnav .aw-mchip[aria-current]::after { content: ""; position: absolute; inset: 0; z-index: auto; pointer-events: none; background: var(--orn-ink-tl) left top/12px 12px no-repeat, var(--orn-ink-tr) right top/12px 12px no-repeat, var(--orn-ink-bl) left bottom/12px 12px no-repeat, var(--orn-ink-br) right bottom/12px 12px no-repeat; }
.skills-page .tt-views .aw-btn.is-on { position: relative; isolation: isolate; background: linear-gradient(180deg, #e9e0c6, #ddd2b3); color: #2a251d; text-shadow: none; border-color: transparent; border-radius: 0; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55); }
.skills-page .tt-views .aw-btn.is-on::before { content: ""; position: absolute; inset: 1.5px 0; z-index: auto; transform: none; opacity: 1; pointer-events: none; border-radius: 0; background: none; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); transition: none; }
.skills-page .tt-views .aw-btn.is-on::after { content: ""; position: absolute; inset: 0; z-index: auto; pointer-events: none; background: var(--orn-ink-tl) left top/12px 12px no-repeat, var(--orn-ink-tr) right top/12px 12px no-repeat, var(--orn-ink-bl) left bottom/12px 12px no-repeat, var(--orn-ink-br) right bottom/12px 12px no-repeat; }
.device-pill.is-on { position: relative; isolation: isolate; background: linear-gradient(180deg, #e9e0c6, #ddd2b3); color: #2a251d; text-shadow: none; border-color: transparent; border-radius: 0; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55); }
.device-pill.is-on::before { content: ""; position: absolute; inset: 1.5px 0; z-index: auto; transform: none; opacity: 1; pointer-events: none; border-radius: 0; background: none; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); transition: none; }
.device-pill.is-on::after { content: ""; position: absolute; inset: 0; z-index: auto; pointer-events: none; background: var(--orn-ink-tl) left top/10px 10px no-repeat, var(--orn-ink-tr) right top/10px 10px no-repeat, var(--orn-ink-bl) left bottom/10px 10px no-repeat, var(--orn-ink-br) right bottom/10px 10px no-repeat; }
.aw-lidx__btn[aria-expanded="true"] { position: relative; isolation: isolate; background: linear-gradient(180deg, #e9e0c6, #ddd2b3); color: #2a251d; text-shadow: none; border-color: transparent; border-radius: 0; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55), inset 0 0 22px rgba(120,100,60,.16); }
.aw-lidx__btn[aria-expanded="true"]::before { content: ""; position: absolute; inset: 1.5px 0; z-index: auto; transform: none; opacity: 1; pointer-events: none; border-radius: 0; background: none; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); transition: none; }
.aw-lidx__btn[aria-expanded="true"]::after { content: ""; position: absolute; inset: 0; z-index: auto; pointer-events: none; background: var(--orn-ink-tl) left top/20px 20px no-repeat, var(--orn-ink-tr) right top/20px 20px no-repeat, var(--orn-ink-bl) left bottom/20px 20px no-repeat, var(--orn-ink-br) right bottom/20px 20px no-repeat; }
.aw-cta__a.is-wish { position: relative; isolation: isolate; background: linear-gradient(180deg, #e9e0c6, #ddd2b3); color: #2a251d; text-shadow: none; border-color: transparent; border-radius: 0; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55), inset 0 0 22px rgba(120,100,60,.16); }
.aw-cta__a.is-wish::before { content: ""; position: absolute; inset: 1.5px 0; z-index: auto; transform: none; opacity: 1; pointer-events: none; border-radius: 0; background: none; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); transition: none; }
.aw-cta__a.is-wish::after { content: ""; position: absolute; inset: 0; z-index: auto; pointer-events: none; background: var(--orn-ink-tl) left top/20px 20px no-repeat, var(--orn-ink-tr) right top/20px 20px no-repeat, var(--orn-ink-bl) left bottom/20px 20px no-repeat, var(--orn-ink-br) right bottom/20px 20px no-repeat; }
/* relleno izquierdo para el rombo (filas con rombo) */
.aw-mnav .aw-mrow[aria-current], .aw-mnav .aw-mrow:not([aria-current]) { padding-left: 58px; }
.aw-tools .aw-row.is-selected, .aw-tools .aw-row:not(.is-selected):not(.is-disabled) { padding-left: 58px; }
.aw-menu__item[aria-current="page"], .aw-menu__item:not([aria-current="page"]) { padding-left: 46px; }
.aw-menu__item { box-sizing: border-box; }
.aw-tools .aw-row.is-selected .aw-row__value, .aw-lore-side .aw-row[aria-current="page"] .aw-row__num, .aw-lore-side .aw-row[aria-current="page"] .aw-row__chev { color: #4a4234; }
.aw-mnav .aw-mrow[aria-current] .aw-mico, .aw-mnav .aw-mchip[aria-current] .aw-mico { color: #2a251d; }
.aw-mnav .aw-mrow:not([aria-current]) .aw-mico { color: #a8a296; }
.aw-tools .aw-row:not(.is-selected) .aw-row__value { color: #8a857a; }
.aw-tools .aw-row:not(.is-selected) .aw-row__label { text-shadow: inherit; }
/* pastilla de dispositivo y botones de vista: la imagen/etiqueta debe quedar sobre las esquinas */
.device-pill > *, .skills-page .tt-views .aw-btn > *, .aw-mnav .aw-mrow > *, .aw-mnav .aw-mchip > *, .aw-lidx__btn > *, .aw-cta__a > * { position: relative; z-index: 1; }
.device-pill.is-on img { filter: brightness(0) opacity(.85); }
.aw-menu__item[aria-current="page"], .aw-menu__item[aria-current="page"]:hover, .aw-menu__item[aria-current="page"]:focus-visible { color: #2a251d; text-shadow: none; }
/* -- 10 px entre filas y entre chips -- */
.aw-mnav .aw-mrow { margin-bottom: 10px; }
.aw-mnav .aw-mchips { gap: 10px; }
.aw-menu__item + .aw-menu__item { margin-top: 10px; }
.aw-tools .aw-rows { gap: 10px; border-top: 0; }
.aw-lore-side .aw-rows { gap: 10px; border-top: 0; }
.skills-page .tt-views { gap: 10px; }
.skills-page .device-pills, .device-pills { gap: 10px; }
@media (max-width: 899px) { .skills-page .tt-tree { gap: 10px; } }
.aw-menu__item { padding-right: 24px; }
/* -- CABECERA DE TÍTULO: barra oscura sobre el grano, texto dorado apagado #c9b27f, rombo dorado, línea fina dorada arriba y abajo unida a 4 esquinas doradas -- */
.aw-msheet__h, .aw-quick__title, .cs__title, .skills-page .tt-selected__label, .aw-sechead .aw-h2 { position: relative; box-sizing: border-box; display: flex; align-items: center; min-height: 46px; margin: 0 0 10px; padding: 8px 24px 8px 45px; color: #c9b27f; text-shadow: none; font: 400 1.125rem/1.2 var(--aw-font-ui); letter-spacing: .02em; text-transform: none; background: linear-gradient(180deg, rgba(10,9,8,.55), rgba(16,15,13,.35)), url("../kit/assets/textures/grain-256.jpg") 0 0 / 256px, #12110e; box-shadow: inset 0 1px 0 rgba(255,255,255,.05), inset 0 -1px 0 rgba(169,143,94,.55); }
 { }
.aw-msheet__h::before,
.aw-quick__title::before,
.cs__title::before,
.skills-page .tt-selected__label::before,
.aw-sechead .aw-h2::before { content: ""; position: absolute; inset: 1.5px 0; pointer-events: none; border-top: 1px solid rgba(169,143,94,.6); border-bottom: 1px solid rgba(169,143,94,.6); }
.aw-msheet__h::after,
.aw-quick__title::after,
.cs__title::after,
.skills-page .tt-selected__label::after,
.aw-sechead .aw-h2::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .95; background: var(--orn-dot-gold) 16.5px center/24px 24px no-repeat, var(--orn-gold-tl) left top/18px 18px no-repeat, var(--orn-gold-tr) right top/18px 18px no-repeat, var(--orn-gold-bl) left bottom/18px 18px no-repeat, var(--orn-gold-br) right bottom/18px 18px no-repeat; }
.aw-msheet__h:first-child { margin-top: 0; }
.aw-msheet__h { margin: 16px 0 10px; }
.aw-quick__title { margin: 0 0 10px; }
.cs__title { margin: 0; }
.skills-page .tt-selected__label { margin: 0 0 10px; }
/* -- Arreglo de apilado: el mapa (Leaflet, z-index 400-1100) creaba capas por encima de la hoja «Más», el velo y la barra inferior en móvil; se aísla en su propio contexto -- */
.map-app { isolation: isolate; }
/* ===== TANDA 3 — FIN ===== */

/* ===== TANDA 4 (David 03/10 17:05) — INICIO ===== */
/* -- 4. Pie siempre abajo del todo -- */
body.aw { box-sizing: border-box; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
body.aw > * { flex-shrink: 0; }
body.aw > main { flex: 1 0 auto; width: 100%; }
body.aw > footer.aw-legend--site { margin-top: auto; }

/* -- 10. Frase del pie (Filo): encima de los iconos de redes -- */
.aw-legend--site .aw-legend__help { flex: 1 0 100%; margin: 0 0 2px; font-size: .875rem; line-height: 1.4; color: var(--aw-ink-2); text-align: left; }
@media (max-width: 899px) { .aw-legend--site .aw-legend__help { align-self: stretch; text-align: center; } }

/* -- 9. Inicio: cabeceras de bloque que enlazan, separación 40/28, subtítulo en una línea, botones -- */
.aw-sechead { display: block; margin-bottom: 0; }
.aw-sechead .aw-h2 { margin: 0 0 10px; }
.aw-sechead__a { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: 1 1 auto; min-width: 0; color: inherit; text-decoration: none; position: relative; z-index: 1; }
.aw-sechead__a svg { flex: none; width: 18px; height: 18px; color: #c9b27f; }
.aw-sechead__a:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: 2px; }
.aw-page-home .aw-block { padding-block: 0; margin-top: 40px; }
.aw-page-home .aw-block:last-of-type { padding-bottom: 0; }
.aw-page-home .aw-intro { margin-top: 40px; padding-block: 0 32px; border-bottom: 0; }
@media (max-width: 899px) { .aw-page-home .aw-block, .aw-page-home .aw-intro { margin-top: 28px; } }
.aw-hero__lead { max-width: none; font-size: clamp(.95rem, 2.4vw, 1.25rem); line-height: 1.4; }
.aw-hero__lead a { color: inherit; text-decoration: underline; text-decoration-color: rgba(201,178,127,.55); text-underline-offset: 3px; }
.aw-hero__lead a:hover, .aw-hero__lead a:focus-visible { color: var(--aw-ink-hi); text-decoration-color: currentColor; }
@media (min-width: 900px) { .aw-hero__lead { white-space: nowrap; } }
@media (max-width: 899px) { .aw-hero__lead { font-size: clamp(.875rem, 2.4vw, 1.125rem); } }
html[data-script^="cjk"] .aw-hero__lead { letter-spacing: 0; }
.aw-intro .aw-prose a[hreflang], .aw-hero__lead a[hreflang] { }
.aw-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.aw-cta__a { position: relative; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 6px 24px; white-space: normal; text-decoration: none; font: 400 1.0625rem/1.2 var(--aw-font-ui); text-align: center; }
@media (max-width: 899px) { .aw-cta { flex-direction: column; align-items: stretch; width: 100%; } .aw-cta__a { width: 100%; max-width: 100%; } }

/* -- 5. Noticias: la última grande arriba y el resto en filas (miniatura a la izquierda) -- */
.aw-cards--news { grid-template-columns: 1fr; gap: 10px; }
.aw-cards--news .aw-card--feature { grid-column: 1 / -1; margin-bottom: 14px; }
.aw-cards--news .aw-card:not(.aw-card--feature) { flex-direction: row; }
.aw-cards--news .aw-card:not(.aw-card--feature) .aw-card__media { flex: 0 0 clamp(200px, 26%, 300px); aspect-ratio: auto; min-height: 140px; border-bottom: 0; border-right: 1px solid var(--aw-line-soft); }
.aw-cards--news .aw-card:not(.aw-card--feature) .aw-card__body { align-content: center; padding: 14px 20px; gap: 6px; }
.aw-cards--news .aw-card:not(.aw-card--feature) .aw-card__text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 899px) {
  .aw-cards--news .aw-card--feature { flex-direction: column; margin-bottom: 8px; }
  .aw-cards--news .aw-card--feature .aw-card__media { flex: none; width: 100%; aspect-ratio: 16 / 9; min-height: 0; border-right: 0; border-bottom: 1px solid var(--aw-line-soft); }
  .aw-cards--news .aw-card:not(.aw-card--feature) .aw-card__media { flex: 0 0 38%; min-height: 96px; }
  .aw-cards--news .aw-card:not(.aw-card--feature) .aw-card__body { padding: 10px 12px; gap: 4px; }
  .aw-cards--news .aw-card:not(.aw-card--feature) .aw-card__text, .aw-cards--news .aw-card:not(.aw-card--feature) .aw-card__more { display: none; }
}

/* -- 2/12. Lore: «Los capítulos» + botón «Índice» con panel en el flujo -- */
.aw-lidx__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.aw-lidx__head .aw-h2 { margin: 0; }
.aw-lidx__btn { box-sizing: border-box; flex: none; height: 40px; padding: 4px 18px; display: inline-flex; align-items: center; gap: 10px; font: 400 1.0625rem/1 var(--aw-font-ui); cursor: pointer; }
.aw-lidx__chev { display: none; width: 16px; height: 16px; transition: transform .15s ease; }
.aw-lidx__wrap { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows .2s ease, visibility 0s .2s; }
.aw-lidx.is-open .aw-lidx__wrap { grid-template-rows: 1fr; visibility: visible; transition: grid-template-rows .2s ease, visibility 0s; }
.aw-lidx__clip { overflow: hidden; min-height: 0; }
.aw-lidx__panel { position: relative; box-sizing: border-box; margin-bottom: 16px; padding: 14px; border: 1px solid rgba(201,178,127,.38);
  background: linear-gradient(180deg, rgba(10,9,8,.5), rgba(16,15,13,.3)), url("../kit/assets/textures/grain-256.jpg") 0 0 / 256px, #171612; }
.aw-lidx__panel ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.aw-lidx__a { box-sizing: border-box; display: flex; align-items: center; min-height: 44px; padding: 0 14px; text-decoration: none; font: 400 1rem/1.25 var(--aw-font-ui); text-align: left; }
.aw-lidx__a:hover { color: var(--aw-ink-hi); }
.aw-lidx__a:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: -3px; }
.aw-lore-cards .aw-card { scroll-margin-top: calc(var(--aw-topbar-h) + 12px); }
@media (max-width: 899px) {
  .aw-lidx__head { display: block; }
  .aw-lidx__head .aw-h2 { margin-bottom: 12px; }
  .aw-lidx__btn { width: 100%; height: 48px; justify-content: space-between; }
  .aw-lidx__chev { display: block; }
  .aw-lidx__btn[aria-expanded="true"] .aw-lidx__chev { transform: rotate(180deg); }
  .aw-lidx__wrap { margin-top: 0; }
  .aw-lidx__clip { position: relative; }
  .aw-lidx__panel { margin-top: 10px; max-height: 50vh; max-height: 50dvh; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .aw-lidx__panel ul { grid-template-columns: 1fr; }
  .aw-lidx__a { min-height: 48px; }
  .aw-lidx__clip::after { content: ""; position: absolute; left: 1px; right: 1px; bottom: 17px; height: 24px; pointer-events: none; background: linear-gradient(transparent, #12110e); opacity: 0; transition: opacity .15s; }
  .aw-lidx.is-more .aw-lidx__clip::after { opacity: 1; }
}
/* desktop: sin botón flotante «Índice» (los capítulos tienen su índice lateral) */
@media (min-width: 900px) { .aw-lore-jump { display: none; } }

/* -- 1/3. Capítulo de lore: índice lateral que cabe en la ventana; «Detalles» al final del cuerpo -- */
@media (min-width: 900px) {
  .aw-article__side.aw-lore-side { top: calc(var(--aw-topbar-h) + 12px); max-height: calc(100vh - var(--aw-topbar-h) - 56px); max-height: calc(100dvh - var(--aw-topbar-h) - 56px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
}
.aw-lore-side > .aw-desc__title:first-child { margin-top: 0; }
.aw-lore-details { margin: var(--aw-s-8, 40px) 0 var(--aw-s-6, 28px); }
.aw-lore-details .aw-desc__title { margin: 0 0 12px; }

.aw-lidx.is-instant .aw-lidx__wrap { transition: none; }

/* -- 13. Menú «Más» (móvil): sin título, «Idioma» desplegable, redes en una fila de 4 logos -- */
@media (max-width: 899px) {
  .aw-msheet { padding-top: 8px; }
  .aw-mnav .aw-mlang__btn { appearance: none; -webkit-appearance: none; width: 100%; box-sizing: border-box; height: 48px; min-height: 48px; margin-bottom: 0; text-align: left; cursor: pointer; font: 400 1.125rem/1.2 var(--aw-font-ui); }
  .aw-mnav .aw-mlang__btn .aw-mico:last-child { transition: transform .15s ease; }
  .aw-mnav .aw-mlang__btn[aria-expanded="true"] .aw-mico:last-child { transform: rotate(180deg); }
  .aw-mnav .aw-mchips--list { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 10px; max-height: 40vh; max-height: 40dvh; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .aw-mnav .aw-mchips--list[hidden] { display: none; }
  .aw-mnav .aw-mchips--list .aw-mchip { justify-content: flex-start; min-height: 48px; padding: 0 16px; text-align: left; }
  .aw-mnav .aw-mchips--social { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
  .aw-mnav .aw-mchips--social .aw-mchip { min-height: 48px; height: 48px; padding: 0; }
}
@media (max-width: 899px) { .aw-hero__lead { text-wrap: balance; } }

/* -- 6. Traits en pantallas grandes (>= 1200 px): ancho 1680, una sola barra de 48 px, sin textos, árbol entero sin bajar -- */
@media (min-width: 1200px) {
  .skills-page:not(:has(.bv-build)) .tt-page { max-width: 1680px; padding-inline: clamp(16px, 1.9vw, 32px); position: relative; padding-top: 18px;
    display: grid; grid-template-columns: auto auto auto minmax(0, 1fr) auto auto; column-gap: 10px; row-gap: 10px; align-content: start; }
  .skills-page:not(:has(.bv-build)) .tt-top, .skills-page:not(:has(.bv-build)) .tt-title, .skills-page:not(:has(.bv-build)) .tt-title__tools, .skills-page:not(:has(.bv-build)) .aw-pickers, .skills-page:not(:has(.bv-build)) .aw-picker,
  .skills-page:not(:has(.bv-build)) .tt-body, .skills-page:not(:has(.bv-build)) .tt-tree, .skills-page:not(:has(.bv-build)) .tt-head { display: contents; }
  .skills-page:not(:has(.bv-build)) .tt-title .aw-h2, .skills-page:not(:has(.bv-build)) .aw-picker__label, .skills-page:not(:has(.bv-build)) .tt-title .aw-muted {
    position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; padding: 0; border: 0; }
  .skills-page:not(:has(.bv-build)) .tt-hint { display: none; }
  /* barra: [Clase] [Arma] [Selector de personaje] ........ [Puntos gastados] [Build, presupuesto y controles] */
  .skills-page:not(:has(.bv-build)) .aw-picker:nth-child(1) .aw-picker__list { grid-column: 1; grid-row: 1; }
  .skills-page:not(:has(.bv-build)) .aw-picker__list { display: flex; gap: 10px; align-items: center; height: 48px; overflow: visible; }
  .skills-page:not(:has(.bv-build)) [data-class-list] { grid-column: 1; grid-row: 1; }
  .skills-page:not(:has(.bv-build)) [data-weapon-list] { grid-column: 2; grid-row: 1; }
  .skills-page:not(:has(.bv-build)) .cs-open { grid-column: 3; grid-row: 1; height: 48px; min-height: 48px; padding: 0 18px; align-self: center; }
  .skills-page:not(:has(.bv-build)) .tt-points { grid-column: 5; grid-row: 1; align-self: center; margin: 0; white-space: nowrap; }
  .skills-page:not(:has(.bv-build)) .tt-opts-toggle { display: inline-flex; grid-column: 6; grid-row: 1; width: auto; height: 48px; min-height: 48px; margin: 0; padding: 0 16px; align-self: center; }
  .skills-page:not(:has(.bv-build)) .tt-controls { position: absolute; z-index: 40; top: calc(18px + 48px + 6px); right: clamp(16px, 1.9vw, 32px); display: none; margin: 0; padding: 14px;
    flex-wrap: wrap; align-items: center; gap: 10px 14px; max-width: min(720px, calc(100vw - 48px)); border: 1px solid rgba(201,178,127,.38);
    background: linear-gradient(180deg, rgba(10,9,8,.9), rgba(16,15,13,.94)), #171612; box-shadow: 0 12px 32px rgba(0,0,0,.55); }
  .skills-page:not(:has(.bv-build)) .tt-opts-toggle[aria-expanded="true"] + .tt-controls { display: flex; }
  /* iconos de 48 px, el texto pasa a title / nombre accesible */
  .skills-page:not(:has(.bv-build)) .aw-pick, .skills-page:not(:has(.bv-build)) .aw-picker--sm .aw-pick { position: relative; box-sizing: border-box; width: 48px; min-width: 48px; height: 48px; padding: 0; display: grid; place-items: center; gap: 0; grid-auto-flow: row; }
  .skills-page:not(:has(.bv-build)) .aw-pick__icon, .skills-page:not(:has(.bv-build)) .aw-picker--sm .aw-pick__icon { width: 36px; height: 36px; }
  .skills-page:not(:has(.bv-build)) .aw-pick__icon img, .skills-page:not(:has(.bv-build)) .aw-picker--sm .aw-pick__icon img { width: 30px; height: 30px; }
  .skills-page:not(:has(.bv-build)) .aw-pick__label { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .skills-page:not(:has(.bv-build)) .aw-pick__badge, .skills-page:not(:has(.bv-build)) .aw-picker--sm .aw-pick__badge { position: absolute; top: 2px; right: 2px; left: auto; bottom: auto; transform: none; min-width: 16px; height: 16px; font-size: .6875rem; line-height: 16px; padding: 0 3px; }
  /* resto de filas */
  .skills-page:not(:has(.bv-build)) .tt-views { grid-column: 1 / -1; grid-row: 2; margin: 0; }
  .skills-page:not(:has(.bv-build)) .tt-stage { grid-column: 1 / -1; grid-row: 3; margin: 0; height: calc(100vh - var(--aw-topbar-h) - var(--aw-legend-h) - 126px); height: calc(100dvh - var(--aw-topbar-h) - var(--aw-legend-h) - 126px); min-height: 560px; }
  .skills-page:not(:has(.bv-build)) .tt-selected { grid-column: 1 / -1; grid-row: 4; margin: 0; }
  .skills-page:not(:has(.bv-build)) .tt-side { grid-column: 1; }
  .skills-page:not(:has(.bv-build)) .tt-page > .aw-intro, .skills-page:not(:has(.bv-build)) .tt-page > .aw-faq, .skills-page:not(:has(.bv-build)) .tt-page > section { grid-column: 1 / -1; }
}

/* -- 6. Efecto de habilidad aprendida (specs-dis §1; sin cambiar el relleno): onda blanca al elegir, chispa por la línea, onda dorada y marco a dorado; respiración del borde dorado en las aprendidas.
      Solo opacity / transform (nunca filter). El elemento .tnode__fx lo añade skills.js; el nodo recién aprendido lleva .is-fx-in -- */
.skills-page .tnode__fx { --fx-rot: 45deg; position: absolute; left: 16%; top: 16%; width: 68%; height: 68%; box-sizing: border-box; z-index: 5; pointer-events: none;
  border: 1.5px solid #fff; opacity: 0; transform: rotate(var(--fx-rot)); }
.skills-page .tnode--stat .tnode__fx { --fx-rot: 0deg; left: 4%; top: 4%; width: 92%; height: 92%; border-radius: 50%; }
@keyframes aw-ring { from { transform: rotate(var(--fx-rot)) scale(.9); opacity: 1; } to { transform: rotate(var(--fx-rot)) scale(1.7); opacity: 0; } }
@keyframes aw-ring-gold { from { transform: rotate(var(--fx-rot)) scale(.9); opacity: .9; border-color: #e6d7b0; box-shadow: none; } to { transform: rotate(var(--fx-rot)) scale(1.8); opacity: 0; border-color: #e6d7b0; box-shadow: none; } }
@keyframes aw-breathe-node { from { opacity: 0; transform: rotate(var(--fx-rot)) scale(1); } to { opacity: .75; transform: rotate(var(--fx-rot)) scale(1.12); } }
@keyframes aw-frame-in { 0%, 50% { stroke: #fff; } 100% { stroke: #e6d7b0; } }
@keyframes aw-spark { from { stroke-dashoffset: 14px; opacity: 1; } to { stroke-dashoffset: calc(-1 * var(--len, 60px)); opacity: 1; } }
@keyframes aw-link-in { 0%, 50% { stroke: var(--aw-link); } 100% { stroke: var(--aw-link-on); } }
.skills-page .tnode.is-learned .tnode__fx { border: 1px solid rgba(230,215,176,.9); box-shadow: 0 0 8px 1px rgba(230,215,176,.45); animation: aw-breathe-node 1.8s ease-in-out infinite alternate; }
.skills-page .tnode.is-learned.is-fx-in .tnode__fx { border: 1.5px solid #fff;
  animation: aw-ring .2s ease-out forwards, aw-ring-gold .35s .4s ease-out forwards, aw-breathe-node 1.8s .75s ease-in-out infinite alternate; }
.skills-page .tnode.is-fx-in .tnode__frame .frame-stroke, .skills-page .tnode.is-fx-in .tnode__frame .frame-sq { animation: aw-frame-in .75s linear both; }
.skills-page .tt-links .tlink.is-fx-spark { animation: aw-link-in .4s linear both; }
.skills-page .tt-links .tlink-spark { fill: none; stroke: #f4ecd4; stroke-width: 2.5; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 14px 99999px; stroke-dashoffset: 14px; opacity: 0;
  animation: aw-spark .2s .2s linear both; pointer-events: none; }
@media (prefers-reduced-motion: reduce) {
  .skills-page .tnode__fx, .skills-page .tnode.is-learned .tnode__fx, .skills-page .tnode.is-learned.is-fx-in .tnode__fx { animation: none !important; }
  .skills-page .tnode.is-learned .tnode__fx { opacity: .35; }
  .skills-page .tnode.is-fx-in .tnode__frame .frame-stroke, .skills-page .tnode.is-fx-in .tnode__frame .frame-sq, .skills-page .tt-links .tlink.is-fx-spark { animation: none !important; }
  .skills-page .tt-links .tlink-spark { display: none; }
}

/* -- 6. Respiración del menú superior (specs-dis §1): misma curva, ciclo de 2,4 s; la línea fina de 1 px del propio .aw-tab queda fija -- */
@keyframes aw-breathe-menu { from { opacity: .7; } to { opacity: 1; } }
.aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"])::after { animation: aw-breathe-menu 2.4s ease-in-out infinite alternate; }
@media (max-width: 899.98px) { .aw-mnav .aw-mtab[aria-current]:not(.aw-mtab--more)::before, .aw-mtabs .aw-mtab[aria-current]::before { animation: aw-breathe-menu 2.4s ease-in-out infinite alternate; } }
@media (prefers-reduced-motion: reduce) {
  .aw-tabs .aw-tab-li::after, .aw-mtab[aria-current]::before { animation: none !important; }
}

/* -- documental ArcheAge S: el botón largo (ru/de) pasa a dos líneas en móvil en vez de desbordar -- */
.aw-article .aw-btn { max-width: 100%; height: auto; min-height: 44px; white-space: normal; text-align: center; box-sizing: border-box; }
.aw-article__title { overflow-wrap: break-word; hyphens: auto; }
/* ===== TANDA 4 — FIN ===== */



/* ===== LOTE DIS 03/10: INICIO ===== */
/* -- Plataformas en la portada (specs-plataformas.md) -- */
.aw-wl { width: min(100%, 560px); margin: 26px auto 0; text-align: center; }
.aw-wl__h { margin: 0 0 22px; font: 400 20px/1.2 'EB Garamond', Georgia, serif; letter-spacing: .14em; text-transform: uppercase; color: #c9b27f; }
.aw-wl__g { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.aw-wl__b { position: relative; isolation: isolate; display: flex; align-items: center; justify-content: center; height: 44px; border-radius: 0; border: 1px solid rgba(255,255,255,.06); background: transparent; text-decoration: none; box-shadow: none; transition: background .2s, border-color .2s; }
.aw-wl__b img { position: relative; z-index: 1; height: 20px; width: auto; display: block; opacity: .75; transition: opacity .2s, filter .2s; filter: drop-shadow(0 2px 3px rgba(0,0,0,.85)); }
.aw-wl__b:hover, .aw-wl__b:focus-visible { background: linear-gradient(180deg,#e9e0c6,#ddd2b3); border-color: transparent; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55), inset 0 0 22px rgba(120,100,60,.16); outline: 0; }
.aw-wl__b:hover img, .aw-wl__b:focus-visible img { opacity: .85; filter: brightness(0); }
.aw-wl__b::before { content: ""; position: absolute; inset: 1.5px 0; pointer-events: none; border-top: 1px solid transparent; border-bottom: 1px solid transparent; }
.aw-wl__b:hover::before, .aw-wl__b:focus-visible::before { border-top-color: rgba(59,52,41,.75); border-bottom-color: rgba(59,52,41,.75); }
.aw-wl__b::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 2; opacity: 0; }
.aw-wl__b:hover::after, .aw-wl__b:focus-visible::after { opacity: 1; background: var(--orn-ink-tl) left top/14px 14px no-repeat, var(--orn-ink-tr) right top/14px 14px no-repeat, var(--orn-ink-bl) left bottom/14px 14px no-repeat, var(--orn-ink-br) right bottom/14px 14px no-repeat; }
.aw-wl__b:active { filter: brightness(.95); }
@media (max-width: 480px) { .aw-wl__h { font-size: 16px; margin-bottom: 16px; } .aw-wl__b { height: 40px; } .aw-wl__b img { height: 17px; } .aw-wl__b:hover::after, .aw-wl__b:focus-visible::after { background-size: 12px 12px, 12px 12px, 12px 12px, 12px 12px; } }

.aw-char-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.aw-char { position: relative; }
.aw-quest .ob.is-done { color: #8f8c83; }
.aw-quest .ob.is-done span { text-decoration: line-through; text-decoration-color: rgba(143,140,131,.6); }

/* ===== LOTE DIS 03/10: FIN ===== */

/* ===== TANDA 5 (David 04/10): Traits 100 %, panel «i», reportes, marcos de habilidad, luz del menú — INICIO ===== */
/* ============ 1a. Traits ocupa el 100 % de la ventana (menos el menú superior), sin scroll del navegador (escritorio >= 1200 px) ============ */
@media (min-width: 1200px) {
  body.tt-js, .tt-js body.aw-page-traits:not(:has(.bv-build)) { padding-bottom: 0; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) main.tt-page { box-sizing: border-box; flex: 0 0 auto; height: calc(100vh - var(--aw-topbar-h)); height: calc(100dvh - var(--aw-topbar-h)); min-height: 520px; overflow: hidden;
    max-width: none; padding-bottom: calc(var(--aw-legend-h) + 6px); grid-template-columns: auto auto auto minmax(0, 1fr) auto auto auto; grid-template-rows: 48px auto minmax(0, 1fr) auto; row-gap: 8px; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-stage { height: auto; min-height: 0; align-self: stretch; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-views { grid-row: 2; }
  /* «Seleccionados»: una sola línea (etiqueta + lista en fila); si hay muchos, la lista hace scroll dentro de su caja */
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-selected { grid-row: 4; display: flex; align-items: center; gap: 18px; max-height: none; overflow: hidden; min-height: 40px; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-selected__label { margin: 0; flex: none; min-height: 40px; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-selected ul { flex: 1 1 auto; min-width: 0; display: flex; flex-wrap: wrap; gap: 2px 22px; max-height: 66px; overflow-y: auto; overflow-x: hidden; align-content: center; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-selected li { flex: none; max-width: 100%; }
}

/* ============ 1b. «Cómo usar» + FAQ en un panel central que abre el icono «i» (solo escritorio >= 900 px) ============ */
.tt-info-btn { display: none; }
@media (min-width: 900px) {
  .tt-info-btn { display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0; border-radius: 50%; border: 1px solid var(--aw-line-strong); background: rgba(0,0,0,.28); color: var(--aw-ink-2);
    font: italic 600 1.375rem/1 var(--aw-font-ui); cursor: pointer; transition: border-color var(--aw-t-fast), color var(--aw-t-fast), background var(--aw-t-fast); }
  .tt-info-btn span { display: block; transform: translateY(-1px); }
  .tt-info-btn:hover, .tt-info-btn[aria-expanded="true"] { color: var(--aw-ink-hi); border-color: rgba(255,255,255,.55); background: rgba(255,255,255,.06); }
  .tt-info-btn:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: 2px; }
  .tt-js .tt-info { position: fixed; inset: 0; z-index: 70; display: grid; place-items: center; padding: 20px; visibility: hidden; opacity: 0; pointer-events: none; transition: opacity .18s ease, visibility 0s linear .18s; }
  .tt-js .tt-info.is-open { visibility: visible; opacity: 1; pointer-events: auto; transition: opacity .18s ease; }
  .tt-info__backdrop { position: absolute; inset: 0; background: rgba(8,8,7,.84); }
  .tt-info__panel { position: relative; width: min(980px, 100%); max-height: calc(100vh - 40px); max-height: calc(100dvh - 40px); display: flex; flex-direction: column; background: linear-gradient(180deg, rgba(24,23,20,.985), rgba(14,13,11,.99));
    border: 1px solid var(--aw-line-strong); border-radius: var(--aw-r-xs); box-shadow: var(--aw-shadow-panel); }
  .tt-info__close { position: absolute; top: 8px; right: 8px; z-index: 2; display: grid; place-items: center; width: 44px; height: 44px; color: var(--aw-ink-2); border: 1px solid transparent; border-radius: var(--aw-r-xs); background: none; cursor: pointer; }
  .tt-info__close:hover { color: var(--aw-ink-hi); border-color: var(--aw-line-strong); }
  .tt-info__close:focus-visible { outline: 2px solid var(--aw-focus); outline-offset: 0; }
  .tt-info__close svg { width: 16px; height: 16px; }
  .tt-info__scroll { overflow-y: auto; overflow-x: hidden; padding: 12px clamp(20px, 3vw, 44px) 28px; overscroll-behavior: contain; }
  .tt-info__scroll .aw-intro, .tt-info__scroll .aw-faq { margin: 0; padding: 18px 0 8px; border: 0; background: none; }
  .tt-info__scroll .aw-wrap { max-width: none; padding-inline: 0; }
  .tt-info__scroll .aw-prose { max-width: none; }
  .tt-info__scroll .aw-intro .aw-h2 { padding-right: 52px; }
  html.tt-info-lock { overflow: hidden; }
}

/* ============ 1c. Cajas de reporte: aprovechan alto y ancho en pantallas grandes; sin scroll lateral en ninguna ventana ============ */
body.aw .report-card { overflow-x: hidden; overflow-wrap: anywhere; }
body.aw .report-card * { min-width: 0; }
body.aw .report-card input, body.aw .report-card textarea, body.aw .report-card select { max-width: 100%; box-sizing: border-box; }
body.aw .report-modal { overflow: hidden; }
@media (min-width: 1100px) and (min-height: 640px) {
  /* reporte de habilidad: tarjeta ancha, a todo el alto; «antes» a la izquierda y «después» (rejilla de 6 columnas) a la derecha */
  body.aw .skill-report-card { width: min(1680px, calc(100vw - 48px)); max-width: none; height: calc(100vh - 48px); height: calc(100dvh - 48px); max-height: none; box-sizing: border-box; overflow-y: auto;
    display: grid; grid-template-columns: minmax(300px, 1fr) minmax(0, 2.3fr); grid-template-rows: auto auto auto auto minmax(0, 1fr) auto; gap: 0 24px; align-items: start; padding: 22px 28px 18px; }
  body.aw .skill-report-card > h2, body.aw .skill-report-card > .report-lead { grid-column: 1 / -1; }
  body.aw .skill-report-card > .sr-status-edits { grid-column: 1; grid-row: 3; margin: 0 0 14px; max-height: 34vh; }
  body.aw .skill-report-card > .sr-grid { display: contents; }
  body.aw .skill-report-card .sr-col.is-before { grid-column: 1; grid-row: 4; margin: 0 0 14px; }
  body.aw .skill-report-card > label.report-field:nth-of-type(1) { grid-column: 1; grid-row: 5; margin: 0 0 14px; }
  body.aw .skill-report-card > label.report-field:nth-of-type(2) { grid-column: 1; grid-row: 6; margin: 0; }
  body.aw .skill-report-card .sr-col.is-after { grid-column: 2; grid-row: 3 / span 4; align-self: stretch; margin: 0 0 14px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px 16px; align-content: start; }
  body.aw .skill-report-card .sr-col.is-after > h3 { grid-column: 1 / -1; margin: 0; }
  body.aw .skill-report-card .sr-col.is-after > .report-field { margin: 0; }
  body.aw .skill-report-card #sr-name { }
  body.aw .skill-report-card .sr-col.is-after > label:has(#sr-name) { grid-column: span 3; }
  body.aw .skill-report-card .sr-col.is-after > label:has(#sr-type) { grid-column: span 2; }
  body.aw .skill-report-card .sr-col.is-after > label:has(#sr-cost) { grid-column: span 1; }
  body.aw .skill-report-card .sr-col.is-after > .sr-combo-field, body.aw .skill-report-card .sr-col.is-after > label:has(#sr-desc), body.aw .skill-report-card .sr-col.is-after > .sr-live-preview { grid-column: 1 / -1; }
  body.aw .skill-report-card .sr-col.is-after > label:has(#sr-icon), body.aw .skill-report-card .sr-col.is-after > label:has(#sr-video) { grid-column: span 3; }
  body.aw .skill-report-card #sr-desc { min-height: 160px; height: clamp(160px, 24vh, 320px); }
  body.aw .skill-report-card #sr-note { min-height: 90px; height: clamp(90px, 16vh, 220px); }
  body.aw .skill-report-card > .report-status { grid-column: 1 / -1; }
  body.aw .skill-report-card > .report-actions { grid-column: 1 / -1; grid-row: 7; margin-top: 8px; justify-content: flex-end; }
  body.aw .skill-report-card > .report-actions { display: flex; gap: 10px; }
  body.aw .skill-report-card.is-create { grid-template-columns: minmax(0, 1fr); }
  /* reporte general (fallo / traducción / estado): más ancho, correo y habilidad en dos columnas */
  body.aw #report-modal .report-card { width: min(860px, calc(100vw - 48px)); max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); }
  body.aw #report-modal #report-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; }
  body.aw #report-modal #report-form > * { grid-column: 1 / -1; }
  body.aw #report-modal #report-form > label.report-field:has(input[name="email"]), body.aw #report-modal #report-form > label.report-field:has(input[name="skill"]) { grid-column: span 1; }
}
@media (max-width: 1099px) {
  body.aw .skill-report-card, body.aw .report-card { width: min(960px, calc(100vw - 24px)); max-width: calc(100vw - 24px); box-sizing: border-box; }
}
@media (max-width: 720px) {
  body.aw .report-modal { padding: 8px; }
  body.aw .skill-report-card, body.aw .report-card { max-height: calc(100vh - 16px); max-height: calc(100dvh - 16px); padding: 16px 14px 14px; }
  body.aw .skill-report-card { display: block; }
  body.aw .sr-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ============ 2a. Marco de habilidad activa (ESPECIFICACION habilidades §1): cuadrado detrás + rombo delante, doble línea fina ============ */
.skills-page .tnode--active .tnode__shape { display: none; }
.skills-page .tnode__frame--act { --fa-back: #1d1c19; --fa-front: #22211e; --fa-line: #8f8c83; }
.skills-page .tnode__frame--act .fa-back { fill: var(--fa-back); stroke: var(--fa-line); stroke-width: 1.1; }
.skills-page .tnode__frame--act .fa-front { fill: var(--fa-front); stroke: var(--fa-line); stroke-width: 1.1; }
.skills-page .tnode__frame--act .fa-line { fill: none; stroke: var(--fa-line); stroke-width: .9; }
.skills-page .tnode--active:hover .tnode__frame--act, .skills-page .tnode--active.is-focus .tnode__frame--act { --fa-line: #cfcabb; }
.skills-page .tnode--active.is-locked .tnode__frame--act { opacity: .62; }
.skills-page .tnode--active.is-excluded .tnode__frame--act { opacity: .42; }
.skills-page .tnode--active.is-learned .tnode__frame--act, .skills-page .tnode--active.is-learned:hover .tnode__frame--act, .skills-page .tnode--active.is-learned.is-focus .tnode__frame--act { --fa-back: #dcd8cb; --fa-front: #f6f3ea; --fa-line: #1a1814; opacity: 1; }
.skills-page .tnode--active:not(.is-learned) .tnode__ico { opacity: .6; }
.skills-page .tnode--active.is-locked:not(.is-learned) .tnode__ico { opacity: .42; }
.skills-page .tnode--active.is-learned:not(.is-fx-in) .tnode__fx { border-color: transparent; box-shadow: none; animation: none; }
.skills-page .tnode--active.is-fx-in .tnode__frame--act * { animation: none !important; }

/* ============ 2b. Recuadro de habilidades (§3): a la derecha, centrado en vertical en la ventana, más ancho y tipografía mayor, filigrana en las esquinas, candado ============ */
@media (min-width: 900px) {
  body.skills-page { --tt-side-w: min(560px, calc(100vw - 48px)); }
  .skills-page .tt-side { top: 50%; left: auto; right: 24px; bottom: auto; width: var(--tt-side-w); transform: translateY(-50%); }
  .skills-page .tt-side .aw-detail { position: relative; border: 1px solid rgba(255,255,255,.62); border-radius: 0; background: linear-gradient(180deg, rgba(22,21,18,.97), rgba(13,12,10,.985)); box-shadow: 0 14px 40px rgba(0,0,0,.6); }
  .skills-page .tt-side .aw-detail::before { content: ""; position: sticky; display: block; top: 0; height: 0; pointer-events: none; }
  .skills-page .tt-side::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 3;
    background: var(--orn-gold-tl) left top/22px 22px no-repeat, var(--orn-gold-tr) right top/22px 22px no-repeat, var(--orn-gold-bl) left bottom/22px 22px no-repeat, var(--orn-gold-br) right bottom/22px 22px no-repeat; }
  .skills-page .tt-side .aw-detail__name { font-size: 1.5rem; line-height: 1.15; }
  .skills-page .tt-side .aw-detail__type { font-size: 1rem; }
  .skills-page .tt-side .aw-detail__desc, .skills-page .tt-side .aw-detail__combo, .skills-page .tt-side .aw-detail__section, .skills-page .tt-side .aw-detail__status { font-size: 1.1875rem; line-height: 1.5; }
  .skills-page .tt-side .aw-detail__foot .aw-btn { font-size: 1.0625rem; min-height: 42px; }
  .skills-page .tt-side .aw-detail__cost { font-size: 1.125rem; }
  .skills-page .tt-side [data-vd] { pointer-events: auto; }
}
.aw-detail__lock { display: inline-flex; vertical-align: -2px; margin-left: 10px; color: #e0b43a; }
.aw-detail__lock svg { width: 16px; height: 16px; display: block; }
/* «Ver detalles»: en escritorio es un botón (tecla X) y la ventana flota a la izquierda del recuadro; en móvil sigue siendo el desplegable de siempre */
.aw-detail__vd { appearance: none; display: inline-flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.06); border-radius: 0; background: transparent; color: var(--aw-ink-2); font: 400 1.0625rem/1.2 var(--aw-font-ui); cursor: pointer; }
.aw-detail__vd:hover, .aw-detail__vd[aria-expanded="true"] { border-color: rgba(255,255,255,.28); color: var(--aw-ink-hi); }
.aw-detail__vd .aw-kbd { font-size: .8125rem; }
.tt-statuswin { position: fixed; z-index: 44; top: 149px; /* valor por defecto; lo fija alignStatusWin() con el top real del recuadro */ right: calc(24px + var(--tt-side-w, 560px) + 12px); width: min(380px, calc(100vw - var(--tt-side-w, 560px) - 24px - 24px - 12px)); min-width: 220px; max-height: calc(100vh - 2 * (var(--aw-topbar-h) + 16px));
  max-height: calc(100dvh - 2 * (var(--aw-topbar-h) + 16px)); overflow: auto; padding: 14px 18px 16px; border: 1px solid rgba(255,255,255,.62); background: linear-gradient(180deg, rgba(22,21,18,.97), rgba(13,12,10,.985)); box-shadow: 0 14px 40px rgba(0,0,0,.6); font: 400 1.0625rem/1.5 var(--aw-font-body); }
.tt-statuswin[hidden] { display: none; }
.tt-statuswin .aw-status:first-child { margin-top: 0; }
@media (max-width: 899px) { .tt-statuswin { display: none !important; } }

/* ============ 2c. Menú superior (§4): luz de la opción seleccionada = resplandor (::before) + reflejo (::after), sin brillo en las letras, respiración de 7 s y partículas ============ */
.aw-tabs .aw-tab[aria-current="page"], .aw-tabs .aw-tab[aria-current="true"], .aw-tabs .aw-tab.is-active,
.aw-tabs .aw-tab[aria-current="page"]:hover, .aw-tabs .aw-tab[aria-current="true"]:hover, .aw-tabs .aw-tab.is-active:hover,
.aw-tabs .aw-tab[aria-current="page"]:focus-visible, .aw-tabs .aw-tab.is-active:focus-visible { color: rgb(255,250,240); text-shadow: none; }
.aw-tabs .aw-tab:not(.is-disabled):not([aria-current]):not(.is-active):hover, .aw-tabs .aw-tab:not(.is-disabled):not([aria-current]):not(.is-active):focus-visible { text-shadow: 0 2px 3px rgba(0,0,0,.85), 0 3px 8px rgba(0,0,0,.6); }
.aw-tabs .aw-tab-caret:hover, .aw-tabs .aw-tab-caret[aria-expanded="true"] { filter: none; }
@keyframes aw-breathe-menu7 { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
.aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"])::before,
.aw-tabs .aw-tab-li:has(> .aw-tab[aria-current="page"], > .aw-tab.is-active, > .aw-tab[aria-current="true"])::after { animation: aw-breathe-menu7 7s ease-in-out infinite; }
.aw-tab-pt { position: absolute; left: 0; right: 0; bottom: -9px; height: 0; pointer-events: none; z-index: 1; }
.aw-tab-pt i { position: absolute; bottom: 0; width: var(--s); height: var(--s); border-radius: 50%; background: rgba(232,214,160,.9); box-shadow: 0 0 4px rgba(232,214,160,.7); opacity: 0; animation: aw-tab-up var(--d) linear infinite; }
@keyframes aw-tab-up { 0% { transform: translate(0, 0); opacity: 0; } 15% { opacity: .5; } 60% { opacity: .28; } 100% { transform: translate(var(--dx), -72px); opacity: 0; } }
@media (max-width: 899px) { .aw-tab-pt { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .aw-tabs .aw-tab-li::before, .aw-tabs .aw-tab-li::after { animation: none !important; }
  .aw-tab-pt { display: none; }
}
/* ===== TANDA 5 — FIN ===== */

/* ===== TANDA 6 (David 04/10): Quest «Complete», Traits superpuesto, filigrana plata, mapa 100 % — INICIO ===== */
:root {
  --orn-silver-tl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='rgba(255,255,255,.62)' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.27'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.27'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.27'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='rgba(255,255,255,.62)' stroke='none'/%3E%3C/svg%3E");
  --orn-silver-tr: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='rgba(255,255,255,.62)' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='matrix(-1 0 0 1 28 0)'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.27'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.27'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.27'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='rgba(255,255,255,.62)' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --orn-silver-bl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='rgba(255,255,255,.62)' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='matrix(1 0 0 -1 0 28)'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.27'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.27'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.27'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='rgba(255,255,255,.62)' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
  --orn-silver-br: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='rgba(255,255,255,.62)' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg transform='matrix(-1 0 0 -1 28 28)'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.27'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.27'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.27'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='rgba(255,255,255,.62)' stroke='none'/%3E%3C/g%3E%3C/svg%3E");
}
/* ============ T6-5. Quest: R = «Complete» — la quest sigue en tracking, va al final de la lista, apagada y con la cápsula «(Complete)» a la derecha (img6) ============ */
body.aw .aw-quest .card.is-on.is-complete { color: #77736a; background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.07); box-shadow: none; text-shadow: 0 2px 3px rgba(0,0,0,.85); }
body.aw .aw-quest .card.is-on.is-complete::before { display: none; }
body.aw .aw-quest .card.is-on.is-complete i { display: none; }
body.aw .aw-quest .card.is-complete .qi { opacity: .5; }
body.aw .aw-quest .card.is-complete .bd { opacity: .65; }
body.aw .aw-quest .card .cdone { margin-left: auto; flex: none; padding: 3px 10px; border-radius: 999px; background: rgba(0,0,0,.45); border: 1px solid rgba(255,255,255,.14); color: #d8d4c8;
  font: 500 12px/1.35 Inter, Arial, sans-serif; letter-spacing: .2px; text-shadow: none; white-space: nowrap; }
body.aw .aw-quest .fk.off { opacity: .4; pointer-events: none; }
@media (max-width: 899px) { body.aw .aw-quest .card.is-complete::after { margin-left: 10px; } }

/* ============ T6-B/9/10. Traits (escritorio >= 1200 px): pie superpuesto, transparente y sin reservar altura; «Seleccionados» superpuesto sobre el árbol; letra del recuadro más pequeña ============ */
@media (min-width: 1200px) {
  .tt-js .aw-page-traits:not(:has(.bv-build)) main.tt-page { padding-bottom: 0; grid-template-rows: 48px auto minmax(0, 1fr); }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-stage { grid-column: 1 / -1; grid-row: 3; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-selected { grid-column: 1 / -1; grid-row: 3; align-self: end; justify-self: start; margin: 0 0 calc(var(--aw-legend-h) + 10px) var(--tt-sel-left, 52%);
    width: auto; max-width: min(620px, calc(100% - var(--tt-sel-left, 52%) - 24px)); z-index: 4; background: none; border: 0; pointer-events: none; text-shadow: 0 0 3px #000, 0 1px 6px #000; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-selected ul { pointer-events: auto; }
  .aw-page-traits .aw-legend--traits { background: none; border-top: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; pointer-events: none; text-shadow: 0 0 3px #000, 0 1px 6px #000; }
  .aw-page-traits .aw-legend--traits a, .aw-page-traits .aw-legend--traits button, .aw-page-traits .aw-legend--traits .aw-legend__item { pointer-events: auto; }
}
@media (min-width: 900px) {
  .skills-page .tt-side .aw-detail__name { font-size: 1.25rem; line-height: 1.15; }
  .skills-page .tt-side .aw-detail__type { font-size: .875rem; }
  .skills-page .tt-side .aw-detail__desc, .skills-page .tt-side .aw-detail__combo, .skills-page .tt-side .aw-detail__section, .skills-page .tt-side .aw-detail__status { font-size: 1rem; line-height: 1.45; }
  .skills-page .tt-side .aw-detail__foot .aw-btn { font-size: .9375rem; min-height: 38px; }
  .skills-page .tt-side .aw-detail__cost { font-size: 1rem; }
  /* filigrana del recuadro: plata/blanca (no dorada), trazo rgba(255,255,255,.62) de 1 px, como su borde fino; el dorado queda solo para la luz del menú */
  .skills-page .tt-side::after { background: var(--orn-silver-tl) left top/22px 22px no-repeat, var(--orn-silver-tr) right top/22px 22px no-repeat, var(--orn-silver-bl) left bottom/22px 22px no-repeat, var(--orn-silver-br) right bottom/22px 22px no-repeat; }
}

/* ============ T6-C. Mapa: 100 % de la ventana menos el menú superior, sin scroll del navegador; pie y comandos sin fondo y superpuestos, sin solaparse ============ */
html:has(body.aw-page-map) { overflow: hidden; }
body.aw.aw-page-map { height: 100vh; height: 100dvh; min-height: 0; overflow: hidden; padding-bottom: 0; }
body.aw.aw-page-map > main.aw-map-main { flex: 1 1 0; min-height: 0; overflow: hidden; }
body.aw.aw-page-map > footer.aw-legend--site { position: fixed; left: 0; right: 0; bottom: 0; z-index: 650; margin: 0; padding: 6px 16px 8px; min-height: 0; background: none; border: 0; box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none; pointer-events: none; text-shadow: 0 0 3px #000, 0 1px 4px #000, 0 2px 10px rgba(0,0,0,.8);
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "help note" "list foot"; align-items: center; column-gap: 24px; row-gap: 0; }
body.aw.aw-page-map > footer.aw-legend--site a, body.aw.aw-page-map > footer.aw-legend--site button { pointer-events: auto; }
body.aw.aw-page-map .aw-legend--site .aw-legend__help { grid-area: help; margin: 0; font-size: .8125rem; line-height: 1.3; flex: none; }
body.aw.aw-page-map .aw-legend--site .aw-legend__list { grid-area: list; margin: 0; }
body.aw.aw-page-map .aw-legend--site .aw-legend__note { grid-area: note; margin: 0; font-size: .8125rem; justify-self: end; text-align: right; }
body.aw.aw-page-map .aw-legend--site .aw-legend__foot { grid-area: foot; flex: none; border-top: 0; padding-top: 0; margin: 0; justify-self: end; }
body.aw.aw-page-map .aw-legend--site .aw-langlinks { flex-wrap: wrap; justify-content: flex-end; }
/* los elementos del mapa se apilan sobre el pie: --map-b = altura que ocupa el pie (la pone mapa.js) */
body.aw-page-map .map-credit { bottom: var(--map-b, 110px); background: none; padding-block: 0; text-shadow: 0 0 3px #000, 0 1px 4px #000, 0 2px 8px rgba(0,0,0,.8); color: #d8d4c8; }
body.aw-page-map .map-sol { bottom: calc(var(--map-b, 110px) + 22px); }
body.aw-page-map .map-zone { bottom: calc(var(--map-b, 110px) + 26px); }
body.aw-page-map .map-zoom { bottom: calc(var(--map-b, 110px) + 24px); }
@media (max-width: 899px) {
  body.aw.aw-page-map > footer.aw-legend--site { bottom: var(--aw-mnav-h); padding: 4px 10px 6px; grid-template-columns: minmax(0, 1fr); grid-template-areas: "help" "foot"; row-gap: 0; }
  body.aw.aw-page-map .aw-legend--site .aw-legend__help { font-size: .75rem; text-align: center; }
  body.aw.aw-page-map .aw-legend--site .aw-legend__list, body.aw.aw-page-map .aw-legend--site .aw-legend__note { display: none; }
  body.aw.aw-page-map .aw-legend--site .aw-legend__foot { justify-self: stretch; overflow-x: auto; scrollbar-width: none; }
  body.aw.aw-page-map .aw-legend--site .aw-langlinks { flex-wrap: nowrap; justify-content: flex-start; white-space: nowrap; gap: 0 2px; }
  body.aw.aw-page-map .aw-legend--site .aw-langlinks a { min-height: 32px; padding-inline: 8px; font-size: .8125rem; }
}
/* ===== TANDA 6 — FIN ===== */

/* ===== TANDA 7 (David 04/10 03:38): Traits clase/armas/puntos, tags, Character v2, Quest v2, mapa — INICIO ===== */
/* ============ T7-1/2/3. Traits: clase (4 botones crema) + armas (Z/C) + nombre + «Available Points» + ayuda de ratón; visto verde y coste en rojo ============ */
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr { display: block; width: 100%; max-width: 560px; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .aw-picker { display: block; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .aw-picker__label { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; padding: 0; border: 0; }
/* clase: mismos seleccionables que las Core Abilities (crema + doble línea fina + filigrana en las 4 esquinas) */
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] { display: flex; flex-wrap: wrap; gap: 8px; overflow: visible; height: auto; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick { position: relative; flex: none; width: auto; min-width: 0; height: 44px; padding: 0 18px 0 12px; display: flex; align-items: center; gap: 9px; justify-items: normal;
  color: #a8a296; background: transparent; border: 1px solid rgba(255,255,255,.08); border-radius: 0; box-shadow: none; font: 400 19px/1 var(--aw-font-ui); text-shadow: 0 2px 3px rgba(0,0,0,.85); transition: background .15s, color .15s; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick__icon { width: 28px; height: 28px; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick__icon::before { display: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick__icon img { width: 28px; height: 28px; opacity: 1; filter: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick__label { position: static; width: auto; height: auto; margin: 0; clip: auto; overflow: visible; font: inherit; line-height: 1; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick__badge { display: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick i { display: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick:hover, .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick:focus-visible { color: #d9d2c2; border-color: rgba(255,255,255,.28); background: transparent; outline: 0; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick.is-active, .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick[aria-selected="true"] { color: #2a251d; border-color: transparent; text-shadow: none; background: linear-gradient(180deg,#e9e0c6,#ddd2b3);
  box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55), inset 0 0 22px rgba(120,100,60,.16); }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick.is-active::after { content: ""; position: absolute; inset: 1.5px 0; border-top: 1px solid rgba(59,52,41,.75); border-bottom: 1px solid rgba(59,52,41,.75); pointer-events: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick.is-active .aw-pick__icon img { filter: brightness(0) opacity(.85); }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick.is-active i { display: block; position: absolute; width: 20px; height: 20px; pointer-events: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick.is-active i:nth-of-type(1) { left: 0; top: 0; background: var(--orn-ink-tl) 0 0/100% 100% no-repeat; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick.is-active i:nth-of-type(2) { right: 0; top: 0; background: var(--orn-ink-tr) 0 0/100% 100% no-repeat; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick.is-active i:nth-of-type(3) { left: 0; bottom: 0; background: var(--orn-ink-bl) 0 0/100% 100% no-repeat; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick.is-active i:nth-of-type(4) { right: 0; bottom: 0; background: var(--orn-ink-br) 0 0/100% 100% no-repeat; }
/* armas de la clase: Z · 3 iconos (caja 52, icono 40) · C; brillo suave de 44 px solo tras el activo; puntos gastados debajo; sin puntos rojos */
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .aw-picker--sm { margin-top: 14px; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .tt-wrow { display: flex; align-items: flex-start; gap: 6px; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .tt-key { flex: none; display: inline-grid; place-items: center; min-width: 28px; height: 28px; margin-top: 12px; padding: 0 6px; border: 1px solid #aaa79d; border-radius: 4px; background: none; color: #d8d4c8; font: 500 13px Inter, Arial, sans-serif; cursor: pointer; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .tt-key:hover { border-color: #e9e6dc; color: #fff; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] { display: flex; gap: 6px; overflow: visible; height: auto; align-items: flex-start; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick { flex: none; width: 64px; min-width: 64px; height: auto; padding: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 2px;
  background: transparent; border: 0; border-radius: 0; box-shadow: none; color: #cfcabc; opacity: .62; transition: opacity .25s; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick:hover, .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick:focus-visible { opacity: .92; background: transparent; outline: 0; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick.is-active, .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick[aria-selected="true"] { opacity: 1; background: transparent; box-shadow: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick__icon { width: 52px; height: 52px; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick__icon::before { inset: auto; width: 44px; height: 44px; border: 0; border-radius: 50%; transform: none; box-shadow: none; background: transparent; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick.is-active .aw-pick__icon::before { background: radial-gradient(circle, rgba(255,244,214,.34) 0%, rgba(255,244,214,.12) 52%, rgba(255,244,214,0) 74%); border: 0; box-shadow: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick__icon img { width: 40px; height: 40px; opacity: 1; filter: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick.is-active .aw-pick__icon img { opacity: 1; filter: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick__label { display: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick__badge, .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-weapon-list] .aw-pick.is-active .aw-pick__badge { position: static; transform: none; min-width: 0; height: auto; padding: 0; border: 0; border-radius: 0; background: transparent; display: block;
  font: 400 16px/1 var(--aw-font-ui); color: #cfcabc; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .tt-wname { margin: 8px 0 0 34px; font: 400 18px/1.2 var(--aw-font-ui); color: #f1eee4; letter-spacing: .2px; text-shadow: none; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .aw-picker--sm.is-swap { animation: tt7swap .2s ease; }
@keyframes tt7swap { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .aw-picker--sm.is-swap { animation: none; } }
/* puntos y ayuda de ratón */
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-points { margin: 12px 0 0; padding: 10px 2px 6px; display: flex; align-items: baseline; gap: 10px; font: 400 24px/1.2 var(--aw-font-ui); color: #cfcabc; text-align: left;
  background: linear-gradient(90deg, rgba(255,255,255,.28), rgba(255,255,255,.06) 80%, transparent) top left/100% 1px no-repeat; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-points b { font-weight: 500; font-size: 28px; color: #fff; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-points b.is-over { color: #e5483c; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hint { display: flex; align-items: center; gap: 10px; margin: 0; padding: 2px; font: 400 15px/1.3 var(--aw-font-ui); color: #8f8c83; text-align: left; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hint svg { width: 18px; height: 18px; flex: none; color: #b9b5a8; }
/* recuadro de habilidad: coste claro por defecto, rojo #e5483c si los puntos no alcanzan; visto verde #59a26a donde estaba el candado */
.skills-page .tt-side .aw-detail__cost { color: #e9e6dc; }
.skills-page .tt-side .aw-detail__cost.is-short { color: #e5483c; }
.aw-detail__ok { display: inline-flex; vertical-align: -3px; margin-left: 10px; color: #59a26a; }
.aw-detail__ok svg { width: 20px; height: 20px; display: block; }

/* ---- escritorio >= 1200 px: columna izquierda de 560 px con cabecera + selector + puntos; el árbol a su derecha, alineado a la izquierda ---- */
@media (min-width: 1200px) {
  .tt-js .aw-page-traits:not(:has(.bv-build)) main.tt-page { grid-template-columns: 560px minmax(0, 1fr); grid-template-rows: repeat(5, auto) minmax(0, 1fr); column-gap: 10px; row-gap: 0; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-clsrow { grid-column: 1; grid-row: 1; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr, .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .aw-picker { display: contents; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr .aw-picker--sm { display: block; grid-column: 1; grid-row: 2; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-points { grid-column: 1; grid-row: 3; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hint { grid-column: 1; grid-row: 4; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-views { grid-column: 1; grid-row: 5; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-stage { grid-column: 2; grid-row: 1 / -1; }
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-selected { grid-column: 1; grid-row: 6; align-self: end; justify-self: start; width: 100%; max-width: 560px; margin: 0 0 calc(var(--aw-legend-h) + 10px); }
}

/* ---- móvil / tablet < 1200 px: las 4 clases en una fila (icono; con el nombre solo la activa), armas debajo ---- */
@media (max-width: 1199px) {
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] { flex-wrap: nowrap; gap: 6px; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick { height: 44px; min-width: 44px; padding: 0 10px; justify-content: center; font-size: 17px; gap: 7px; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick:not(.is-active) .aw-pick__label { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-hdr [data-class-list] .aw-pick.is-active { padding: 0 14px 0 10px; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-points { font-size: 20px; margin-top: 10px; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-points b { font-size: 24px; }
}

/* ============ T8 (v20). Traits: botones recolocados, columna vertical, Seleccionados desplegable, Catálogo en ventana, controles, «Reporte»; ramas; «Ver detalles» ============ */
/* fila de clase: las 4 pestañas y «Character select» a su derecha */
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-clsrow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.skills-page.aw-page-traits:not(:has(.bv-build)) .tt-clsrow .cs-open { flex: none; height: 44px; min-height: 44px; padding: 0 16px; font: 400 17px/1 var(--aw-font-ui); white-space: nowrap; margin: 0; }
/* «Reporte»: solo escritorio ancho; debajo de 1200 px sigue el boton largo de siempre */
.tt-rep-btn { display: none; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border: 1px solid var(--aw-line-strong); background: rgba(0,0,0,.28); color: var(--aw-ink-2); font: 400 1rem/1 var(--aw-font-ui); cursor: pointer; border-radius: 0; }
.tt-rep-btn svg { width: 16px; height: 16px; display: block; flex: none; }
.tt-rep-btn:hover { color: var(--aw-ink-hi); border-color: rgba(255,255,255,.55); background: rgba(255,255,255,.06); }
.tt-selwrap, .tt-v-share, .tt-v-copy { display: none; }
@media (min-width: 1200px) {
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-clsrow { position: relative; z-index: 6; width: max-content; flex-wrap: nowrap; }
  /* arriba a la derecha: Build, budget and controls · i · Reporte */
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-title__tools { position: fixed; top: calc(var(--aw-topbar-h) + 8px); right: 24px; z-index: 30; display: flex; align-items: center; gap: 10px; margin: 0; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-opts-toggle { display: inline-flex; grid-column: auto; grid-row: auto; width: auto; height: 44px; min-height: 44px; margin: 0; padding: 0 16px; font: 400 17px/1 var(--aw-font-ui); }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-controls { position: absolute; top: calc(100% + 8px); right: 0; left: auto; margin: 0; z-index: 40; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-rep-btn { display: inline-flex; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-report-note { display: none !important; }
  /* columna vertical de botones iguales (200x32, separacion 8) bajo «Arbol de habilidades» */
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-views { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; width: 200px; margin: 14px 0 0; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-views > .aw-btn, .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-selbtn { width: 200px; height: 32px; min-height: 32px; margin: 0; padding: 0 14px; justify-content: flex-start; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-selwrap { display: block; position: relative; width: 200px; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-v-share, .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-v-copy { display: inline-flex; gap: 8px; align-items: center; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-v-share svg, .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-v-copy svg { width: 16px; height: 16px; flex: none; }
  .aw-legend--traits [data-act="share"], .aw-legend--traits [data-act="copy"] { display: none !important; }
  /* el cuadro «Seleccionados» de abajo se sustituye por el boton con panel */
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-selected { display: none !important; }
  /* franja libre arriba del arbol para que los botones de arriba (Character select, controles, i, Reporte) no tapen ningun nodo */
  .tt-js .aw-page-traits:not(:has(.bv-build)) .tt-stage { margin-top: 48px; }
}
.tt-selbtn b { font-weight: 600; margin-left: 6px; color: var(--aw-ink-hi); }
.tt-selpop { position: absolute; z-index: 60; top: -1px; left: 100%; width: 340px; max-height: min(46vh, 420px); overflow: auto; padding: 14px 18px 16px; border: 1px solid rgba(255,255,255,.62);
  background: linear-gradient(180deg, rgba(22,21,18,.97), rgba(13,12,10,.985)); box-shadow: 0 14px 40px rgba(0,0,0,.6); text-align: left; }
.tt-selpop[hidden] { display: none; }
.tt-selpop ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.tt-selpop li { display: flex; justify-content: space-between; gap: 12px; font: 400 1rem/1.4 var(--aw-font-body); color: var(--aw-ink); }
.tt-selpop li b { color: #e2a24c; font-weight: 600; }
.tt-selpop li.is-empty { color: var(--aw-ink-2); }
.tt-selpop h4 { margin: 0 0 10px; font: 600 .8125rem/1 var(--aw-font-ui); letter-spacing: .1em; text-transform: uppercase; color: var(--aw-ink-2); }
.tt-selpop .tt-remaining { margin: 10px 0 0; color: var(--aw-ink-2); }
/* ventana «Catálogo» sobre la rama */
.tt-catwin { position: fixed; z-index: 40; left: 560px; right: 24px; top: calc(var(--aw-topbar-h) + 66px); bottom: calc(var(--aw-legend-h) + 14px); display: flex; flex-direction: column; border: 1px solid rgba(255,255,255,.62);
  background: linear-gradient(180deg, rgba(22,21,18,.97), rgba(13,12,10,.985)); box-shadow: 0 14px 40px rgba(0,0,0,.6); }
.tt-catwin[hidden] { display: none; }
.tt-catwin header { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px 12px 22px; border-bottom: 1px solid rgba(255,255,255,.12); }
.tt-catwin h3 { margin: 0; font: 600 1.25rem/1 var(--aw-font-ui); color: var(--aw-ink-hi); }
.tt-catwin__x { appearance: none; width: 36px; height: 36px; border: 1px solid var(--aw-line-strong); background: rgba(0,0,0,.28); color: var(--aw-ink-2); font: 400 1.5rem/1 var(--aw-font-ui); cursor: pointer; }
.tt-catwin__x:hover { color: var(--aw-ink-hi); border-color: rgba(255,255,255,.55); }
.tt-catwin__body { overflow: auto; padding: 8px 22px 22px; }
.tt-catwin .tt-catalog__sec { margin-top: 18px; }
.tt-catwin .tt-catalog__sec h3 { margin: 0 0 12px; font: 600 1.0625rem/1.2 var(--aw-font-ui); color: var(--aw-ink-hi); letter-spacing: .04em; }
.tt-catwin .tt-catalog__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 22px 12px; }
.tt-catwin .tt-catalog__item { width: auto; display: grid; justify-items: center; align-content: start; gap: 8px; }
.tt-catwin .tt-catalog__item .tnode { position: relative; left: auto; top: auto; margin: 6px 0 0; width: 60px; height: 60px; transform: none; }
.tt-catwin .tt-catalog__item .tnode img { width: 100%; height: 100%; object-fit: contain; }
.tt-catwin .tt-catalog__name { font: 400 .875rem/1.3 var(--aw-font-ui); color: var(--aw-ink); text-align: center; max-width: 124px; text-wrap: balance; overflow-wrap: anywhere; }
/* botones de controles (teclado / PlayStation / Xbox): 64x48, el seleccionado en crema (anula la regla marron .device-pill.is-on, .device-pill:hover de aw-site.css) */
.tt-controls .device-pills { gap: 10px; }
.aw .tt-controls .device-pill { width: 64px; height: 48px; padding: 0; justify-content: center; border: 1px solid rgba(255,255,255,.18); background: rgba(0,0,0,.28); }
.aw .tt-controls .device-pill img { width: 30px; height: 30px; opacity: .8; }
.aw .tt-controls .device-pill.is-on { background: linear-gradient(180deg, #e9e0c6, #ddd2b3) !important; border-color: transparent; color: #2a251d; box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.45); }
.aw .tt-controls .device-pill.is-on img { filter: brightness(0) opacity(.85); opacity: 1; }
.aw .tt-controls .device-pill:hover:not(.is-on) { background: rgba(255,255,255,.06) !important; border-color: rgba(255,255,255,.5); }
.aw .tt-controls .device-pill.is-on, .aw .tt-controls .device-pill.is-on:hover { background: linear-gradient(180deg, #e9e0c6, #ddd2b3) !important; color: #2a251d; }
/* ramas: pasivas y de estado «disponibles» ya no se iluminan como seleccionadas; las activas no cambian (Dis, ramas/fix.css) */
.skills-page .tnode--passive.is-available, .skills-page .tnode--stat.is-available { --frame: rgba(168, 162, 150, .6); --rim: rgba(168, 162, 150, .6); }
.skills-page .tnode--passive.is-available .tnode__shape::after, .skills-page .tnode--stat.is-available .tnode__shape::after { background: #2b2924; }
.skills-page .tnode--passive.is-available .tnode__ico, .skills-page .tnode--stat.is-available .tnode__ico { opacity: .62; }
.skills-page .tnode--passive.is-available:hover, .skills-page .tnode--stat.is-available:hover { --frame: rgba(236, 229, 212, .9); }
.skills-page .tnode--passive.is-available:hover .tnode__ico, .skills-page .tnode--stat.is-available:hover .tnode__ico { opacity: .9; }

/* ===== v21 (David 04/10 09:19): MISMO grosor de linea y marco en todos los nodos y estados =====
   Causa: (1) kit/base.css daba a .tlink 1px y a .tlink.is-on 1.6px (la linea entre dos nodos aprendidos salia mas gorda que las demas);
   (2) los marcos de las habilidades ACTIVAS (.tnode__frame--act) dibujaban su trazo en unidades del viewBox (1.1 y .9 de 100) SIN non-scaling-stroke,
   asi que su grosor dependia del tamano del nodo y del zoom del arbol (0.2-0.4 px), mientras que los marcos de pasivas/estado y las lineas son non-scaling
   (1.5 px y 1 px). Ahora todo es non-scaling con el mismo valor; el estado solo cambia color/brillo. */
.skills-page .tt-links .tlink, .skills-page .tt-links .tlink.is-on, .skills-page .tt-links .tlink.is-open, .skills-page .tt-links .tlink.is-dim { stroke-width: 1.5px; vector-effect: non-scaling-stroke; }
.skills-page .tnode__frame--act .fa-back, .skills-page .tnode__frame--act .fa-front { stroke-width: 1.5px; vector-effect: non-scaling-stroke; }
.skills-page .tnode__frame--act .fa-line { stroke-width: 1px; vector-effect: non-scaling-stroke; }

/* ===== v22 (David 04/10 09:48): SOLO movil (<900 px): «Character select» ENCIMA de los botones de clase, alineado a la izquierda. Escritorio y tableta sin cambios ===== */
@media (max-width: 899px) {
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-clsrow { flex-direction: column; align-items: flex-start; flex-wrap: nowrap; gap: 8px; }
  .skills-page.aw-page-traits:not(:has(.bv-build)) .tt-clsrow .cs-open { order: -1; }
}

/* ===== v22 (David 04/10 09:57): MENU INFERIOR MOVIL (<900 px) con la luz del menu superior (§4 de habilidades-diseno/ESPECIFICACION.md) =====
   1) Fallo de la «caja clara» detras del texto: el resplandor se recortaba al ancho de la pestaña (overflow:hidden, 65 px) y salia como un rectangulo; ademas las letras
      llevaban text-shadow luminoso (el §4 dice que las letras no emiten luz). Ahora: resplandor (::before) y reflejo (::after) pueden salir de la pestaña, sin brillo en las letras.
   2) Respiracion de 7 s (opacidad .6 a 1) en las dos capas y particulas (8, suben 44 px). Sin animacion con prefers-reduced-motion. */
@keyframes aw-tab-up-m { 0% { transform: translate(0, 0); opacity: 0; } 15% { opacity: .5; } 60% { opacity: .28; } 100% { transform: translate(var(--dx), -44px); opacity: 0; } }
@media (max-width: 899px) {
  .aw-mnav .aw-mtab { overflow: visible; }
  .aw-mnav .aw-mtab::before { left: -10%; right: -10%; height: 70%; }
  .aw-mnav .aw-mtab::after { left: -34%; right: -34%; }
  .aw-mnav .aw-mtab[aria-current], .aw-mnav .aw-mtab.is-within, .aw-mnav .aw-mtab--more[aria-expanded="true"],
  .aw-mnav .aw-mtabs.is-more-open .aw-mtab--more[aria-expanded="true"] { color: rgb(255,250,240); text-shadow: none; }
  .aw-mnav .aw-mtabs:not(.is-more-open) .aw-mtab[aria-current]::before, .aw-mnav .aw-mtabs:not(.is-more-open) .aw-mtab[aria-current]::after,
  .aw-mnav .aw-mtabs:not(.is-more-open) .aw-mtab.is-within::before, .aw-mnav .aw-mtabs:not(.is-more-open) .aw-mtab.is-within::after,
  .aw-mnav .aw-mtabs.is-more-open .aw-mtab--more[aria-expanded="true"]::before, .aw-mnav .aw-mtabs.is-more-open .aw-mtab--more[aria-expanded="true"]::after { animation: aw-breathe-menu7 7s ease-in-out infinite; }
  .aw-mnav .aw-tab-pt { display: none; bottom: 2px; }
  .aw-mnav .aw-tab-pt i { animation-name: aw-tab-up-m; }
  .aw-mnav .aw-mtabs:not(.is-more-open) .aw-mtab[aria-current] > .aw-tab-pt, .aw-mnav .aw-mtabs:not(.is-more-open) .aw-mtab.is-within > .aw-tab-pt,
  .aw-mnav .aw-mtabs.is-more-open .aw-mtab--more[aria-expanded="true"] > .aw-tab-pt { display: block; }
}
@media (max-width: 899px) and (prefers-reduced-motion: reduce) { .aw-mnav .aw-tab-pt { display: none !important; } }
/* ============ T7-4. Tags de tipo de noticia: se ajustan a su texto (antes se estiraban al ancho de la tarjeta) ============ */
.game-tag { display: block; width: fit-content; max-width: 100%; }
/* ============ T7-5/6. Character v2 (Dis, tanda 6 punto 7 aprobada): selector de 4 clases, 3 columnas, 100 % de la ventana sin scroll, sin segundo menú, sin punto rojo ============ */
.aw-char { --bg:#0b0b09;--tx:#e9e6dc;--mut:#8f8c83;--gold:#c8b98d;--sel:#d1cab7;--blue:#3682b8;--bar:rgba(255,255,255,.055);--line:rgba(255,255,255,.09) }
.aw-char, .aw-char * { box-sizing:border-box;margin:0;padding:0 }
main.aw-char { position:relative;display:flex;flex-direction:column;max-width:none;width:100%;color:var(--tx);font:400 17px/1.2 'EB Garamond','Cormorant Garamond',Georgia,serif;
  background:linear-gradient(rgba(11,11,9,.50),rgba(11,11,9,.50)),url(../img/quest-fondo.webp) center/cover fixed #0b0b09;
  height:calc(100vh - var(--aw-topbar-h,84px));height:calc(100dvh - var(--aw-topbar-h,84px));min-height:0;overflow:hidden }
.aw-char-sr { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap }
.aw-char button { font:inherit;color:inherit;background:none;border:0;cursor:pointer }
.aw-char .ic { width:22px;height:22px;flex:none;color:#d8d4c8 }
.aw-char .key { display:inline-grid;place-items:center;min-width:24px;height:24px;border:1px solid #aaa79d;border-radius:4px;font:500 13px Inter,Arial,sans-serif;color:#d8d4c8;padding:0 5px }
.aw-char .main { flex:1;display:grid;grid-template-columns:312px 300px 320px;gap:66px 36px;justify-content:center;padding:34px 24px 20px }
.aw-char .left { grid-row:1/3 }
.aw-char .subnav { display:flex;justify-content:center;align-items:center;gap:16px;margin-bottom:8px }
.aw-char .subnav .ic { width:20px;height:20px }
.aw-char .cap { text-align:center;font-size:14px;color:var(--mut);margin-bottom:14px }
.aw-char .name { display:flex;align-items:center;gap:10px;font-size:23px;color:#fff;margin-bottom:10px }
.aw-char .name .ic { width:26px;height:26px }
.aw-char .lvl { display:flex;justify-content:space-between;font-size:14.5px;color:var(--mut);margin-bottom:6px }
.aw-char .lvl b { font-weight:400;color:#fff;margin-right:6px }
.aw-char .exp { height:3px;background:#2b2a26;margin-bottom:16px }
.aw-char .exp i { display:block;height:100%;width:30.56%;background:#cfc8b3 }
.aw-char .qs { display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin-bottom:20px }
.aw-char .q { display:flex;align-items:center;gap:9px;font-size:17px }
.aw-char .q .dm { width:30px;height:30px;display:grid;place-items:center;background:#171613;transform:rotate(45deg);border:1px solid #3a3832 }
.aw-char .q .dm .ic { transform:rotate(-45deg);width:16px;height:16px }
.aw-char .q small { font-size:13px;color:var(--mut);margin-right:5px }
.aw-char .q span.t { display:flex;align-items:baseline;gap:4px;flex-wrap:wrap }
.aw-char .up { display:inline-flex;align-items:center;gap:3px;color:var(--blue);font-size:13.5px;margin-left:6px;white-space:nowrap }
.aw-char .up i { width:0;height:0;border:4px solid transparent;border-bottom:6px solid var(--blue);border-top:0 }
.aw-char .sh { display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--mut);margin-bottom:6px }
.aw-char .sp { display:flex;justify-content:space-between;align-items:center;color:var(--gold);padding:8px 10px;font-size:17px;border-bottom:1px solid var(--line) }
.aw-char .sp b { font-weight:400;color:#fff;position:relative;padding-right:12px }
.aw-char .cal { list-style:none }
.aw-char .ca { position:relative;display:flex;align-items:center;gap:14px;height:50px;padding:0 12px 0 16px;margin-bottom:6px;color:#a8a296;border:1px solid rgba(255,255,255,.06);outline:0;cursor:default;text-shadow:0 2px 3px rgba(0,0,0,.85);transition:background .15s,color .15s }
.aw-char .cic { width:22px;height:22px;flex:none;display:grid;place-items:center;background:#1c1a16;transform:rotate(45deg);outline:1px solid rgba(168,162,150,.35);outline-offset:2px;margin-right:4px }
.aw-char .cic .ic { width:14px;height:14px;transform:rotate(-45deg) }
.aw-char .ca .lb { flex:1;font-size:19px }
.aw-char .cv { display:flex;align-items:center;gap:2px;font-size:19px }
.aw-char .cv em { font-style:normal;min-width:30px;text-align:center }
.aw-char .ar { width:26px;height:30px;font-size:24px;line-height:26px;color:#d2ccbe;text-shadow:none;border-radius:2px }
.aw-char .ar:hover:not(:disabled) { color:#fff;background:rgba(255,255,255,.08) }
.aw-char .ar:disabled { opacity:.25;cursor:not-allowed }
.aw-char .ar-l { visibility:hidden }
.aw-char .ca:hover, .aw-char .ca:focus-visible { color:#d9d2c2;border-color:rgba(255,255,255,.28) }
.aw-char .ca i { display:none }
.aw-char .ca.is-lit { color:#2a251d;border-color:transparent;text-shadow:none;background:linear-gradient(180deg,#e9e0c6,#ddd2b3);box-shadow:inset 0 1px 0 rgba(59,52,41,.55),inset 0 -1px 0 rgba(59,52,41,.55),inset 0 0 22px rgba(120,100,60,.16) }
.aw-char .ca.is-lit::before { content:"";position:absolute;inset:1.5px 0;border-top:1px solid rgba(59,52,41,.75);border-bottom:1px solid rgba(59,52,41,.75);pointer-events:none }
.aw-char .ca.is-lit i { display:block;position:absolute;width:20px;height:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%233b3429' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.3'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.105'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.04'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%233b3429' stroke='none'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat;pointer-events:none }
.aw-char .ca.is-lit i:nth-of-type(1) { left:0;top:0 }
.aw-char .ca.is-lit i:nth-of-type(2) { right:0;top:0;transform:scaleX(-1) }
.aw-char .ca.is-lit i:nth-of-type(3) { left:0;bottom:0;transform:scaleY(-1) }
.aw-char .ca.is-lit i:nth-of-type(4) { right:0;bottom:0;transform:scale(-1,-1) }
.aw-char .ca.is-lit .cic { background:#2a251d;outline-color:rgba(42,37,29,.55) }
.aw-char .ca.is-lit .cic .ic { color:#e9e0c6 }
.aw-char .ca.is-lit .ar { color:#2a251d }
.aw-char .ca.is-lit .ar:hover:not(:disabled) { background:rgba(42,37,29,.12) }
.aw-char .ca.is-lit .ar-l { visibility:visible }
.aw-char .sec h2 { display:flex;align-items:center;gap:10px;font-weight:400;font-size:19px;color:var(--gold);margin-bottom:8px;padding:0 4px }
.aw-char .sec h2 .h { width:24px;height:24px;color:var(--gold) }
.aw-char .sec ul { list-style:none }
.aw-char .st { display:flex;align-items:center;gap:12px;height:38px;padding:0 8px 0 4px;font-size:17px;outline:0 }
.aw-char .st .lb { flex:1 }
.aw-char .st .vl { min-width:22px;text-align:right }
.aw-char .st .bn { min-width:68px;text-align:left }
.aw-char .st:hover, .aw-char .st.is-hl { background:var(--bar) }
.aw-char .foot button { font:inherit;background:none;border:0;cursor:pointer }
.aw-char .foot button:disabled { cursor:default }
.aw-char .foot { display:flex;gap:44px;padding:0 24px 22px 210px;font-size:17px }
.aw-char .fk { display:flex;align-items:center;gap:10px;color:#e9e6dc }
.aw-char .fk.off { color:#5c5a54 }
.aw-char .fk.off .key { border-color:#4a4843;color:#5c5a54 }
.aw-char .cls { flex:none;display:flex;justify-content:center;align-items:center;gap:10px;height:64px;background:rgba(8,8,6,.90);border-bottom:1px solid var(--line) }
.aw-char .cl { position:relative;width:46px;height:46px;display:grid;place-items:center;opacity:.55;transition:opacity .15s }
.aw-char .cl img { width:40px;height:40px;object-fit:contain }
.aw-char .cl:hover, .aw-char .cl:focus-visible { opacity:.9;outline:0 }
.aw-char .cl.is-on { opacity:1 }
.aw-char .cl.is-on::before { content:"";position:absolute;width:52px;height:52px;border-radius:50%;background:radial-gradient(circle,rgba(255,244,214,.30) 0%,rgba(255,244,214,.10) 50%,rgba(255,244,214,0) 72%) }
.aw-char .cl img { position:relative }
.aw-char .main { flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto 1fr;gap:0;justify-content:stretch;padding:0 }
.aw-char .main>* { min-width:0;padding:18px 56px 64px }
.aw-char .left { grid-row:1/4;background:rgba(8,8,6,.90) }
.aw-char .main>.sec { background:rgba(8,8,6,.70);grid-column:2;padding-top:12px;padding-bottom:0 }
.aw-char .main>.sec:nth-of-type(2) { background:rgba(8,8,6,.55);grid-column:3;grid-row:1/4;padding-top:18px }
.aw-char .main>.sec:nth-of-type(4) { padding-bottom:64px }
.aw-char .sec h2 { margin-bottom:4px }
.aw-char .subnav { margin-bottom:2px }
.aw-char .cap { margin-bottom:8px }
.aw-char .name { margin-bottom:6px }
.aw-char .exp { margin-bottom:10px }
.aw-char .qs { margin-bottom:10px;gap:6px 18px }
.aw-char .ca { height:42px;margin-bottom:4px }
.aw-char .st { height:31px }
.aw-char .sp { padding:5px 10px }
.aw-char .foot { position:fixed;left:0;right:0;bottom:0;padding:0 24px 18px;justify-content:center;z-index:4;background:none }
.aw-char .ar { display:grid;place-items:center }
.aw-char .ar svg { display:block }
.aw-char .ca:not(.is-lit) .ar-r { color:#e9e6dc }
.aw-char .ca.is-lit .ar { color:#16130e }
.aw-char .sp { background:linear-gradient(180deg,#1a1814 0%,#100e0c 100%);border-bottom:0 }
.aw-char .cls { gap:12px;height:64px }
.aw-char .cl { position:relative;width:auto;height:46px;display:flex;align-items:center;gap:10px;padding:0 22px 0 14px;opacity:1;color:#a8a296;border:1px solid rgba(255,255,255,.06);font-size:19px;text-shadow:0 2px 3px rgba(0,0,0,.85);transition:background .15s,color .15s }
.aw-char .cl::before { display:none!important }
.aw-char .cl img { width:30px;height:30px;filter:none }
.aw-char .cl i { display:none }
.aw-char .cl:hover, .aw-char .cl:focus-visible { color:#d9d2c2;border-color:rgba(255,255,255,.28);outline:0 }
.aw-char .cl.is-on { color:#2a251d;border-color:transparent;text-shadow:none;background:linear-gradient(180deg,#e9e0c6,#ddd2b3);box-shadow:inset 0 1px 0 rgba(59,52,41,.55),inset 0 -1px 0 rgba(59,52,41,.55),inset 0 0 22px rgba(120,100,60,.16) }
.aw-char .cl.is-on::after { content:"";position:absolute;inset:1.5px 0;border-top:1px solid rgba(59,52,41,.75);border-bottom:1px solid rgba(59,52,41,.75);pointer-events:none }
.aw-char .cl.is-on i { display:block;position:absolute;width:20px;height:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%233b3429' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.3'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.105'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.04'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%233b3429' stroke='none'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat;pointer-events:none }
.aw-char .cl.is-on i:nth-of-type(1) { left:0;top:0 }
.aw-char .cl.is-on i:nth-of-type(2) { right:0;top:0;transform:scaleX(-1) }
.aw-char .cl.is-on i:nth-of-type(3) { left:0;bottom:0;transform:scaleY(-1) }
.aw-char .cl.is-on i:nth-of-type(4) { right:0;bottom:0;transform:scale(-1,-1) }
.aw-char .cl.is-on img { filter:brightness(0) opacity(.85) }

/* flecha de subir (img5) y barra Stat Points lisa (img6) ya incluidas arriba; sin punto rojo en ningún sitio */
.aw-char .hueco { margin:0 0 6px;font-size:13px;color:#c8b98d;letter-spacing:.2px }
.aw-char .hueco[hidden] { display:none }
.aw-char .qs .bn { display:inline-flex }
.aw-char .q .qv { font-variant-numeric:tabular-nums }
.aw-char .st .bn .up { margin-left:0 }
.aw-char .q span.t .bn .up { margin-left:2px }
.aw-char .ar:disabled { opacity:.25;cursor:not-allowed }
.aw-char a.fk { text-decoration:none }
.aw-char button.fk { text-align:left }
/* el pie del sitio no se muestra en las pantallas de juego de escritorio: la página ocupa justo la ventana */
@media (min-width: 900px) { body.aw-page-screen > footer.aw-legend--site { display:none } body.aw-page-screen { overflow:hidden } }
@media (max-height:760px) and (min-width:901px) { .aw-char .ca { height:36px } .aw-char .st { height:28px } .aw-char .qs { margin-bottom:6px } }
/* móvil: columnas apiladas, selector de clases con scroll horizontal, pie fijo abajo */
@media (max-width:899px) {
  main.aw-char { height:auto;min-height:calc(100vh - var(--aw-topbar-h,65px));overflow:visible;background-attachment:scroll }
  .aw-char .cls { height:56px;gap:6px;overflow-x:auto;justify-content:flex-start;padding:0 8px;scrollbar-width:none }
  .aw-char .cl { flex:none;height:42px;padding:0 14px 0 10px;font-size:17px }
  .aw-char .main { display:block }
  .aw-char .main>* { padding:18px 16px 12px }
  .aw-char .main>.sec, .aw-char .left { background:rgba(8,8,6,.78) }
  .aw-char .main>.sec:nth-of-type(4) { padding-bottom:84px }
  .aw-char .ca { height:52px }
  .aw-char .st { height:42px }
  .aw-char .foot { position:sticky;bottom:var(--aw-mnav-h,0px);background:linear-gradient(0deg,#0b0b09 60%,transparent);padding:14px 16px;gap:8px 22px;justify-content:center;flex-wrap:wrap }
}
/* ============ T7-7. Quest v2 (Dis, tanda 6 puntos 2, 3, 4 y 6): tres secciones iguales, barra de tipos Z/iconos/C, tracking en rombo (1 azul, 2 verde, 3 lila; máx. 3); se conserva «Complete» de v18 ============ */
.aw-quest { --tx:#e9e6dc;--mut:#8f8c83;--gold:#c8b98d;--c1:#3682b8;--c2:#4aa05c;--c3:#9078c8;--line:rgba(255,255,255,.09) }
.aw-quest, .aw-quest * { box-sizing:border-box;margin:0;padding:0 }
main.aw-quest { position:relative;display:flex;flex-direction:column;max-width:none;width:100%;color:var(--tx);font:400 17px/1.2 'EB Garamond','Cormorant Garamond',Georgia,serif;
  background:linear-gradient(rgba(11,11,9,.50),rgba(11,11,9,.50)),url(../img/quest-fondo.webp) center/cover fixed #0b0b09;
  height:calc(100vh - var(--aw-topbar-h,84px));height:calc(100dvh - var(--aw-topbar-h,84px));min-height:0;overflow:hidden }
.aw-quest button { font:inherit;color:inherit;background:none;border:0;cursor:pointer }
.aw-quest .qmain { flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch }
.aw-quest .qmain>* { min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;padding:26px 56px 96px }
.aw-quest .list { background:rgba(8,8,6,.90) }
.aw-quest .det { background:rgba(8,8,6,.70) }
.aw-quest .rw { background:rgba(8,8,6,.55) }
.aw-quest .types { display:flex;align-items:center;gap:6px }
.aw-quest .key { display:inline-grid;place-items:center;min-width:28px;height:28px;border:1px solid #aaa79d;border-radius:4px;font:500 13px Inter,Arial,sans-serif;color:#d8d4c8;padding:0 6px;flex:none }
.aw-quest .ty { position:relative;width:46px;height:46px;display:grid;place-items:center;flex:none;opacity:.78;transition:opacity .15s }
.aw-quest .ty img { width:26px;height:auto;max-height:30px;display:block;position:relative }
.aw-quest .ty:hover, .aw-quest .ty:focus-visible { opacity:1;outline:0 }
.aw-quest .ty.is-on { opacity:1 }
.aw-quest .ty.is-on::before { content:"";position:absolute;width:34px;height:34px;border-radius:50%;background:radial-gradient(circle,rgba(255,244,214,.34) 0%,rgba(255,244,214,.12) 50%,rgba(255,244,214,0) 72%) }
.aw-quest .tlabel { margin:6px 0 20px 2px;font-size:18px;color:#cfcabc;letter-spacing:.2px }
.aw-quest .grp { display:flex;justify-content:space-between;align-items:center;color:var(--gold);font-size:17px;padding:8px 10px;border-bottom:1px solid var(--line);margin-bottom:10px }
.aw-quest .grp small { color:#fff;font-size:15px }
.aw-quest .card { position:relative;display:flex;align-items:center;gap:14px;min-height:72px;padding:10px 14px;margin-bottom:6px;color:#a8a296;border:1px solid rgba(255,255,255,.06);text-shadow:0 2px 3px rgba(0,0,0,.85);cursor:pointer;transition:background .15s,color .15s }
.aw-quest .card:hover, .aw-quest .card:focus-visible { color:#d9d2c2;border-color:rgba(255,255,255,.28);outline:0 }
.aw-quest .rh { position:relative;width:46px;height:46px;flex:none;display:grid;place-items:center }
.aw-quest .rh::before { content:"";position:absolute;width:32px;height:32px;transform:rotate(45deg);background:#1c1a16;outline:1px solid rgba(168,162,150,.55);outline-offset:2px }
.aw-quest .rh img { position:relative;width:20px;height:auto;max-height:22px }
.aw-quest .nm { flex:1;min-width:0;display:flex;flex-direction:column;gap:3px }
.aw-quest .nm small { font-size:14px;color:#8f8c83 }
.aw-quest .nm b { font-weight:400;font-size:19px;line-height:1.15 }
.aw-quest .trk { display:flex;align-items:center;gap:8px;flex:none;font-size:15px;color:#cfcabc }
.aw-quest .tk { position:relative;width:26px;height:26px;display:grid;place-items:center }
.aw-quest .tk::before { content:"";position:absolute;width:15px;height:15px;transform:rotate(45deg);border:1.5px solid currentColor;background:rgba(0,0,0,.35) }
.aw-quest .tk i { position:absolute;right:-5px;bottom:-5px;min-width:15px;height:15px;border-radius:50%;font:600 10px/15px Inter,Arial,sans-serif;font-style:normal;text-align:center;color:#fff;text-shadow:none;border:1px solid #0b0b09 }
.aw-quest .n1 { color:var(--c1) }
.aw-quest .n1 i { background:var(--c1) }
.aw-quest .n2 { color:var(--c2) }
.aw-quest .n2 i { background:var(--c2) }
.aw-quest .n3 { color:var(--c3) }
.aw-quest .n3 i { background:var(--c3) }
.aw-quest .card.is-on { color:#2a251d;border-color:transparent;text-shadow:none;background:linear-gradient(180deg,#e9e0c6,#ddd2b3);box-shadow:inset 0 1px 0 rgba(59,52,41,.55),inset 0 -1px 0 rgba(59,52,41,.55),inset 0 0 22px rgba(120,100,60,.16) }
.aw-quest .card.is-on::before { content:"";position:absolute;inset:1.5px 0;border-top:1px solid rgba(59,52,41,.75);border-bottom:1px solid rgba(59,52,41,.75);pointer-events:none }
.aw-quest .card.is-on .nm small { color:#5d554a }
.aw-quest .card.is-on .rh::before { background:#2a251d;outline-color:rgba(42,37,29,.6) }
.aw-quest .card.is-on .tk::before { background:rgba(255,255,255,.4) }
.aw-quest .card.is-on .trk { color:#2a251d }
.aw-quest .card i.fl { display:none }
.aw-quest .card.is-on i.fl { display:block;position:absolute;width:20px;height:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%233b3429' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 20V8Q1.5 1.5 8 1.5H21' stroke-width='1.3'/%3E%3Cpath d='M6 17V11.5Q6 6 11.5 6H17.5Q20 6 20 8.5T17 11.5 14.5 9.5 16 8' stroke-width='1.105'/%3E%3Cpath d='M1.5 12Q4 12 4.5 14.5M12 1.5Q12 4 14.5 4.5' stroke-width='1.04'/%3E%3Ccircle cx='9' cy='9' r='1.1' fill='%233b3429' stroke='none'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat;pointer-events:none }
.aw-quest .card.is-on i.fl:nth-of-type(1) { left:0;top:0 }
.aw-quest .card.is-on i.fl:nth-of-type(2) { right:0;top:0;transform:scaleX(-1) }
.aw-quest .card.is-on i.fl:nth-of-type(3) { left:0;bottom:0;transform:scaleY(-1) }
.aw-quest .card.is-on i.fl:nth-of-type(4) { right:0;bottom:0;transform:scale(-1,-1) }
.aw-quest .card.done { opacity:.5;cursor:default }
.aw-quest .cap { flex:none;padding:5px 16px;border-radius:999px;font-size:15px;color:#fff;background:radial-gradient(ellipse 60% 80% at 50% 50%,rgba(150,148,142,.42),rgba(110,108,104,.2) 70%,rgba(110,108,104,.08));text-shadow:none }
.aw-quest .det h1 { font-weight:400;font-size:32px;color:#fff;margin:2px 0 14px }
.aw-quest .det p { font-size:19px;line-height:1.5;color:#d8d4c8;margin-bottom:6px;max-width:34em }
.aw-quest .obj { margin-top:32px }
.aw-quest .oh { display:flex;align-items:center;gap:12px;height:40px;margin:0 -56px 8px;padding:0 56px;background:linear-gradient(90deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,.42) 60%,rgba(0,0,0,0) 100%);font-size:20px;color:#e2ddd0 }
.aw-quest .oh svg { width:26px;height:26px;flex:none;color:#b7b2a4 }
.aw-quest .ob { display:flex;align-items:center;gap:12px;min-height:40px;padding:0 4px;font-size:18px;color:#e9e6dc }
.aw-quest .bx { width:15px;height:15px;border:1px solid #b7b2a4;flex:none }
.aw-quest .rw h2 { font-weight:400;font-size:19px;color:#fff;padding:0 4px 8px;border-bottom:1px solid var(--line);margin:34px 0 10px }
.aw-quest .rr { display:flex;justify-content:space-between;align-items:center;height:44px;padding:0 8px;font-size:18px }
.aw-quest .rr span:last-child { color:#fff }
.aw-quest .foot { position:fixed;left:0;right:0;bottom:0;z-index:3;display:flex;gap:44px;padding:18px 64px 22px;font-size:17px;pointer-events:none;text-shadow:0 1px 4px rgba(0,0,0,.9) }
.aw-quest .fk { display:flex;align-items:center;gap:10px;color:#e9e6dc }
.aw-quest .back { display:none }

.aw-quest .qmain>.rw { padding-top:56px }
.aw-quest .det { padding-top:26px }
.aw-quest .key { cursor:pointer }
.aw-quest .tlabel { min-height:22px }
.aw-quest .hueco { font-size:15px;color:#c8b98d }
.aw-quest .ob.is-done { color:#8f8c83 }
.aw-quest .ob.is-done > span:last-child { text-decoration:line-through;text-decoration-color:rgba(143,140,131,.6) }
.aw-quest .bx { display:grid;place-items:center }
.aw-quest .card.is-complete:not(.is-on) { opacity:.5;cursor:pointer }
.aw-quest .card .cdone { margin-left:auto }
.aw-quest .card .trk { margin-left:auto }
.aw-quest .card .trk + .cdone { margin-left:12px }
.aw-quest .foot { position:fixed;left:0;right:0;bottom:0;z-index:3;display:flex;gap:44px;padding:18px 64px 22px;font-size:17px;pointer-events:none;background:none;text-shadow:0 1px 4px rgba(0,0,0,.9);transition:opacity .15s }
.aw-quest .foot > * { pointer-events:auto }
.aw-quest .foot.is-end { opacity:0;visibility:hidden }
.aw-quest .fk { display:flex;align-items:center;gap:10px;color:#e9e6dc;text-decoration:none }
.aw-quest .back { display:none }
@media (max-width:899px) {
  main.aw-quest { height:auto;min-height:calc(100vh - var(--aw-topbar-h,65px));overflow:visible;background-attachment:scroll }
  .aw-quest .qmain { grid-template-columns:minmax(0,1fr);min-height:0 }
  .aw-quest .qmain>* { padding:16px 16px 24px;overflow:visible }
  .aw-quest .qmain:not(.is-detail) .det, .aw-quest .qmain:not(.is-detail) .rw { display:none }
  .aw-quest .qmain.is-detail .list { display:none }
  .aw-quest .types { overflow-x:auto;scrollbar-width:none }
  .aw-quest .ty { width:50px;height:50px }
  .aw-quest .key { min-width:36px;height:36px }
  .aw-quest .card { min-height:84px;padding:12px 16px }
  .aw-quest .oh { margin:0 -16px 8px;padding:0 16px }
  .aw-quest .back { display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 12px 0 6px;margin:0 0 6px -6px;font-size:19px;color:#e9e6dc;border:1px solid rgba(255,255,255,.12) }
  .aw-quest .back span { font-size:28px;line-height:1 }
  .aw-quest .foot { padding:14px 16px;gap:18px;flex-wrap:wrap;background:linear-gradient(0deg,#0b0b09 60%,transparent);bottom:var(--aw-mnav-h,0px) }
  .aw-quest .qmain:not(.is-detail)~.foot .act { display:none }
}
/* ============ T7-8. Mapa: indicador de zona (brujula + nombre) OCULTO. Los datos (locations.json, zonas) y el codigo siguen intactos: David pondra los nombres con su editor; para volver a mostrarlo basta con borrar esta regla ============ */
body.aw-page-map .map-zone, body.aw-page-map .map-zone[hidden] { display: none !important; }
/* ===== TANDA 7 — FIN ===== */

/* ---- production skills.css rules used by the report / controls modals ---- */
.report-btn{
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  padding: 4px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #16120f;
  color: var(--acc);
  font: 650 .82rem "Segoe UI", system-ui, sans-serif;
  cursor: pointer;
}
.report-btn:hover{
  border-color: var(--acc);
  background: #2a2118;
}
.report-modal{
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(8, 6, 4, .72);
}
.report-modal[hidden]{
  display: none;
}
.report-card{
  width: min(520px, 100%);
  max-height: calc(100dvh - 32px);
  overflow: auto;
  background: #16120f;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 20px 20px 16px;
  box-shadow: 0 18px 40px rgba(0,0,0,.5);
}
.report-card h2{
  margin: 0 0 8px;
  font: 700 1.2rem Georgia, "Iowan Old Style", serif;
  color: var(--acc);
}
.report-lead,
.report-context{
  margin: 0 0 12px;
  color: var(--muted);
  font-size: .88rem;
  line-height: 1.45;
}
.report-context{
  font-size: .78rem;
  padding: 8px 10px;
  background: #100e0c;
  border-radius: 8px;
}
.report-type{
  border: 1px solid var(--line);
  border-radius: 8px;
  margin: 0 0 12px;
  padding: 8px 12px 10px;
}
.report-type legend{
  padding: 0 6px;
  color: var(--muted);
  font-size: .78rem;
}
.report-type label{
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  cursor: pointer;
  font-size: .9rem;
}
.report-field{
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 12px;
  font-size: .78rem;
  color: var(--muted);
}
.report-field input,
.report-field textarea{
  background: #100e0c;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 10px;
  font: 0.92rem/1.4 "Segoe UI", system-ui, sans-serif;
}
.report-field input:focus,
.report-field textarea:focus{
  outline: none;
  border-color: var(--acc);
}
.report-field em{
  font-style: normal;
  font-size: .75rem;
  color: var(--muted);
}
.report-actions{
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 8px;
}
.report-cancel,
.report-send{
  appearance: none;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 8px;
  font: 650 .85rem "Segoe UI", system-ui, sans-serif;
  cursor: pointer;
}
.report-cancel{
  border: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
}
.report-send{
  border: 0;
  background: var(--acc);
  color: #160f0a;
}
.report-send:disabled{
  opacity: .5;
}
.report-status{
  margin: 0 0 8px;
  font-size: .85rem;
}
.report-status.is-ok{ color: #8fbf7a; }
.report-status.is-err{ color: #d07060; }
.tt-combo{
  margin: 0 0 10px;
  font-size: .82rem;
  line-height: 1.45;
  color: #d8d4cc;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.cmd-key{
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border: 1px solid rgba(200,200,200,.45);
  border-radius: 3px;
  font: 700 .72rem/1 Arial, sans-serif;
  color: #eee;
  background: rgba(40,40,44,.9);
}
.cmd-mouse,
.cmd-glyph svg{
  display: inline-block;
  vertical-align: middle;
}
.cmd-icon,
.skill-ref-icon{
  width: 16px;
  height: 16px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
  margin-left: 2px;
}
.cmd-plus{
  opacity: .7;
  padding: 0 2px;
}
.tt-desc .skill-ref,
.tt-combo .skill-ref,
.tt-desc .status-ref,
.tt-combo .status-ref,
.tt-combo .cmd-text .status-ref,
.skill-tooltip .status-ref,
.skill-tooltip .skill-ref{
  color: #e8c37a !important;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.pub-ctl-list{
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
  max-height: min(52dvh, 480px);
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pub-ctl-list li{
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  gap: 8px;
  align-items: center;
  min-height: 44px;
  padding: 6px 10px;
  background: #16120f;
  border: 1px solid var(--line);
  color: var(--ink);
}
.pub-ctl-list li.is-listening{
  border-color: var(--acc);
}
.pub-ctl-bind{
  appearance: none;
  min-height: 36px;
  padding: 4px 10px;
  border: 1px solid var(--line);
  background: #100e0c;
  color: var(--ink);
  font: 650 .82rem "Segoe UI", system-ui, sans-serif;
  cursor: pointer;
}
.pub-ctl-ok,
.pub-ctl-reset{
  appearance: none;
  width: 36px;
  height: 36px;
  border: 1px solid var(--line);
  background: #100e0c;
  color: #6fdf6a;
  cursor: pointer;
}
.pub-ctl-reset{
  color: var(--acc);
}
.controls-card{
  width: min(560px, calc(100vw - 24px));
}
.status-ref-icon, .skill-ref img{ width: 1.1em; height: 1.1em; object-fit: contain; vertical-align: -0.15em; }
.catalog-report-add{
  appearance: none; display: inline-flex; align-items: center; justify-content: center;
  gap: 8px; width: auto; min-height: 36px; padding: 0 10px;
  border: 1px solid var(--acc); background: #2a2118;
  color: var(--acc); border-radius: 8px; cursor: pointer;
  font: 700 .78rem Arial, sans-serif; white-space: nowrap;
}
.catalog-report-add svg{ flex: none; }
.sr-status-edits{
  min-width: 0;
  max-width: 100%;
  overflow: auto;
  max-height: min(62vh, 560px);
}
.sr-status-card{ min-width: 0; overflow: hidden; }
.sr-status-card textarea{
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  resize: vertical;
  min-height: 72px;
  max-height: 180px;
}
.skill-report-card.is-create .sr-col.is-before{ display: none; }
.skill-report-card.is-create .sr-grid{ grid-template-columns: 1fr; }
.sr-live-preview{
  margin: 10px 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #0c0b0a;
  font-size: .88rem;
  line-height: 1.4;
}
.sr-preview-head{ margin: 0 0 8px; color: var(--acc); }
.sr-preview-desc{ color: #f2f2f2; }
.sr-preview-desc em, .sr-preview-head em{ color: var(--muted); font-style: italic; font-weight: 400; }
.skill-report-card{ width: min(960px, 100%); max-height: min(92vh, 920px); overflow: auto; }
.sr-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 12px 0 16px; }
.sr-status-edits{
  margin: 0 0 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #100e0c;
  min-width: 0;
  max-width: 100%;
  overflow: auto;
  max-height: min(62vh, 560px);
}
.sr-status-edits h3{ margin: 0 0 8px; font-size: .85rem; color: var(--acc); }
.sr-status-card{ margin: 0 0 10px; }
.sr-status-card h4{ margin: 0 0 4px; color: var(--acc); }
.sr-status-current{ margin: 0 0 6px; color: var(--muted); font-size: .82rem; white-space: pre-wrap; }
.sr-desc-toolbar, .sr-combo-build{
  display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px;
}
.sr-desc-toolbar select, .sr-combo-build select, .sr-combo-build input{
  min-height: 36px; background: #16120f; color: var(--ink); border: 1px solid var(--line);
  border-radius: 8px; padding: 4px 8px; font: 650 .78rem Arial, sans-serif;
}
.sr-combo-chips{ display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
.sr-chip{
  appearance: none; border: 1px solid var(--line); background: #1a1612; color: var(--ink);
  border-radius: 999px; padding: 4px 8px; font: 650 .75rem Arial, sans-serif; cursor: pointer;
}
.sr-col{ border: 1px solid var(--line); border-radius: 10px; padding: 12px; background: #100e0c; }
.sr-col h3{ margin: 0 0 10px; font-size: .85rem; color: var(--acc); }
.sr-preview{ display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.sr-preview img{ width: 48px; height: 48px; object-fit: contain; background: #000; border-radius: 6px; }
.sr-readonly p{ margin: 0 0 8px; font-size: .85rem; }
.sr-readonly .sr-desc{ white-space: pre-wrap; color: var(--muted); }
.device-pills{ display:flex; gap:6px; flex: none; }
.device-pill{
  appearance:none; width:36px; height:36px; display:grid; place-items:center;
  border:1px solid var(--line); border-radius:8px; background:#16120f; color:var(--muted); cursor:pointer;
}
.device-pill.is-on, .device-pill:hover{ border-color:var(--acc); color:var(--acc); background:#2a2118; }
.skill-ref, .status-ref{ color:#e8c37a !important; cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
.device-pill img{ width: 22px; height: 22px; object-fit: contain; display: block; filter: none; }
.skill-tooltip.is-docked .tt-header,
.skill-tooltip.is-docked .tt-combo,
.skill-tooltip.is-docked .tt-exclusive,
.skill-tooltip.is-docked .tt-actions,
.skill-tooltip.is-docked .tt-report,
.skill-tooltip.is-docked .tt-details-hint{
  flex: none;
}

/* ---- v27: bloque destacado del directo 19/10 (Dis) ---- */
/* Bloque destacado de portada (beta). Usa tokens existentes; sin fuentes ni colores nuevos. Añadir al final de aw-site.css */
.aw-alert { padding: 18px 0 0; background: var(--aw-bg); }
.aw-alert__box {
  position: relative; display: grid; grid-template-columns: 300px 1fr; gap: 28px; align-items: center;
  max-width: 1040px; margin: 0 auto; padding: 22px 26px;
  background: linear-gradient(180deg, rgba(26,25,22,.96), rgba(16,15,13,.96));
  border-top: 1px solid rgba(200,162,90,.55); border-bottom: 1px solid rgba(200,162,90,.55);
  box-shadow: inset 0 0 40px rgba(200,162,90,.06), 0 10px 30px rgba(0,0,0,.45);
}
/* esquinas ornamentales (mismo recurso que los títulos de sección) */
.aw-alert__box::before, .aw-alert__box::after { content:""; position:absolute; inset:0; pointer-events:none;
  background: var(--orn-ink-tl, none) left top/16px 16px no-repeat, var(--orn-ink-tr, none) right top/16px 16px no-repeat; }
.aw-alert__box::after { background: var(--orn-ink-bl, none) left bottom/16px 16px no-repeat, var(--orn-ink-br, none) right bottom/16px 16px no-repeat; }

.aw-alert__media { position: relative; display: block; aspect-ratio: 16/9; overflow: hidden; border: 1px solid rgba(216,209,192,.28); }
.aw-alert__media img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(.9) brightness(.92); transition: filter .2s, transform .4s; }
.aw-alert__media:hover img { filter: saturate(1) brightness(1.04); transform: scale(1.03); }
.aw-alert__play { position: absolute; left: 50%; top: 50%; width: 56px; height: 56px; margin: -28px 0 0 -28px; border-radius: 50%;
  background: rgba(12,11,10,.72); border: 1px solid rgba(238,232,218,.8); }
.aw-alert__play::after { content:""; position:absolute; left: 22px; top: 17px; border-left: 17px solid var(--aw-ink-hi); border-top: 11px solid transparent; border-bottom: 11px solid transparent; }

.aw-alert__tag { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font: 600 var(--aw-fs-xs)/1 var(--aw-font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--aw-gold); }
.aw-alert__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--aw-gold); box-shadow: 0 0 0 0 rgba(200,162,90,.6); animation: aw-alert-pulse 2s infinite; }
@keyframes aw-alert-pulse { 70% { box-shadow: 0 0 0 9px rgba(200,162,90,0); } 100% { box-shadow: 0 0 0 0 rgba(200,162,90,0); } }
@media (prefers-reduced-motion: reduce) { .aw-alert__dot { animation: none; } .aw-alert__media img { transition: none; } }

.aw-alert__h a { color: inherit; text-decoration: none; }
.aw-alert__h a:hover { text-decoration: underline; text-decoration-color: rgba(201,178,127,.55); text-underline-offset: 5px; }
.aw-alert__h { margin: 0 0 8px; font: 600 clamp(1.4rem, 2.6vw, 1.9rem)/1.15 var(--aw-font-display); letter-spacing: .02em; color: var(--aw-ink-hi); }
.aw-alert__txt { margin: 0 0 18px; font: 500 var(--aw-fs-lg)/1.4 var(--aw-font-ui); color: var(--aw-ink); max-width: 56ch; }
.aw-alert__act { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.aw-alert__btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 0 22px;
  background: var(--aw-cream-grad); color: var(--aw-cream-ink); text-decoration: none; border: 0; border-radius: 0;
  font: 700 var(--aw-fs-sm)/1 var(--aw-font-body); letter-spacing: .06em; text-transform: uppercase;
  box-shadow: inset 0 1px 0 rgba(59,52,41,.55), inset 0 -1px 0 rgba(59,52,41,.55); }
.aw-alert__btn:hover, .aw-alert__btn:focus-visible { filter: brightness(1.06); outline: 2px solid var(--aw-focus, #f3eee2); outline-offset: 3px; }
.aw-alert__more { color: var(--aw-ink); font: 500 var(--aw-fs-md)/1 var(--aw-font-ui); text-decoration: underline; text-decoration-color: rgba(201,178,127,.55); text-underline-offset: 4px; }
.aw-alert__more:hover { color: var(--aw-ink-hi); }

/* móvil: miniatura arriba a todo el ancho, botón a todo el ancho */
@media (max-width: 760px) {
  .aw-alert { padding-top: 12px; }
  .aw-alert__box { grid-template-columns: 1fr; gap: 14px; padding: 14px 14px 18px; }
  .aw-alert__play { width: 48px; height: 48px; margin: -24px 0 0 -24px; }
  .aw-alert__play::after { left: 18px; top: 14px; border-left-width: 14px; border-top-width: 9px; border-bottom-width: 9px; }
  .aw-alert__h { font-size: 1.35rem; }
  .aw-alert__txt { font-size: var(--aw-fs-sm); }
  .aw-alert__act { flex-direction: column; align-items: stretch; gap: 12px; }
  .aw-alert__btn { width: 100%; min-height: 48px; }
  .aw-alert__more { text-align: center; }
}

/* ===== v2 (David 04/10): anuncio MUCHO más grande; portada (imagen y lista de deseos) más pequeñas ===== */
.aw-alert { padding: 28px 0 8px; }
.aw-alert .aw-wrap { max-width: 1280px; }
.aw-alert__box { max-width: none; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 44px; padding: 34px 40px; }
.aw-alert__box::before, .aw-alert__box::after { background-size: 22px 22px; }
.aw-alert__play { width: 92px; height: 92px; margin: -46px 0 0 -46px; border-width: 2px; }
.aw-alert__play::after { left: 36px; top: 28px; border-left-width: 28px; border-top-width: 18px; border-bottom-width: 18px; }
.aw-alert__tag { font-size: var(--aw-fs-md); margin-bottom: 16px; gap: 10px; }
.aw-alert__dot { width: 12px; height: 12px; }
.aw-alert__h { font-size: clamp(2.1rem, 3.6vw, 3.4rem); line-height: 1.1; margin-bottom: 16px; }
.aw-alert__txt { font-size: clamp(1.15rem, 1.7vw, 1.5rem); margin-bottom: 30px; }
.aw-alert__btn { min-height: 60px; padding: 0 34px; font-size: var(--aw-fs-lg); gap: 12px; }
.aw-alert__btn svg { width: 22px; height: 22px; }
.aw-alert__more { font-size: var(--aw-fs-xl); }

/* portada más pequeña SOLO mientras exista el anuncio (si desaparece, vuelve sola al tamaño normal) */
main:has(> .aw-alert:not([hidden])) .aw-hero .aw-hero__in { min-height: 0; padding-block: 28px 30px; gap: 8px; }
main:has(> .aw-alert:not([hidden])) .aw-hero .aw-h1 { font-size: clamp(1.5rem, 2.6vw, 2.2rem); }
main:has(> .aw-alert:not([hidden])) .aw-hero .aw-hero__lead { font-size: var(--aw-fs-md); }
main:has(> .aw-alert:not([hidden])) .aw-hero .aw-wl { width: min(100%, 520px); margin-top: 14px; }
main:has(> .aw-alert:not([hidden])) .aw-hero .aw-wl__h { font-size: 14px; margin-bottom: 10px; }
main:has(> .aw-alert:not([hidden])) .aw-hero .aw-wl__g { gap: 8px; }
main:has(> .aw-alert:not([hidden])) .aw-hero .aw-wl__b { height: 34px; }
main:has(> .aw-alert:not([hidden])) .aw-hero .aw-wl__b img { height: 15px; }

@media (max-width: 760px) {
  .aw-alert { padding-top: 14px; }
  .aw-alert__box { grid-template-columns: 1fr; gap: 18px; padding: 16px 16px 24px; }
  .aw-alert__play { width: 68px; height: 68px; margin: -34px 0 0 -34px; }
  .aw-alert__play::after { left: 26px; top: 20px; border-left-width: 20px; border-top-width: 13px; border-bottom-width: 13px; }
  .aw-alert__tag { font-size: var(--aw-fs-sm); }
  .aw-alert__h { font-size: 2rem; }
  .aw-alert__txt { font-size: 1.15rem; margin-bottom: 20px; }
  .aw-alert__btn { min-height: 56px; font-size: var(--aw-fs-md); }
  .aw-alert__more { font-size: var(--aw-fs-lg); }
  main:has(> .aw-alert:not([hidden])) .aw-hero .aw-hero__in { padding-block: 18px 18px; }
  main:has(> .aw-alert:not([hidden])) .aw-hero .aw-wl { margin-top: 10px; }
  main:has(> .aw-alert:not([hidden])) .aw-hero .aw-wl__b { height: 32px; }
  main:has(> .aw-alert:not([hidden])) .aw-hero .aw-wl__b img { height: 14px; }
}

/* v27: el atributo hidden (fecha fuera de rango) gana siempre; con el bloque oculto la portada recupera su tamano normal (:not([hidden]) arriba) */
.aw-alert[hidden] { display: none; }