/* ACG Achievement Center 0.5.7 */

:where(.acg-ach-launcher,.acg-ach-menu-panel,.acg-ach-selection,.acg-ach-badge,.acg-ach-tooltip) {
    box-sizing: border-box;
    color: var(--acg-ng-text-primary);
    font-family: var(--ach-font-family, inherit) !important;
}

:where(.acg-ach-launcher,.acg-ach-menu-panel,.acg-ach-selection,.acg-ach-badge,.acg-ach-tooltip) *,
:where(.acg-ach-launcher,.acg-ach-menu-panel,.acg-ach-selection,.acg-ach-badge,.acg-ach-tooltip) *::before,
:where(.acg-ach-launcher,.acg-ach-menu-panel,.acg-ach-selection,.acg-ach-badge,.acg-ach-tooltip) *::after {
    box-sizing: border-box;
}

/* Tier variables are scoped to achievement UI only. The previous global
 * .tier-* selectors could alter unrelated elements from other plugins. */
:is(.acg-ach-launcher-button,.acg-ach-title-pill,.acg-ach-badge,.acg-ach-reference,.acg-ach-picker-tier).tier-1 { --tier-text:var(--acg-ng-tier-1); --tier-border:var(--acg-ng-tier-1-border); --tier-bg:var(--acg-ng-tier-1-bg); }
:is(.acg-ach-launcher-button,.acg-ach-title-pill,.acg-ach-badge,.acg-ach-reference,.acg-ach-picker-tier).tier-2 { --tier-text:var(--acg-ng-tier-2); --tier-border:var(--acg-ng-tier-2-border); --tier-bg:var(--acg-ng-tier-2-bg); }
:is(.acg-ach-launcher-button,.acg-ach-title-pill,.acg-ach-badge,.acg-ach-reference,.acg-ach-picker-tier).tier-3 { --tier-text:var(--acg-ng-tier-3); --tier-border:var(--acg-ng-tier-3-border); --tier-bg:var(--acg-ng-tier-3-bg); }
:is(.acg-ach-launcher-button,.acg-ach-title-pill,.acg-ach-badge,.acg-ach-reference,.acg-ach-picker-tier).tier-4 { --tier-text:var(--acg-ng-tier-4); --tier-border:var(--acg-ng-tier-4-border); --tier-bg:var(--acg-ng-tier-4-bg); }
:is(.acg-ach-launcher-button,.acg-ach-title-pill,.acg-ach-badge,.acg-ach-reference,.acg-ach-picker-tier).tier-5 { --tier-text:var(--acg-ng-tier-5); --tier-border:var(--acg-ng-tier-5-border); --tier-bg:var(--acg-ng-tier-5-bg); }

/* One role-neutral viewport portal for the selector and requirement panels.
 * The bounded stacking level keeps ordinary page content beneath it while
 * allowing the site header and WordPress toolbar to remain above it. */
#acg-ach-overlay-root {
    position:fixed !important;
    inset:0 !important;
    z-index:900 !important;
    width:100vw !important;
    height:100vh !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
    pointer-events:none !important;
    transform:none !important;
    contain:layout style;
}
#acg-ach-overlay-root > .acg-ach-menu-panel,
#acg-ach-overlay-root > .acg-ach-tooltip { pointer-events:auto !important; }

/* Launcher */
.acg-ach-launcher { display:inline-block; position:relative; max-width:100%; }
.acg-ach-launcher-template { display:none !important; }

.acg-ach-launcher-button {
    appearance:none !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:72px !important;
    min-height:42px !important;
    margin:0 !important;
    padding:8px 15px !important;
    border:var(--acg-ng-border-width) solid var(--tier-border,var(--acg-ng-border-strong)) !important;
    border-radius:var(--acg-ng-radius-small) !important;
    background:var(--tier-bg,var(--acg-ng-bg-control)) !important;
    box-shadow:var(--acg-ng-shadow-card) !important;
    color:var(--tier-text,var(--acg-ng-text-primary)) !important;
    font-family:var(--ach-font-family,inherit) !important;
    font-size:var(--acg-ng-font-body) !important;
    font-weight:720 !important;
    line-height:1.2 !important;
    text-transform:none !important;
    letter-spacing:0 !important;
    cursor:pointer !important;
    user-select:none;
}

