/* Shared fantasy interface: ink-blue panels, warm metal and clear typography. */
:root {
 --bg:#101622;--surface:#1b2535;--text:#f3ead6;--muted:#b9c2cf;--accent:#e2c589;--border:#485064;
 --control-bg:#dcc18b;--control-hover:#efdab0;--control-pressed:#c6a76b;--control-text:#211e22;--control-ring:#b89858;--control-radius:4px;
 --panel-inset:#121b2a;--panel-shadow:0 8px 28px #05091140,inset 0 1px 0 #f5dfa00a;
}
html.theme-light {
 --bg:#ede9df;--surface:#faf6ec;--text:#252e3d;--muted:#535e70;--accent:#77551f;--border:#beb5a2;
 --panel-inset:#e8e2d6;--panel-shadow:0 8px 28px #35302112,inset 0 1px 0 #fff9;
}
body::before{filter:blur(3px);opacity:.24}
body::after{background:linear-gradient(180deg,#10162270,#101622ed)}
html.theme-light body::after{background:linear-gradient(180deg,#ede9df70,#ede9dff0)}
html body .header {
 --header-bg:#101827;--header-rail:#1a2536;--header-line:#5a5360;--header-hover:#2a3446;
 background:var(--header-bg);border-top:1px solid #bca47560;border-bottom:1px solid #bca47570;
 box-shadow:0 5px 24px #05091040;
}
html.theme-light .header{--header-bg:#f3eee2;--header-rail:#e6dfd0;--header-line:#b7aa90;--header-hover:#ddd1b9;background:var(--header-bg)}
.header .brand{color:var(--text);letter-spacing:2.5px}
.header #navigation,.header #navigation.open,.header #site-settings{border-radius:5px}
.header .tools-dropdown{background:var(--header-bg);border:1px solid var(--header-line);border-radius:5px;box-shadow:0 14px 34px #04081250}
html.theme-light .header .tools-dropdown{background:var(--header-bg)}
/* All main navigation entries use the shared gold controls in buttons.css. */
.header .tools-dropdown a:hover,.header .tools-dropdown a[aria-current=page]{color:var(--accent);background:var(--header-hover)}
.header #site-settings{background:var(--header-rail);border-color:var(--header-line)}
html body .header #site-settings select option{background:var(--surface);color:var(--text)}
.hero-shade{background:linear-gradient(90deg,#0c1424dc 0%,#10192875 50%,#10192812 100%),linear-gradient(0deg,#101622 0%,transparent 40%)}
html.theme-light .hero-shade{background:linear-gradient(90deg,#ede9dff2 0%,#ede9df9c 48%,#ede9df12 100%),linear-gradient(0deg,#ede9df 0%,transparent 40%)}
html.theme-light .hero-description{color:var(--text)}
h1,h2,h3{color:var(--text)}
.eyebrow,.small-tag,.text-link span{color:var(--accent)}
:is(.home-card,.tools-hub-card,.guild-panel,.party-card,.saved-build-card,.profile-summary,.build-panel,.video-card,.rift-live-card){
 background:var(--surface);border-color:var(--border);border-radius:6px;box-shadow:var(--panel-shadow);
}
:is(.home-card,.tools-hub-card,.saved-build-card):hover{border-color:var(--control-ring)}
html.theme-light :is(.home-card,.tools-hub-card,.guild-panel,.profile-summary,.saved-build-card){background:var(--surface);border-color:var(--border)}
.visual-build{--build-line:var(--border);--build-panel:var(--surface);--build-inset:var(--panel-inset);--build-gold:var(--accent)}
html.theme-light .visual-build{--build-line:var(--border);--build-panel:var(--surface);--build-inset:var(--panel-inset);--build-gold:var(--accent)}
.fact-strip{background:var(--surface);border-color:var(--border)}
.fact-strip>div,.guild-meta{border-color:var(--border)}
html body footer{background:var(--bg);border-top-color:var(--border);color:var(--muted)}
html body input,html body select,html body textarea{accent-color:var(--control-ring)}
html body :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background-color:var(--panel-inset);color:var(--text);border-color:var(--border);border-radius:4px}
html.theme-light body :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background-color:var(--panel-inset);color:var(--text);border-color:var(--border)}
html body :is(input,select,textarea):focus-visible{outline:2px solid var(--control-ring);outline-offset:2px}
html body .talent-row{background:var(--panel-inset);border-color:var(--border)}
html body .guild-table tbody tr:hover{background:var(--panel-inset)}
html body .guild-table :is(th,td){border-color:var(--border)}
html body .guild-table th,.guild-tag{color:var(--accent)}
html body .account-status{background:var(--surface);color:var(--text);border-color:var(--border)}
html body .account-status.error{background:#44232b;color:#ffe1dd;border-color:#a86b70}
html.theme-light body .account-status.error{background:#f9e3df;color:#752f32;border-color:#bd7e76}
/* Two compact live indicators share a single header area on every screen. */
.header .header-live{grid-column:3;grid-row:1;display:flex;align-items:stretch;gap:8px;min-width:0}
.header .header-live .header-players,.header .header-rift{
 display:flex;align-items:center;justify-content:center;gap:10px;padding:4px 12px;min-height:44px;
 border:1px solid var(--header-line);border-radius:var(--control-radius);background:var(--header-rail);color:var(--text);line-height:1rem;white-space:nowrap;
}
.header .header-live .header-players{flex-direction:column;gap:2px}
.header .header-rift{border-color:#ae906460;text-decoration:none}
.header .header-rift:hover,.header .header-rift:focus-visible{background:var(--header-hover);border-color:var(--accent)}
.header-rift img{width:24px;height:24px;object-fit:contain;flex-shrink:0}
.header-rift-copy{display:flex;flex-direction:column;gap:2px}
#header-rift-label{font-size:.875rem;line-height:1rem;color:var(--muted)}
#header-rift-countdown{font-family:var(--sans);font-size:1rem;line-height:1rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.03em;color:var(--accent)}
.header .header-player-count,.header .header-player-source{font-size:.875rem;line-height:1rem}
.header .header-player-count strong{font-size:1rem;line-height:1rem}
.header .header-rift.rift-open{border-color:#a293df;background:#252742}
.header .rift-open #header-rift-label,.header .rift-open #header-rift-countdown{color:#e0d7ff}
html.theme-light .header .header-rift.rift-open{background:#e6def5;border-color:#7963a6}
html.theme-light .header .rift-open #header-rift-label,html.theme-light .header .rift-open #header-rift-countdown{color:#4d3378}
@media(max-width:1550px){
 .header{grid-template-columns:auto minmax(0,1fr) auto;gap:12px}
 .header #site-settings{grid-column:3;grid-row:1}
 .header .header-live{grid-column:1/-1;grid-row:2;justify-self:center;justify-content:center;max-width:100%}
 .header .header-live .header-players{flex-direction:row;gap:8px}
 .header .header-live .header-players,.header .header-rift{min-height:44px;padding:4px 12px}
 .header-rift-copy{flex-direction:row;align-items:center;gap:10px}
}
@media(max-width:1150px){
 .header{grid-template-columns:minmax(0,1fr) auto auto}
 .header #site-settings{grid-column:2;grid-row:1}
 .header #navigation.open{border-radius:5px}
 .header .tools-dropdown,html.theme-light .header .tools-dropdown{background:transparent;border:0;border-left:1px solid var(--header-line);box-shadow:none}
}
@media(max-width:540px){
 .header .header-live{width:100%;gap:6px}
 .header .header-live .header-players,.header .header-rift{flex:1 1 0;padding:4px 8px;min-width:0;gap:6px}
 .header .header-live .header-players{flex-direction:column;gap:1px}
 .header-rift-copy{flex-direction:column;align-items:flex-start;gap:1px}
 .header-player-source{font-size:.875rem}
 #header-rift-label{white-space:normal}
 .header-rift img{width:24px;height:24px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* One fluid page width across tools, account pages and editorial sections. */
:root{--page-gutter:clamp(12px,2vw,40px)}
html body main:is(.account-page,.catalogue-page,.craft-page),
html body .map-workspace{
 width:100%;max-width:none;padding-inline:var(--page-gutter);
}
html body main.patch-page,
html body main:not(.account-page):not(.catalogue-page):not(.craft-page)>:is(.section,.page-hero,.tools-hub-links,.tools-subpage-nav){
 width:calc(100% - var(--page-gutter) - var(--page-gutter));max-width:none;
}
/* Already padded page wrappers must not add a second gutter to their navigation. */
html body main:is(.account-page,.catalogue-page,.craft-page)>.tools-subpage-nav{
 width:100%;max-width:none;
}
html body :is(.header,.hero,.fact-strip,.closing,.adventure-shortcuts,footer){
 padding-inline:var(--page-gutter);
}
html body .hero-footer{left:var(--page-gutter);right:var(--page-gutter)}

/* Compact home shortcuts, with every destination kept visible. */
.home-links.section{display:block;padding-block:32px}
.home-links>div:first-child{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 24px;margin-bottom:18px}
.home-links .eyebrow{margin:0}
.home-links h2{margin:0;font-size:clamp(26px,2.4vw,36px);line-height:1.2;letter-spacing:-.5px}
.home-links .quick-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px}
.home-links .quick-links a{min-width:0;min-height:48px;padding:10px 4px;gap:10px;font-size:14px;line-height:1.4;overflow-wrap:anywhere}
.home-links .quick-links a :is(span,b){flex-shrink:0}
@media(max-width:950px){.home-links .quick-links{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}}
@media(max-width:540px){
 .home-links.section{padding-block:24px}
 .home-links>div:first-child{display:block;margin-bottom:12px}
 .home-links .eyebrow{margin-bottom:8px}
 .home-links .quick-links{column-gap:12px}
 .home-links .quick-links a{font-size:13px;gap:6px;padding-block:9px}
}

/* Shared, readable effects in the editor, public builds and the database. */
.farever-effect-tooltip{position:fixed;z-index:10000;box-sizing:border-box;width:max-content;max-width:min(360px,calc(100vw - 16px));max-height:calc(100dvh - 24px);overflow:auto;padding:14px 16px;background:#101b2c;color:#f6ecd4;border:1px solid #c9a761;border-radius:10px;box-shadow:0 10px 32px #0008;font:400 13px/1.5 Arial,sans-serif;white-space:normal;text-align:left}
.farever-effect-tooltip>strong{display:block;color:#e4c487;font-size:15px}.farever-effect-tooltip p{font:inherit;margin:8px 0;white-space:pre-line}.farever-effect-tooltip small{display:block;color:#bec8d6;margin-top:5px}.farever-effect-tooltip dl{margin:8px 0}.farever-effect-tooltip dl>div{display:flex;justify-content:space-between;gap:20px}.farever-effect-tooltip dd{margin:0;font-weight:700}.rune-readonly{display:block;min-width:0}.rune-readonly>.rune-option{width:100%}.db-effect-description,#map-hover-name,#world-map-detail h2,#world-map-results button>span{white-space:pre-line}
/* Keep build identity and actions together; free the screen for the loadout. */
html body.builds-page #contenu .account-heading{max-width:none;display:flex;align-items:center;flex-wrap:wrap;gap:8px 20px;padding:14px 18px;margin:0 0 12px;background:linear-gradient(110deg,#243043e8,#131c2bbf);border:1px solid #465269;border-left:3px solid #dfc38b;border-radius:8px}
html body.builds-page #contenu .account-heading .eyebrow{flex-basis:100%;margin:0;font-size:11px;letter-spacing:.13em}
html body.builds-page #contenu .account-heading h1{font-size:clamp(25px,2.3vw,36px);line-height:1.15;margin:0;letter-spacing:-.04em;overflow-wrap:anywhere}
html body.builds-page #contenu .account-heading p{margin:0;font-size:13px;line-height:1.4}
html body.builds-page #contenu .account-heading :is(.button,button){margin:0;min-height:36px;padding:8px 12px;font-size:12px}
html body.builds-page #contenu .account-heading .account-actions{gap:6px}
html body.builds-page #contenu .account-heading>p:empty{display:none}
html body.builds-page #public-build-tags{margin:0}
html body.builds-page #public-build-tags .build-tag{margin-block:0}
html body.builds-page #contenu .account-status{padding:8px 12px;margin:8px 0;font-size:12px}
html body.builds-page #contenu .discord-connection{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;margin:8px 0 12px}
html body.builds-page #contenu .discord-connection p{margin:0;font-size:12px}
html body.builds-page #contenu .discord-connection :is(button,.button){margin:0;padding:7px 10px;min-height:34px;font-size:12px}
html body.builds-page #contenu .build-toolbar{gap:10px;padding:12px;margin-bottom:10px}
html body.builds-page #contenu .build-toolbar :is(input,select,button){min-height:38px;padding:8px 10px;font-size:13px}
html body.builds-page #contenu .build-toolbar label{font-size:12px;gap:4px}
html body.builds-page #contenu .build-tags-panel{padding:8px 12px;margin-block:0 12px}
html body.builds-page #contenu .build-tags-panel .build-hint{display:none}
html body.builds-page #contenu .build-tags-panel legend{font-size:12px}
html body.builds-page #contenu .build-tags{gap:6px}
html body.builds-page #contenu .build-tags :is(label,button){min-height:32px;padding:6px 9px;font-size:12px}
@media(max-width:650px){html body.builds-page #contenu .account-heading{gap:8px 12px;padding:12px}html body.builds-page #contenu .account-heading h1{flex-basis:100%}html body.builds-page #contenu .discord-connection{flex-wrap:wrap}html body.builds-page #contenu .build-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}html body.builds-page #contenu .build-toolbar>label:first-child{grid-column:1/-1}}
/* Poster overlays must remain transparent over the video artwork. */
html body #contenu .video-player>button{position:absolute;inset:0;width:100%;height:100%;margin:0;border:0;border-radius:0;background:linear-gradient(0deg,#09131cca,#09131c18);color:#fff;box-shadow:none;text-shadow:0 1px 4px #000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
html body #contenu .video-player>button:hover{background:linear-gradient(0deg,#09131cd9,#09131c50);color:#fff}
html body #contenu .video-player>button .video-play-icon{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#ddc18a;color:#162033;text-shadow:none;padding-left:3px}
.weapon-identity{display:flex;align-items:center;gap:10px}.weapon-identity img{width:42px;height:42px;object-fit:contain;flex-shrink:0;border:1px solid #526078;border-radius:6px;background:#142132}.weapon-loot{min-width:180px;max-width:280px;font-size:12px}.weapon-loot a{display:block;margin:3px 0}.weapon-loot small{display:block;color:#b8c4d4}