/* Calm Diriyah presentation; game data and session storage remain independent. */
:root{--soft-bg:#f7f3eb;--soft-green:#565b43;--soft-ink:#454a37;--soft-brown:#938570;--soft-gold:#bdaa8d;--saudi-green:#565b43}
html,body,body.home-view,body.tv-mode{background:var(--soft-bg);color:var(--soft-ink)}
.sadu-edge{display:none!important}
body.home-view{background-image:url('quiet-diriyah.svg');background-position:center bottom;background-repeat:repeat-x;background-size:auto 240px;background-attachment:fixed}
.lobby-topbar{background:#f7f3ebed;border-color:#d8cdbb55;min-height:80px;max-width:1260px;margin:auto;padding-inline:32px;gap:18px}
.brand-logo-button{color:#454a37}.soft-palm,#brand>p{display:none!important}.soft-wordmark{font-size:38px}
.community-link{background:#f8f5ee;color:#565b43;border-color:#d6ccba;box-shadow:none}.community-copy strong{color:#565b43}
.soft-icon{background:#efebe2;border-color:#e2dbce;color:#565b43}
.soft-hero,body.home-view .soft-hero,body.tv-mode.home-view .soft-hero{height:auto;min-height:110px;overflow:visible;padding:20px 0 24px}
.soft-hero-art,.soft-clouds,.soft-hero:after{display:none}
.soft-hero-copy{width:100%;padding:0 24px;text-align:center;height:auto}
.soft-hero-copy h2{font-size:clamp(28px,3vw,40px);color:#454a37;line-height:1.6;margin:0;font-weight:700}
.soft-hero-copy:before,.soft-hero-copy:after{content:'▴ ▴ ▴';position:absolute;color:#c8b49580;font-size:18px;top:8px}.soft-hero-copy:before{right:5%}.soft-hero-copy:after{left:5%}
body.home-view #app{width:min(100% - 64px,1160px);margin:0 auto 28px}
body.home-view .home-section-heading{margin:0 0 20px;gap:14px}
body.home-view .home-section-heading h2{font-size:18px;font-weight:400;color:#8c806c}
body.home-view .home-section-heading>span,body.home-view .home-section-heading:before,body.home-view .home-section-heading:after{display:none}
body.home-view .home-category-grid,body.tv-mode.home-view .home-category-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
body.home-view .home-category-grid .home-category{height:146px;min-height:146px;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:18px 12px 24px;background:#fcfaf4e8;border:1px solid #e1d9cc;border-radius:17px;box-shadow:0 4px 12px #6a563906}
.quiet-card-icon{display:grid;place-items:center;flex:none;width:40px;height:40px}.quiet-card-icon .section-icon{width:38px;height:38px;object-fit:contain;filter:grayscale(1) sepia(.25);opacity:.8}
body.home-view .home-category-body{padding:0;flex:none;gap:0;min-height:0}
body.home-view .home-category-grid .home-category strong{font-size:19px;line-height:1.5;color:#454a37}
body.home-view .home-category-grid .home-category small{display:none}
body.home-view .home-category-grid .home-category[aria-pressed=true]{background:#f0f0e4;border-color:#899173;box-shadow:0 0 0 1px #89917325}
.soft-selected{background:#747e60;width:19px;height:19px;font-size:12px}
body.home-view .home-category-grid .section-info{width:22px;height:22px;min-height:22px;color:#938570;border-color:#ded6c6;background:#faf7ef}
body.home-view .home-start,body.tv-mode.home-view .home-start,.primary,.primary.teal,.lobby-begin{background:#697457;border-color:#697457;box-shadow:none;color:#fffdf6}
body.home-view .home-start{font-size:21px;border-radius:14px}
body.home-view footer{background:none;padding-top:30px;color:#847962}.developer-credit,.developer-support{color:#565b43}.developer-support{background:#faf7ef;border-color:#ded6c6}
.panel,.lobby-shell,.question-card,dialog{background:#fcfaf4;border-color:#e1d9cc;color:#454a37}
.mobile-dock{display:none}
@media(max-width:900px){body.home-view .home-category-grid,body.tv-mode.home-view .home-category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){
 .lobby-topbar{padding:12px 16px;min-height:74px;gap:10px}.soft-wordmark{font-size:34px}.soft-tools{gap:8px}.soft-icon{width:44px;height:44px;min-height:44px}.community-link{width:44px;height:44px;min-height:44px;padding:10px}
 .soft-hero,body.home-view .soft-hero{min-height:90px;padding:16px 0 20px}.soft-hero-copy h2{font-size:28px}.soft-hero-copy:before,.soft-hero-copy:after{font-size:12px;top:-8px}
 body.home-view #app{width:calc(100% - 32px)}body.home-view .home-section-heading{margin-bottom:14px}body.home-view .home-section-heading h2{font-size:15px}
 body.home-view .home-category-grid,body.tv-mode.home-view .home-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
 body.home-view .home-category-grid .home-category{height:124px;min-height:124px;padding:16px 8px 22px;gap:8px;border-radius:15px}
 body.home-view .home-category-grid .home-category strong{font-size:17px;padding:0}.quiet-card-icon,.quiet-card-icon .section-icon{width:33px;height:33px}
 body.home-view .home-category-grid .home-category[aria-pressed=true] .soft-selected{top:8px;bottom:auto;right:8px;width:18px;height:18px}
 body.home-view footer{padding-bottom:100px}body:not(.playing){padding-bottom:84px}
 .mobile-dock{display:flex;position:fixed;z-index:20;bottom:0;inset-inline:0;justify-content:space-around;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:#f8f5eef5;border-top:1px solid #ddd5c6;backdrop-filter:blur(12px)}
 .mobile-dock button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:60px;min-height:48px;padding:4px;border:0;background:none;color:#777966;font-size:12px;box-shadow:none;border-radius:10px}
 .mobile-dock img{width:21px;height:21px;object-fit:contain;filter:grayscale(1);opacity:.7}.mobile-dock button[aria-current=page]{color:#464e36;background:#e9ecdf}
 body.playing .mobile-dock{display:none}#mobileResults{max-width:min(92vw,480px);max-height:80svh;overflow:auto}#mobileResults .rank{display:flex;justify-content:space-between;gap:20px}
}
@media(min-width:1600px){body.home-view #app{width:min(100% - 100px,1440px)}body.home-view .home-category-grid .home-category{height:172px;min-height:172px}body.home-view .home-category-grid .home-category strong{font-size:25px}.quiet-card-icon,.quiet-card-icon .section-icon{width:44px;height:44px}.soft-hero-copy h2{font-size:46px}}
.quiet-card-icon .section-icon,.mobile-dock img{filter:brightness(0) saturate(100%) invert(30%) sepia(12%) saturate(686%) hue-rotate(36deg) brightness(93%) contrast(85%);opacity:.9}
body:not(.home-view) .soft-hero{display:none!important}
/* Keep the approved wordmark geometrically centered on every screen. */
.lobby-topbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;min-height:116px}
#brand,body.home-view #brand,body.playing #brand,body.tv-mode #brand{grid-column:2;grid-row:1;min-width:0;margin:0;justify-self:center}
.community-bar,body.home-view .community-bar{grid-column:1;grid-row:1;justify-self:start}
.soft-tools{grid-column:3;grid-row:1;justify-self:end}
.brand-logo-button{justify-content:center}.approved-wordmark{display:block;width:200px;height:92px;object-fit:contain}
@media(max-width:650px){.lobby-topbar{min-height:104px;padding:10px 14px;gap:6px}.approved-wordmark{width:146px;height:78px}.soft-tools{gap:5px}.soft-tools .soft-icon{width:38px;height:38px;min-height:38px;padding:8px}.community-link{width:40px;height:40px;min-height:40px}.soft-hero,body.home-view .soft-hero{padding-top:6px}}
@media(max-width:350px){.approved-wordmark{width:120px;height:70px}.lobby-topbar{padding-inline:10px}.soft-tools{gap:3px}.soft-tools .soft-icon{width:34px;height:34px;min-height:34px}}
/* Reference-matched clay, line drawings and soft inset cards. */
body.home-view{background-image:url('diriyah-reference-background.png');background-size:cover;background-position:center bottom;background-repeat:no-repeat;background-attachment:fixed}
.lobby-topbar{background:transparent;border:0;min-height:126px}
.approved-wordmark{width:224px;height:106px}
.soft-tools .soft-icon{background:#eae4d866;border:1px solid #ddd5c680;box-shadow:0 2px 6px #9a85650a}
.soft-hero,body.home-view .soft-hero{min-height:66px;padding:0 0 27px}
.soft-hero-copy h2{font-size:28px;line-height:1.5}
.soft-hero-copy:before,.soft-hero-copy:after{content:'';width:62px;height:23px;border-top:1px solid #c4a78280;background:linear-gradient(60deg,transparent 50%,#c4a78288 51%) 0 9px/14px 12px repeat-x;top:0}
body.home-view .home-section-heading{display:none}
body.home-view #app{width:min(100% - 64px,1160px)}
body.home-view .home-category-grid{gap:13px}
body.home-view .home-category-grid .home-category{height:156px;min-height:156px;gap:12px;border:1px solid #ffffffb0;border-radius:16px;background:linear-gradient(145deg,#fffdf8ba,#f1e8d9c9);box-shadow:0 4px 13px #8f765b0d,inset 0 0 0 1px #ede3d469;backdrop-filter:blur(3px)}
.quiet-card-icon,.quiet-card-icon .section-icon{width:42px;height:42px;filter:none;opacity:1}
body.home-view .home-category-grid .home-category strong{font-weight:500;font-size:21px;line-height:1.5;color:#424631}
body.home-view .home-category-grid .home-category[aria-pressed=true]{background:linear-gradient(145deg,#fdfcf5d9,#eee9d9dd);border-color:#aaa98d;box-shadow:0 0 0 1px #8d957025,0 4px 13px #8f765b0d}
body.home-view .home-category-grid .section-info{opacity:.65;bottom:7px;left:8px;width:19px;height:19px;min-height:19px;font-size:11px}
body.home-view footer{margin-top:28px;padding-top:28px;background:transparent}
.developer-support,.community-link{background:#faf6ed99;border-color:#dbcfbc80}
.soft-start-area{margin-top:22px}
@media(min-width:901px){body.home-view .home-category-grid>.tile-wrap:nth-last-child(2){grid-column:2}body.home-view .home-category-grid>.tile-wrap:last-child{grid-column:3}}
@media(max-width:650px){
 body.home-view{background-size:auto 100svh;background-position:center bottom}
 .lobby-topbar{min-height:125px;padding:12px 14px 0;align-items:start}.approved-wordmark{width:174px;height:102px}.soft-tools,.community-bar{margin-top:7px!important}
 .soft-hero,body.home-view .soft-hero{min-height:61px;padding:0 0 24px}.soft-hero-copy h2{font-size:24px}.soft-hero-copy:before,.soft-hero-copy:after{width:41px;top:-28px;height:20px;background-size:12px 10px}
 body.home-view #app{width:calc(100% - 32px)}body.home-view .home-category-grid{gap:11px}
 body.home-view .home-category-grid .home-category{height:132px;min-height:132px;gap:11px;padding:15px 7px 22px;border-radius:14px}
 .quiet-card-icon,.quiet-card-icon .section-icon{width:35px;height:35px}body.home-view .home-category-grid .home-category strong{font-size:18px}
 .mobile-dock{background:#f4efe5f5;border-top:1px solid #e2d9ca;box-shadow:none}.mobile-dock button[aria-current=page]{background:none;color:#424a35}
 body.home-view footer{padding-bottom:100px}
}
@media(min-width:1600px){.lobby-topbar{min-height:155px}.approved-wordmark{width:260px;height:128px}.soft-hero-copy h2{font-size:34px}body.home-view .home-category-grid .home-category{height:180px;min-height:180px}body.home-view .home-category-grid .home-category strong{font-size:25px}.quiet-card-icon,.quiet-card-icon .section-icon{width:47px;height:47px}}
/* Center the complete icon and label stack, overriding inherited RTL alignment. */
body.home-view .home-category-grid .home-category{align-items:center!important;justify-content:center!important;text-align:center;gap:10px}
body.home-view .home-category-grid .quiet-card-icon{position:relative;inset:auto;display:grid;place-items:center;align-self:center;margin:0 auto!important;flex:0 0 56px;width:56px;height:56px;border-radius:18px;background:linear-gradient(145deg,#f9f7ed,#e9e9da);border:1px solid #d6d7bf85;box-shadow:inset 0 1px 0 #ffffffdc,0 3px 7px #6a61470a}
body.home-view .home-category-grid .quiet-card-icon .section-icon{display:block;position:static;align-self:center;margin:0!important;width:34px;height:34px;filter:none;opacity:1;object-fit:contain;transform:none}
body.home-view .home-category-body{align-self:center;align-items:center;justify-content:center;text-align:center;width:100%;margin:0!important;padding:0!important}
body.home-view .home-category-grid .home-category[aria-pressed=true] .quiet-card-icon{background:linear-gradient(145deg,#edf0df,#e0e5cd);border-color:#bcc4a2}
@media(max-width:650px){body.home-view .home-category-grid .home-category{gap:10px}body.home-view .home-category-grid .quiet-card-icon{width:50px;height:50px;flex-basis:50px;border-radius:16px}body.home-view .home-category-grid .quiet-card-icon .section-icon{width:31px;height:31px}}