.acg-ach-launcher-button:hover,
.acg-ach-launcher-button:focus,
.acg-ach-launcher-button:active,
.acg-ach-launcher-button[aria-expanded="true"] {
    border-color:var(--tier-border,var(--acg-ng-border-accent)) !important;
    background:var(--tier-bg,var(--acg-ng-bg-control-active)) !important;
    box-shadow:var(--acg-ng-shadow-focus) !important;
    color:var(--tier-text,var(--acg-ng-text-primary)) !important;
    filter:var(--acg-ng-filter-selected);
    outline:none !important;
}

.acg-ach-launcher-button:focus-visible { outline:var(--acg-ng-outline-focus) !important; outline-offset:var(--acg-ng-focus-offset) !important; }

/* Spawned selector */
.acg-ach-menu-panel {
    position:fixed !important;
    z-index:10;
    display:block;
    overflow:hidden;
    margin:0;
    padding:0;
    border:var(--acg-ng-border-strong-line);
    border-radius:var(--acg-ng-radius-control);
    background:var(--acg-ng-bg-floating);
    box-shadow:var(--acg-ng-shadow-floating);
    opacity:0;
    transform:translateY(-4px) scale(.995);
    transition:opacity var(--acg-ng-transition-fast),transform var(--acg-ng-transition-fast);
    isolation:isolate;
}
.acg-ach-menu-panel.is-visible { opacity:1; transform:none; }
.acg-ach-menu-panel:focus { outline:none; }

.acg-ach-menu-scroll {
    width:100%;
    max-height:inherit;
    padding:14px;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:var(--acg-ng-text-tertiary);
}
.acg-ach-menu-scroll::-webkit-scrollbar { width:9px; height:0; }
.acg-ach-menu-scroll::-webkit-scrollbar-track { background:var(--acg-ng-bg-region); }
.acg-ach-menu-scroll::-webkit-scrollbar-thumb { border:var(--acg-ng-border-strong-heavy-line); border-radius:var(--acg-ng-radius-pill); background:var(--acg-ng-bg-media); }

.acg-ach-selection {
    display:grid;
    grid-template-columns:64px minmax(0,1fr);
    gap:14px;
    align-items:start;
    width:100%;
    margin:0;
    padding:14px;
    border:var(--acg-ng-border-standard);
    border-radius:var(--acg-ng-radius-control);
    background:var(--acg-ng-bg-input);
}
.acg-ach-selection-label { padding-top:9px; color:var(--acg-ng-text-primary); font-size:var(--acg-ng-font-body) !important; font-weight:700; line-height:1.35; }

.acg-ach-picker { min-width:0; max-width:100%; overflow:hidden; border:var(--acg-ng-border-standard); border-radius:var(--acg-ng-radius-control); background:var(--acg-ng-bg-card); }
.acg-ach-picker-clear,
.acg-ach-picker-tier { display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-height:45px; max-width:100%; padding:8px 10px; overflow:hidden; }
.acg-ach-picker-clear,
.acg-ach-picker-tier:not(:last-child) { border-bottom:var(--acg-ng-border-subtle-line); }
.acg-ach-picker-tier.tier-1 { background:var(--acg-ng-bg-region-soft); }
.acg-ach-picker-tier.tier-2 { background:var(--acg-ng-bg-region-soft); }
.acg-ach-picker-tier.tier-3 { background:var(--acg-ng-bg-region-soft); }
.acg-ach-picker-tier.tier-4 { background:var(--acg-ng-bg-region-soft); }
.acg-ach-picker-tier.tier-5 { background:var(--acg-ng-bg-region-soft); }
.acg-ach-picker-empty { display:block; width:1px; height:18px; }

