/* Relic Slide 4.0 — sitebrede stijl (accounts, start, profiel). Spelstijl staat in game.css. */
:root{--ink:#352519;--soft:#62452d;--sand:#f4dfb5;--parchment:#f9e7bf;--gold:#d9a544;--stone:#735035;--teal:#30898b;font-family:Georgia,"Times New Roman",serif;color:var(--ink);background:#b88d5d}
*{box-sizing:border-box}
html{min-height:100%}
body{margin:0;min-height:100vh;padding:22px 12px 35px;background:radial-gradient(ellipse at 50% 0%,#f4d39c 0%,transparent 68%),repeating-linear-gradient(105deg,#bd9769 0px,#bd9769 5px,#c49f73 6px,#c49f73 13px,#c09968 17px);background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.17;background-image:url("/assets/img/ruins.webp");background-size:cover;background-position:center;mix-blend-mode:multiply}
.wrap{position:relative;max-width:780px;margin:0 auto}
.brand{text-align:center;margin:0 auto 20px}
.brand-mark{height:148px;max-width:555px;margin:auto;background:url("/assets/img/logo.webp") center / contain no-repeat;filter:drop-shadow(0 10px 8px #52361d66)}
.brand p{font-size:clamp(14px,3vw,18px);margin:-3px 0 0;color:#442c19;text-shadow:0 1px #ffeac0;font-weight:700}
.panel{position:relative;background:linear-gradient(155deg,#f8e6c0eF,#e7c996f5);border:4px ridge #ab7845;border-radius:18px;padding:clamp(16px,4vw,30px);box-shadow:0 22px 45px #3d260f66,inset 0 0 0 3px #f6e2b5,inset 0 4px 25px #b489539c}
h2{margin:0 0 16px;font-size:clamp(22px,5vw,31px);color:#4c321e}
h3{color:#f5d186}
p{line-height:1.5}
a{color:#6f411d;text-decoration:underline;text-underline-offset:3px}
label{display:block;margin:14px 0 6px;font-size:15px;font-weight:bold}
input{width:100%;border-radius:9px;border:2px solid #c19a68;background:#fffbef;padding:13px;color:#392819;font:16px system-ui,sans-serif}
input:focus{outline:3px solid #48a9a2;outline-offset:1px}
button,.btn{display:inline-block;border:1px solid #7c4a1b;background:linear-gradient(#efc66a,#cd8f33);color:#352013;text-decoration:none;padding:12px 17px;border-radius:10px;box-shadow:0 3px 0 #80562c;font:700 15px system-ui,sans-serif;cursor:pointer}
.primary{width:100%;margin-top:20px}
.outline{background:#5c3c29;color:#fbe1a8;border-color:#ba8b52;box-shadow:none}
.links{margin-top:20px;display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.muted{font-size:14px;color:#6b4d35}
.notice{background:#e6efcf;border:1px solid #75956b;color:#34522f;border-radius:9px;padding:14px;margin-bottom:18px}
.notice.error,.error{background:#f3d0bc;color:#763b2b;border-color:#ab6453}
.playerbar{display:flex;align-items:center;gap:13px;padding:13px 17px;background:linear-gradient(115deg,#533821,#775033);border:2px solid #d4a057;border-radius:12px;box-shadow:inset 0 0 0 2px #4a301e;color:#fce7b9;margin-bottom:18px}
.playericon{width:52px;height:52px;display:grid;place-items:center;font-size:31px;border:2px solid #eab968;border-radius:50%;background:linear-gradient(#c7a676,#775336);color:#f8db85}
.playertext{display:flex;flex:1;min-width:0;flex-direction:column;gap:2px}
.playertext strong{font-size:23px;overflow-wrap:anywhere}
.eyebrow{font:700 10px system-ui,sans-serif;letter-spacing:1.6px}
.microcopy{font-size:13px;color:#f2d4a1}
.player-tag{font:800 10px system-ui,sans-serif;letter-spacing:1px;border:1px solid #cda358;border-radius:20px;padding:9px;color:#f8d586}
.welcome-plaque{text-align:center;background:linear-gradient(140deg,#ffedc8,#ebcf9b);border:3px solid #b98b55;border-radius:10px;padding:19px 14px 15px;margin-bottom:22px;box-shadow:0 5px 0 #c99d64,0 9px 18px #7e522d33}
.welcome-plaque h2{margin:6px 0}
.welcome-plaque p{margin:0 auto;max-width:460px;font-size:15px}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.game-tile{overflow:hidden;border-radius:13px;background:#593c27;border:3px solid #a67642;box-shadow:0 6px 0 #80552c,0 12px 14px #64401c38;display:flex;flex-direction:column}
.tile-art{height:140px;background-size:cover;background-position:center;border-bottom:3px solid #a67642}
.art-ontdekker{background-image:url("/assets/img/tile-ontdekker.webp?v=5")}
.art-historicus{background-image:url("/assets/img/tile-historicus.webp?v=5")}
.art-museum{background-image:url("/assets/img/tile-museum.webp?v=5")}
.art-coins{background-image:url("/assets/img/tile-coins.webp?v=5")}
.tile-symbol img{display:block;width:34px;height:34px;object-fit:contain;filter:drop-shadow(0 1px 1px #0008)}
.tile-body{padding:16px;color:#f7dfaf;flex:1;background:linear-gradient(#68492f,#46311f)}
.tile-heading{display:flex;align-items:center;gap:8px}
.tile-symbol{color:#e8b45c;font-size:25px}
.tile-body h3{font-size:21px;margin:0}
.tile-body p{font-size:14px;margin:9px 0 12px;color:#f9e6c3}
.soon{display:inline-block;font:700 10px system-ui,sans-serif;text-transform:uppercase;letter-spacing:.8px;color:#ffe4a2;background:#765336;border:1px solid #ae8150;border-radius:20px;padding:7px 10px}
.section-foot{border-top:1px solid #b98f58;margin-top:26px;padding-top:18px;display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;color:#644325;font-size:13px}
.footer{text-align:center;margin-top:17px;font-size:13px;color:#50331e;text-shadow:0 1px #f7d8aa}
@media (max-width:510px){
body{padding:8px 8px 25px}
.brand-mark{height:105px}
.panel{padding:14px}
.grid{gap:9px}
.tile-art{height:92px}
.tile-body{padding:10px}
.tile-body h3{font-size:17px}
.tile-body p{font-size:12px}
.soon{font-size:9px}
.player-tag{display:none}
.playericon{height:44px;width:44px}
.playertext strong{font-size:20px}
.welcome-plaque{padding:14px 9px}
.welcome-plaque p{font-size:13px}
}
@media (max-width:360px){
.grid{grid-template-columns:1fr}
.tile-art{height:125px}
}
@media (prefers-reduced-motion:no-preference){
button,.game-tile{transition:transform .15s ease,filter .15s ease}
button:hover{filter:brightness(1.08)}
button:active{transform:translateY(2px)}
}
.toolbar{display:flex;justify-content:space-between;align-items:center;margin:-4px 0 13px}
.theme-toggle{background:#62452d;color:#ffe1a6;padding:9px 12px;font-size:14px}
.profile-link{font:700 13px system-ui,sans-serif;color:#613d22}
.playerbar-link{text-decoration:none}
.playerbar-link:hover{filter:brightness(1.08)}
.player-counters{display:flex;gap:6px;flex-direction:column;font:700 12px system-ui,sans-serif;color:#f7d489;text-align:right;white-space:nowrap}
.xp-track{display:block;width:100%;height:10px;background:#39281c;border-radius:20px;border:1px solid #b78b4c;overflow:hidden;margin:5px 0 0}
.xp-fill{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,#28aaa9,#69e0ce)}
.profile-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.profile-head h2{flex:1;margin:0}
.profile-name{font-weight:bold}
.profile-stat{display:flex;gap:17px;align-items:center;border-radius:14px;padding:20px;background:#63442e;color:#fce6be;margin:20px 0}
.profile-stat h2{color:#ffdd8a;margin:4px 0}
.profile-stat p{margin:0}
.rank-medal{display:grid;place-items:center;border-radius:50%;border:3px solid #e2b769;width:76px;height:76px;background:#85633e;color:#ffdf8b;font-size:38px}
.profile-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.profile-metrics>div{background:#fce9c2;border:2px solid #b98e5a;padding:14px;border-radius:12px;display:flex;flex-direction:column;gap:6px}
.profile-metrics strong{font-size:20px}
.profile-metrics span{font:12px system-ui,sans-serif}
.ranks-title{margin-top:30px}
.rank-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.rank-item{display:flex;align-items:center;gap:10px;background:#d7bb8b;border:1px solid #ab8552;border-radius:10px;padding:12px;opacity:.75}
.rank-item.reached{background:#f8e4b8;opacity:1}
.rank-item.current{outline:3px solid #3d9c92}
.rank-item>span{font-size:25px;color:#9d753b}
.rank-item div{display:flex;flex-direction:column;gap:5px}
.rank-item small{font:11px system-ui,sans-serif}
.rank-item.ultimate{background:#59442a;color:#fbe6b5;opacity:1}
.rank-item.ultimate b{color:#f4cc79}
body[data-theme="dark"]{background:radial-gradient(ellipse at 50% 5%,#4b4a35,transparent 65%),#202a23;color:#f6dfae}
body[data-theme="dark"]:before{opacity:.18;mix-blend-mode:screen}
body[data-theme="dark"] .panel{background:linear-gradient(150deg,#344034f6,#1c2b26f6);border-color:#a47d46;box-shadow:0 18px 36px #090f0c99,inset 0 0 0 2px #b18f57}
body[data-theme="dark"] .welcome-plaque{background:linear-gradient(125deg,#364337,#24322d);border-color:#a88147}
body[data-theme="dark"] .welcome-plaque h2,body[data-theme="dark"] h2{color:#f2cd84}
body[data-theme="dark"] .welcome-plaque p,body[data-theme="dark"] .welcome-plaque .eyebrow{color:#f4e2bf}
body[data-theme="dark"] .brand p,body[data-theme="dark"] .footer,body[data-theme="dark"] a,body[data-theme="dark"] .section-foot{color:#f2d295}
body[data-theme="dark"] .profile-metrics>div,body[data-theme="dark"] .rank-item.reached{background:#3e493c;color:#ffebb9}
body[data-theme="dark"] .rank-item{background:#27342e;color:#f9dfaa}
body[data-theme="dark"] .rank-item.ultimate{background:#51402a}
@media (max-width:510px){
.playerbar{padding:10px;gap:10px}
.player-counters{font-size:10px}
.playertext strong{font-size:19px}
.rank-grid{grid-template-columns:1fr 1fr}
.rank-item{padding:8px;gap:7px}
.rank-item b{font-size:12px}
.rank-item small{font-size:10px}
}
.brand{display:flex;justify-content:center;align-items:center;margin:0 auto 10px;max-width:100%;}
.brand-logo{display:block;width:min(100%,650px);height:auto;filter:drop-shadow(0 9px 10px rgba(65,38,16,.32));}
@media (max-width:510px){
.brand{margin-bottom:8px}
.brand-logo{width:100%;max-width:480px}
}
.player-avatar{width:58px;height:58px;border-radius:50%;object-fit:cover;border:2px solid #edc073;flex-shrink:0;box-shadow:0 2px 8px #20150e88}
.profile-head{margin-bottom:12px}
.profile-head .icon-action{width:47px;height:47px;flex:none;display:grid;place-items:center;font:800 31px system-ui,sans-serif;line-height:1;color:#f5d797;text-decoration:none;background:linear-gradient(140deg,#755030,#48301d);border:2px solid #d5a359;border-radius:12px;box-shadow:0 3px 0 #674324;transition:transform .15s ease}
.profile-head .icon-action:focus-visible,.avatar-choice:focus-visible,.avatar-edit-link:focus-visible{outline:3px solid #38a8aa;outline-offset:3px}
.profile-head .icon-action:hover{transform:translateY(-2px)}
.avatar-edit-link{width:82px;height:82px;display:block;position:relative;flex-shrink:0;text-decoration:none}
.profile-avatar{width:100%;height:100%;object-fit:cover;border:3px solid #e0ba70;border-radius:50%;box-shadow:0 4px 10px #3421117a}
.avatar-edit-badge{position:absolute;right:-4px;bottom:-4px;border:2px solid #dbb475;background:#315f56;color:#fff4c7;border-radius:50%;width:28px;height:28px;display:grid;place-items:center;font:700 17px system-ui,sans-serif}
.avatar-section{margin:24px 0 4px;padding:18px;background:#65462e;border:2px solid #d2a35e;border-radius:16px;box-shadow:inset 0 0 0 2px #513521}
.avatar-section-heading h2{color:#ffe0a5;margin:0 0 4px}
.avatar-section-heading p{color:#f3d7a7;font-size:14px;margin:0 0 15px}
.avatar-picker{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;align-items:center}
.avatar-choice{position:relative;border:3px solid transparent;border-radius:50%;padding:0;background:none;box-shadow:none;width:100%;aspect-ratio:1/1;display:block;overflow:visible;min-width:0}
.avatar-choice img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;box-shadow:0 3px 6px #20130866}
.avatar-choice:hover{transform:scale(1.065);filter:brightness(1.1)}
.avatar-choice.is-selected{border-color:#42c4b0;box-shadow:0 0 0 2px #f8dc95,0 0 15px #48d0b58a}
.avatar-check{position:absolute;bottom:-7px;right:-6px;color:white;background:#247b6b;border:2px solid #ffe0a4;border-radius:50%;width:27px;height:27px;font:800 16px system-ui,sans-serif;display:grid;place-items:center}
body[data-theme="dark"] .avatar-section{background:#27362f;border-color:#a9854b}
@media (max-width:650px){
.avatar-picker{grid-template-columns:repeat(4,minmax(0,1fr))}
.player-avatar{width:46px;height:46px}
.avatar-section{padding:12px}
.avatar-edit-link{width:66px;height:66px}
.profile-head .icon-action{width:42px;height:42px}
}
.google-divider{text-align:center;margin:1.5rem auto .85rem;opacity:.8}
.google-login-wrap{display:flex;justify-content:center;margin:12px auto}
.google-account-section{margin:2rem 0;padding:1.2rem;border:2px solid #bc935d;border-radius:18px;background:rgba(242,215,168,.12)}
.google-account-section h2{margin-top:0}
.google-error{color:#a73723;text-align:center;min-height:1.4em;font-weight:600}
.username-section{margin:1.2rem 0;padding:1rem;border:1px solid #b98a56;border-radius:14px;background:rgba(142,100,51,.12)}
.username-form{display:flex;flex-wrap:wrap;gap:12px;align-items:end}
.username-form label{width:100%;font-weight:700}
.username-form input{flex:1;min-width:180px}
.admin-table{width:100%;border-collapse:collapse}
.admin-table th,.admin-table td{padding:10px;border-bottom:1px solid #9e7955;text-align:left}
.admin-scroll{overflow-x:auto}
.admin-table form{display:inline-flex;gap:5px;align-items:center;flex-wrap:wrap}
.admin-table input[type=number]{width:90px}
.admin-actions{display:flex;gap:8px;flex-wrap:wrap}
.admin-actions button{white-space:nowrap}
.admin-muted{font-size:.84rem;opacity:.8}
.compact-account-settings{margin:22px 0;padding:14px 20px;border:1px solid #b79a62;border-radius:16px;background:rgba(232,205,156,.1)}
.setting-line{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0}
.setting-line+.setting-line{border-top:1px solid rgba(214,179,112,.25)}
.setting-line span{display:flex;flex-direction:column;min-width:0;gap:5px}
.setting-line small{overflow-wrap:anywhere;opacity:.85}
.compact-edit{padding:14px;margin:0 0 10px;border-radius:12px;background:rgba(0,0,0,.08)}
.compact-edit[hidden]{display:none!important}
.compact-edit label{display:block;margin:8px 0}
.compact-edit input{width:100%;box-sizing:border-box}
.compact-edit button{margin-top:14px}
.edit-trigger{min-width:44px;min-height:44px;cursor:pointer}
.rewards-shortcut{display:flex;align-items:center;gap:14px;margin:24px 0 10px;padding:18px 20px;color:inherit;text-decoration:none;border-radius:17px;border:2px solid #bb9159;background:linear-gradient(135deg,#ead2a0,#bd935c);color:#422b1c;box-shadow:0 5px 0 #6e5132}
.rewards-shortcut>span:first-child{font-size:30px}
.rewards-shortcut>span:nth-child(2){flex:1;display:grid;gap:3px}
.rewards-shortcut small{font-size:13px}
.achievement-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:15px 0 25px}
.achievement-summary>div,.achievement-card{border:1px solid #bd9459;border-radius:15px;padding:15px;background:rgba(185,137,76,.11)}
.achievement-summary>div{display:flex;flex-direction:column;gap:7px}
.achievement-summary small,.achievement-summary span{font-size:12px}
.achievement-summary strong{font-size:20px}
.achievement-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.achievement-card{display:flex;flex-direction:column;gap:6px}
.achievement-card p{margin:0;flex:1}
.achievement-medal{font-size:36px;color:#cb9749}
.achievement-card.locked{opacity:.55;filter:saturate(.4)}
.daily-cycle{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.daily-cycle>div{display:flex;flex-direction:column;align-items:center;gap:6px;border:1px solid #ba8e51;border-radius:11px;padding:12px 3px;background:rgba(185,137,76,.13);text-align:center}
.daily-cycle small{font-size:11px}
.reward-history>div{display:flex;justify-content:space-between;gap:10px;padding:12px;border-bottom:1px solid #a48254}
.celebration-overlay[hidden]{display:none!important}
.celebration-overlay{position:fixed;inset:0;z-index:9999;background:rgba(28,21,13,.78);display:grid;place-items:center;padding:20px;overflow:hidden}
.celebration-dialog{position:relative;z-index:2;width:min(100%,440px);padding:40px 22px;text-align:center;background:linear-gradient(#fce4ab,#d4a25e);border:5px solid #77502a;box-shadow:0 15px 45px #0008;border-radius:24px;color:#4f311c}
.celebration-dialog h2{font-size:clamp(28px,5vw,42px);color:#613b1b}
.celebration-dialog strong{display:block;font-size:26px;margin:18px}
.celebration-icon{font-size:70px;color:#b47919;animation:relicpop .65s ease}
.celebration-confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.celebration-confetti i{position:absolute;top:-20px;width:9px;height:17px;background:var(--confetti-color);animation:relicfall var(--duration) linear forwards;left:var(--left)}
@keyframes relicfall{to{transform:translate3d(var(--drift),110vh,0) rotate(720deg)}}
@keyframes relicpop{from{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}
@media (max-width:600px){
.achievement-summary{grid-template-columns:1fr}
.daily-cycle{gap:3px}
.daily-cycle>div{padding:8px 1px}
.daily-cycle small{font-size:9px}
}
@media (prefers-reduced-motion:reduce){
.celebration-confetti{display:none}
.celebration-icon{animation:none}
}
.toolbar{justify-content:space-between}
.trophy-action{display:inline-grid;place-items:center;text-decoration:none;font-size:22px}
.profile-head .icon-action{flex:0 0 auto}
.logout-icon-form{margin:0}
.logout-icon-form button{cursor:pointer}
.celebration-dialog{background:linear-gradient(160deg,#ffe8b8,#d4a768);color:#422914}
.celebration-dialog h2,.celebration-dialog p,.celebration-dialog strong{color:#4b2c16!important;text-shadow:none!important}
.celebration-dialog .primary{color:#392512!important}
.celebration-overlay{background:rgba(20,18,12,.76)}
body[data-theme="dark"] .achievement-summary>div,body[data-theme="dark"] .achievement-card,body[data-theme="dark"] .daily-cycle>div{background:#26372e;color:#f7e1b7;border-color:#b5965a}
body[data-theme="dark"] .achievement-summary small,body[data-theme="dark"] .achievement-summary span,body[data-theme="dark"] .achievement-card p,body[data-theme="dark"] .achievement-card small,body[data-theme="dark"] .daily-cycle small{color:#e7cda0}
body:not([data-theme="dark"]) .achievement-summary>div,body:not([data-theme="dark"]) .achievement-card,body:not([data-theme="dark"]) .daily-cycle>div{background:#f5e2b9;color:#533920;border-color:#b48b50}
body:not([data-theme="dark"]) .achievement-card p,body:not([data-theme="dark"]) .achievement-summary span{color:#5d412b}
body[data-theme="dark"] .celebration-dialog{background:linear-gradient(150deg,#364539,#22342d);border-color:#c49b52}
body[data-theme="dark"] .celebration-dialog h2,body[data-theme="dark"] .celebration-dialog p,body[data-theme="dark"] .celebration-dialog strong{color:#ffe1a0!important}
body[data-theme="dark"] .celebration-dialog .primary{color:#392512!important}
body[data-theme="dark"] .celebration-icon{color:#eec36e}
@media (max-width:570px){
.profile-head{gap:8px}
.profile-name{display:none}
.achievement-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.achievement-card{padding:11px}
}
.brand{max-width:760px;margin:0 auto 14px;text-align:center;overflow:visible}
.brand-logo{display:block;width:min(100%,650px);height:auto;margin:0 auto;object-fit:contain;filter:drop-shadow(0 9px 10px rgba(65,38,16,.28))}
.achievement-star{font-size:27px;line-height:1;color:#edc06a}
.trophy-action{display:inline-flex;align-items:center;gap:10px;padding:10px 15px;font:700 14px system-ui,sans-serif;border:1px solid #b58b50;border-radius:11px;background:#68472e;color:#f9e6bc;text-decoration:none;box-shadow:0 3px 0 #3b2b20}
.trophy-action:hover,.trophy-action:focus-visible{filter:brightness(1.12);text-decoration:none}
body[data-theme="dark"] .trophy-action{background:#28392f;color:#f6dcaa;border-color:#bd985a}
body:not([data-theme="dark"]) .trophy-action{background:#704a2e;color:#fff0cc;border-color:#a9763a}
@media (max-width:510px){
.brand-logo{width:100%;max-width:480px}
.trophy-action{padding:9px 12px;font-size:13px}
}
.profile-head .settings-menu{position:relative;flex:none;margin-left:2px;z-index:20}
.settings-menu>summary{list-style:none;cursor:pointer;user-select:none;display:grid;place-items:center;font-size:26px}
.settings-menu>summary::-webkit-details-marker{display:none}
.settings-menu[open]>summary{outline:2px solid #3d9c92;outline-offset:2px}
.settings-dropdown{position:absolute;right:0;top:calc(100% + 12px);min-width:220px;padding:12px;border:2px solid #c89b53;border-radius:14px;background:#f4dfb1;color:#4b301c;box-shadow:0 12px 26px #23160db0;z-index:30;font:600 14px system-ui,sans-serif}
.settings-dropdown>b{display:block;padding:5px 10px 10px;font:700 17px Georgia,serif}
.settings-dropdown form{margin:0}
.settings-option{box-sizing:border-box;display:flex;width:100%;gap:11px;align-items:center;text-align:left;padding:11px 10px;background:transparent;border:0;border-radius:9px;color:inherit;text-decoration:none;font:600 14px system-ui,sans-serif;cursor:pointer}
.settings-option:hover,.settings-option:focus-visible{background:#dec28c;outline:0}
.settings-option>span:first-child{font-size:20px;width:23px;text-align:center}
.logout-option{border-top:1px solid #b99459;border-radius:0;margin-top:6px}
body[data-theme="dark"] .settings-dropdown{background:#293a30;color:#f8e0ad;border-color:#a88652}
body[data-theme="dark"] .settings-option:hover,body[data-theme="dark"] .settings-option:focus-visible{background:#435140}
@media (max-width:570px){
.profile-head h2{font-size:clamp(23px,6vw,34px)}
.profile-head .settings-menu{margin-left:auto}
.settings-dropdown{min-width:205px}
}
@keyframes rsfall{to{transform:translateY(110vh) rotate(720deg)}}
.game-tile .soon[href]{text-decoration:none!important;display:inline-flex;align-items:center;justify-content:center}
.game-tile .soon[href]:hover{text-decoration:none!important;filter:brightness(1.12)}
@keyframes rsTutorialStone{0%,18%,100%{transform:translateY(0)}38%,80%{transform:translateY(-9px)}}
@keyframes rsTutorialRelic{0%,38%,100%{transform:translateX(0)}72%{transform:translateX(120px)}}
/* 4.0: koppen direct op het lichte paneel beter leesbaar */
body:not([data-theme="dark"]) .panel>h3{color:#6b4520}
/* 4.3: avatars hebben hun gouden ring al in de afbeelding */
.player-avatar,.profile-avatar{border:0!important;background:transparent}
.avatar-choice img{box-shadow:0 3px 8px #20130866}

/* 5.0 — rang-iconen */
.rank-item>span.rank-ic{position:relative;flex:none;width:56px;height:56px;font-size:0}
.rank-ic img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 2px #0005)}
.rank-item:not(.reached) .rank-ic img{filter:grayscale(1) brightness(.9) opacity(.65)}
.rank-ic i{position:absolute;right:-4px;bottom:-2px;font-size:16px;font-style:normal}
.rank-item.current .rank-ic img{animation:rankGlow 2.4s ease-in-out infinite}
@keyframes rankGlow{50%{filter:drop-shadow(0 0 8px #ffd36a) drop-shadow(0 2px 2px #0005)}}
.rank-now{display:flex;align-items:center;gap:8px}
.rank-now img{flex:none;filter:drop-shadow(0 2px 3px #0006)}
.rank-eyebrow{display:inline-flex!important;align-items:center;gap:5px}
.rank-eyebrow img{flex:none}
@media (max-width:420px){.rank-item>span.rank-ic{width:44px;height:44px}}