/* Ryadom extra content and separate games tab. Mobile-first and safe-area aware. */
.ryx-games-tab{display:flex;align-items:center;justify-content:center;gap:4px;min-width:0;color:#7e856f}
.ryx-games-tab .ryx-games-dice{font-size:20px;line-height:1.2}
.ryx-games-tab.ryx-selected{color:#ab725c!important;background:#f3eae3!important;border-radius:10px}
.bottom-nav .ryx-games-tab{flex:1;flex-direction:column;gap:3px;padding:7px 0 5px;font-size:9px;min-height:51px}
.sidebar nav .ryx-games-tab{flex-direction:row;justify-content:flex-start;text-align:left;padding:13px 15px;font-size:13px}
.ryx-games-screen{display:none;margin-left:232px;max-width:1450px;padding:30px 46px 120px;min-height:calc(100dvh - 80px);background:#faf8f3;color:#36372e}
body.ryx-games-open .ryx-games-screen{display:block}
body.ryx-games-open .main-content, body.ryx-games-open .topbar{display:none!important}
body.ryx-games-native .main-content .page-heading,body.ryx-games-native .main-content .leisure-tabs{display:none!important}
body.ryx-games-native #leisure-ideas{display:none!important}
/* Game selectors remain reachable through the new tab via JS .click(). */
body:not(.ryx-games-native) .leisure-tabs #tab-choices, body:not(.ryx-games-native) .leisure-tabs #tab-memory,body:not(.ryx-games-native) .leisure-tabs #tab-challenges{display:none!important}
.ryx-header{display:flex;gap:15px;align-items:start;justify-content:space-between;margin:0 0 12px}
.ryx-header h1{font-size:clamp(29px,5vw,43px);line-height:1.18;font-weight:400;font-family:Georgia,serif}
.ryx-eyebrow{display:block;font-size:10px;text-transform:uppercase;letter-spacing:1.4px;color:#9c9380;margin-bottom:11px}
.ryx-back,.ryx-secondary{border:1px solid #d8d7ca;border-radius:10px;padding:11px 16px;background:#f1efe8;color:#656e58;font-weight:600;font-size:13px}
.ryx-back{flex-shrink:0}
.ryx-lead{font-size:13px;line-height:1.6;color:#7d8074;margin:0 0 22px}
.ryx-game-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ryx-game-tile{border:1px solid #e0ded2;border-radius:15px;background:#fffef9;padding:21px 18px;text-align:left;display:flex;flex-direction:column;gap:9px;min-height:162px}
.ryx-game-tile:hover,.ryx-game-tile:focus-visible{background:#f7f1eb;border-color:#c6ae96}
.ryx-game-emoji{font-size:26px;line-height:1.3}.ryx-game-tile strong{font-size:16px}.ryx-game-tile small{font-size:11px;line-height:1.5;color:#777c70}
.ryx-tip{margin:22px 0;font-size:12px;color:#818575;line-height:1.6}
.ryx-blitz-card{max-width:700px;background:#fffefa;border:1px solid #e0ded2;border-radius:18px;padding:30px;display:flex;flex-direction:column;gap:20px}
.ryx-blitz-card h2{font-family:Georgia,serif;font-size:27px;line-height:1.3}
.ryx-blitz-note{color:#737769;font-size:14px}.ryx-choice-buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ryx-choice{min-height:110px;border-radius:12px;border:1px solid #e4d4c5;background:#f8f0e9;font-size:17px;font-weight:600;padding:16px}
.ryx-choice:nth-child(2){background:#f0f3e9;border-color:#dce3d2}
.ryx-primary{display:block;width:100%;border:0;background:#ae7662;color:white;border-radius:10px;min-height:48px;padding:13px 20px;font-size:14px;font-weight:600;text-align:center}
.ryx-primary:disabled{opacity:.55;cursor:wait}
.ryx-score{font-size:24px;font-family:Georgia,serif}.ryx-big-score{font-family:Georgia,serif;font-size:68px;font-weight:400;color:#ae7662}
.ryx-bonus-questions,.ryx-bonus-activities,.ryx-daily{margin:26px 0 45px;padding:25px;border-radius:15px;background:#f4f1e9;border:1px solid #e4e0d3}
.ryx-bonus-questions h2,.ryx-bonus-activities h2,.ryx-daily h2{font-size:26px;font-family:Georgia,serif;margin:0 0 14px}
.ryx-section-head{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.ryx-tag{background:#e8e7d9;color:#64735f;font-size:11px;padding:4px 9px;border-radius:100px}
.ryx-search,.ryx-select,.ryx-answer{display:block;width:100%;border:1px solid #dadbcf;background:white;border-radius:9px;padding:12px 14px;font-size:14px;color:#333;min-height:46px}
.ryx-search{margin:14px 0 18px}.ryx-question-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-height:720px;overflow:auto}
.ryx-question-card{padding:18px;background:white;border:1px solid #e4e0d3;border-radius:10px;text-align:left;display:flex;flex-direction:column;gap:9px;min-height:145px}
.ryx-question-card small,.ryx-activity-card small{font-size:11px;color:#a77b67}.ryx-question-card strong{font-size:14px;line-height:1.4;font-weight:500}.ryx-question-card span{color:#6d7b62;font-size:12px;margin-top:auto}
.ryx-filters{display:flex;gap:12px;margin-bottom:18px}.ryx-filters .ryx-search{margin:0}.ryx-filters .ryx-select{width:min(35%,220px)}
.ryx-activity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-height:880px;overflow:auto}
.ryx-activity-card{display:flex;flex-direction:column;gap:9px;padding:18px;border:1px solid #e1dfd3;border-radius:11px;background:#fffef9}
.ryx-activity-card h3{font-size:16px}.ryx-activity-card p{font-size:12px;line-height:1.5;color:#777a71;flex:1}
.ryx-activity-card .ryx-secondary{font-size:11px;padding:9px}
.ryx-daily{background:#f0ece0;max-width:800px}.ryx-daily p{margin-bottom:15px;font-size:13px;line-height:1.5}
.ryx-modal{position:fixed;inset:0;width:min(100vw,650px);height:min(94dvh,870px);max-height:94dvh;max-width:none;border:1px solid #ddd9c9;background:#faf8f3;color:#383930;border-radius:18px;padding:0;box-shadow:0 18px 80px #0005;overscroll-behavior:contain}
.ryx-modal::backdrop{background:#26271fc2;backdrop-filter:blur(4px)}
.ryx-modal-inner{display:flex;flex-direction:column;gap:15px;height:100%;overflow:auto;padding:22px;padding-bottom:max(22px,env(safe-area-inset-bottom));box-sizing:border-box}
.ryx-modal-header{position:sticky;top:-22px;display:flex;justify-content:space-between;align-items:center;padding:10px 0;background:#faf8f3;z-index:1;border-bottom:1px solid #e4e1d5}
.ryx-modal h2{font-family:Georgia,serif;font-size:26px;font-weight:400}
.ryx-close{font-size:30px;line-height:1;width:44px;height:44px;border:1px solid #ddd5c8;border-radius:50%;flex-shrink:0}
.ryx-question-large{font-family:Georgia,serif;font-size:22px;line-height:1.45}.ryx-answer{resize:vertical;min-height:130px;flex:1}
.ryx-field-label{display:flex;flex-direction:column;gap:8px;font-size:13px;color:#555}.ryx-error{min-height:1.2em;color:#a15d4f;font-size:12px}
.ryx-steps{font-size:14px;line-height:1.7;padding-left:24px}.ryx-act-meta{font-size:12px;color:#8a7b69}
.ryx-toast{position:fixed;z-index:2147483600;bottom:max(100px,env(safe-area-inset-bottom) + 75px);left:50%;transform:translateX(-50%);background:#4e5d49;color:white;border-radius:12px;padding:12px 18px;box-shadow:0 8px 24px #0002;font-size:13px;max-width:90vw}
/* Fix extra editor top layer and close button for iOS Telegram safe area */
.ry-photo-dialog{max-height:100dvh!important;height:100dvh!important;top:0!important;bottom:0!important;border-radius:0!important}
.ry-photo-dialog .ry-photo-editor-header{position:sticky;top:0;background:#faf8f3;z-index:3;padding-top:max(12px,env(safe-area-inset-top))}
.ry-photo-dialog .ry-photo-editor-footer{position:sticky!important;bottom:0!important;background:#faf8f3;z-index:3;padding-bottom:max(15px,env(safe-area-inset-bottom))}
.ry-policy-view .ry-policy-view-head{position:sticky;top:0;background:#faf8f3;z-index:3}
.ry-policy-view .ry-editor-close{width:44px;height:44px;min-width:44px;min-height:44px;font-size:22px}
@media(max-width:1100px){.ryx-question-grid,.ryx-activity-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.ryx-games-screen{margin-left:0;padding:23px 17px 95px;min-height:calc(100dvh - 110px)}.ryx-game-grid{grid-template-columns:1fr 1fr;gap:10px}.ryx-game-tile{padding:14px 12px;min-height:145px}.ryx-game-tile strong{font-size:13px}.ryx-game-tile small{font-size:10px}.ryx-question-grid,.ryx-activity-grid{grid-template-columns:1fr;max-height:none}.ryx-bonus-questions,.ryx-bonus-activities,.ryx-daily{padding:16px;margin:18px 0 30px}.ryx-filters{flex-direction:column}.ryx-filters .ryx-select{width:100%}.ryx-choice-buttons{grid-template-columns:1fr}.ryx-blitz-card{padding:22px 17px}.ryx-modal{width:100vw;height:100dvh;max-height:100dvh;border-radius:0}.ryx-modal-inner{padding:16px;padding-bottom:max(18px,env(safe-area-inset-bottom))}.bottom-nav{gap:0}.bottom-nav button{min-width:0;flex:1;padding-left:0!important;padding-right:0!important}.bottom-nav button span{font-size:9px}.bottom-nav .ryx-games-tab span{font-size:9px}}
/* Desktop app shell already has its own left margin. */
.main-wrap .ryx-games-screen{margin-left:0}
.ryx-saved-answer{white-space:pre-wrap;font-size:14px;background:#fffefa;border:1px solid #e5e0d7;border-radius:9px;padding:15px;line-height:1.6}

/* v3.1: bottom tabs stay available when the user scrolls any mobile page.
   Overflow is horizontal: a seventh tab never becomes untappable on small phones. */
@media (max-width:760px) {
  body.ryx-mobile-tabs { padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))!important; }
  body.ryx-mobile-tabs .main-content { padding-bottom:calc(104px + env(safe-area-inset-bottom,0px))!important; }
  body.ryx-mobile-tabs .ryx-games-screen { padding-bottom:calc(104px + env(safe-area-inset-bottom,0px))!important; }
  body.ryx-mobile-tabs .bottom-nav {
    position:fixed!important;
    inset:auto 0 0 0!important;
    width:100%!important;
    max-width:100vw!important;
    z-index:1200!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
    gap:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    background:#faf8f3!important;
    border-top:1px solid #e7e1d8!important;
    box-shadow:0 -4px 20px #3c3d350d;
    padding:6px 6px calc(5px + env(safe-area-inset-bottom,0px))!important;
    box-sizing:border-box;
  }
  body.ryx-mobile-tabs .bottom-nav::-webkit-scrollbar{display:none}
  body.ryx-mobile-tabs .bottom-nav>button{
    flex:0 0 clamp(61px,15vw,82px)!important;
    min-width:61px!important;
    max-width:none!important;
    scroll-snap-align:center;
    min-height:52px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;
    padding:4px 2px!important;
  }
  body.ryx-mobile-tabs .bottom-nav>button span { font-size:10px!important; line-height:1.15; }
}