/* Titles and badges */
.acg-ach-title-pill,
.acg-ach-badge,
.acg-ach-reference {
    position:relative;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:0 !important;
    height:auto !important;
    max-width:100% !important;
    margin:0 !important;
    overflow:visible;
    border:var(--acg-ng-border-width) solid var(--tier-border,var(--acg-ng-border-default)) !important;
    border-radius:var(--acg-ng-radius-small) !important;
    background:var(--tier-bg,var(--acg-ng-bg-control)) !important;
    color:var(--tier-text,var(--acg-ng-text-secondary)) !important;
    box-shadow:none !important;
    font:inherit !important;
    font-size:var(--acg-ng-font-small) !important;
    font-weight:650 !important;
    line-height:1.35 !important;
    text-transform:none !important;
    letter-spacing:0 !important;
    cursor:pointer !important;
    user-select:none;
}
.acg-ach-title-pill { appearance:none !important; min-height:32px !important; padding:4px 9px !important; }
.acg-ach-badge { min-height:28px; padding:3px 8px; }
.acg-ach-reference { min-height:30px; padding:3px 8px; font-size:var(--acg-ng-font-body) !important; }

.acg-ach-title-pill:hover,
.acg-ach-title-pill:focus,
.acg-ach-title-pill:active { outline:none !important; transform:translateY(-1px); box-shadow:var(--acg-ng-shadow-focus) !important; }

.acg-ach-title-clear { color:var(--acg-ng-text-secondary); border-color:var(--acg-ng-border-default) !important; background:var(--acg-ng-bg-card); }
.acg-ach-title-clear:hover,
.acg-ach-title-clear:focus,
.acg-ach-title-clear:active,
.acg-ach-title-clear.is-selected { color:var(--acg-ng-text-primary); border-color:var(--acg-ng-border-accent) !important; background:var(--acg-ng-bg-input-focus); }

.acg-ach-title-pill.is-locked { --tier-text:var(--acg-ng-text-primary); --tier-border:var(--acg-ng-border-default); --tier-bg:var(--acg-ng-bg-control); opacity:.72; filter:var(--acg-ng-filter-disabled); }
.acg-ach-title-pill.is-locked:hover,
.acg-ach-title-pill.is-locked:focus { opacity:.92; filter:var(--acg-ng-filter-disabled-hover); }
.acg-ach-title-pill.is-selected { filter:var(--acg-ng-filter-selected); box-shadow:var(--acg-ng-shadow-card) !important; }

.acg-ach-title-text,
.acg-ach-reference-name { min-width:0; max-width:100%; overflow-wrap:anywhere; word-break:break-word; white-space:normal; }
.acg-ach-reference.is-hidden { --tier-text:var(--acg-ng-text-secondary); --tier-border:var(--acg-ng-border-default); --tier-bg:var(--acg-ng-bg-card); cursor:default !important; border-style:dashed !important; }

/* Tier 5 achievement text uses the same centralized pastel spectrum as
 * Tier 5 identity text. Keep the fill transparent so the spectrum remains
 * visible; do not flatten it to the near-white solid Tier 5 fallback. */
@supports ((-webkit-background-clip:text) or (background-clip:text)) {
    .acg-ach-launcher-button.tier-5>.acg-ach-title-text,
    .acg-ach-title-pill.tier-5:not(.is-locked)>.acg-ach-title-text,
    .acg-ach-badge.tier-5>.acg-ach-title-text,
    .acg-ach-reference.tier-5>.acg-ach-reference-name {
        background-image:var(--acg-ng-achievement-spectrum) !important;
        background-size:100% 100% !important;
        background-position:center !important;
        background-repeat:no-repeat !important;
        background-clip:text !important;
        -webkit-background-clip:text !important;
        color:transparent !important;
        -webkit-text-fill-color:transparent !important;
        text-shadow:none !important;
        filter:brightness(1.12) saturate(1.04);
    }
}

/* Click-open requirement panels */
.acg-ach-trigger { position:relative; cursor:pointer; }
.acg-ach-trigger>.acg-ach-tooltip { visibility:hidden; opacity:0; pointer-events:none; }
.acg-ach-trigger.is-tooltip-open>.acg-ach-tooltip,
.acg-ach-tooltip.is-open { visibility:visible !important; opacity:1 !important; pointer-events:auto !important; }

.acg-ach-tooltip {
    position:absolute;
    z-index:20 !important;
    width:min(440px,calc(100vw - 24px));
    height:auto;
    max-height:none;
    margin:0;
    padding:13px 14px;
    overflow:visible;
    visibility:hidden;
    opacity:0;
    pointer-events:none;
    border:var(--acg-ng-border-strong-line);
    border-radius:var(--acg-ng-radius-control);
    background:var(--acg-ng-bg-floating);
    box-shadow:var(--acg-ng-shadow-floating);
    color:var(--acg-ng-text-primary);
    font-family:var(--ach-font-family,inherit) !important;
    font-size:var(--acg-ng-font-body) !important;
    font-weight:400 !important;
    line-height:1.6 !important;
    text-align:left;
    white-space:normal;
    cursor:default;
    isolation:isolate;
    transition:opacity var(--acg-ng-transition-fast);
}
.acg-ach-tooltip.is-portaled { position:fixed !important; margin:0 !important; transform:none !important; }
.acg-ach-tooltip.is-positioning { opacity:0 !important; transition:none !important; }
.acg-ach-tooltip.is-open,
.acg-ach-tooltip.is-portaled { height:auto !important; max-height:none !important; overflow:visible !important; scrollbar-width:none !important; }
.acg-ach-tooltip::-webkit-scrollbar { display:none !important; width:0 !important; height:0 !important; }

.acg-ach-tooltip-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; min-height:32px; margin:0 0 8px; }
.acg-ach-tooltip-head>strong {
    display:block;
    margin:0;
    color:var(--acg-ng-text-primary) !important;
    -webkit-text-fill-color:var(--acg-ng-text-primary) !important;
    background:none !important;
    background-image:none !important;
    background-clip:border-box !important;
    -webkit-background-clip:border-box !important;
    text-shadow:none !important;
    filter:none !important;
    font:inherit !important;
    font-size:var(--acg-ng-font-body) !important;
    font-weight:750 !important;
    line-height:1.35 !important;
}
.acg-ach-tooltip-line { display:block; color:var(--acg-ng-text-primary); font:inherit !important; font-size:var(--acg-ng-font-body) !important; font-weight:400 !important; line-height:1.6 !important; -webkit-text-fill-color:currentColor; }
.acg-ach-tooltip-requirement { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.acg-ach-reference-list { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; overflow:visible; }

.acg-ach-tooltip-actions { display:inline-flex; flex:0 0 auto; justify-content:flex-end; margin:0; padding:0; border:0; }
.acg-ach-equip-action {
    appearance:none !important;
    min-width:58px !important;
    min-height:30px !important;
    margin:0 !important;
    padding:4px 9px !important;
    border:var(--acg-ng-border-strong-line) !important;
    border-radius:var(--acg-ng-radius-small) !important;
    background:var(--acg-ng-bg-control);
    box-shadow:none !important;
    color:var(--acg-ng-text-primary);
    font:inherit !important;
    font-size:var(--acg-ng-font-body) !important;
    font-weight:650 !important;
    line-height:1.25 !important;
    cursor:pointer !important;
}
.acg-ach-equip-action:hover,
.acg-ach-equip-action:focus,
.acg-ach-equip-action:active { border-color:var(--acg-ng-border-accent) !important; background:var(--acg-ng-bg-control-active); color:var(--acg-ng-text-primary); outline:none !important; }

@media (max-width:720px) {
    :where(.acg-ach-launcher,.acg-ach-menu-panel,.acg-ach-selection,.acg-ach-badge,.acg-ach-tooltip) { }
    .acg-ach-launcher-button { min-height:39px !important; padding:7px 13px !important; }
    .acg-ach-menu-scroll { padding:10px; }
    .acg-ach-selection { grid-template-columns:1fr; gap:8px; padding:10px; }
    .acg-ach-selection-label { padding-top:0; }
    .acg-ach-tooltip { width:min(420px,calc(100vw - 20px)); }
}