html{scrollbar-gutter:stable}
.offline-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:640px){.offline-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1024px){.offline-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.offline-count{min-height:24px}
.offline-game{min-width:0;transform:none!important;animation:none!important;transition:border-color .15s}
.offline-cover-placeholder{width:100%;height:100%;background:linear-gradient(125deg,#18181c,#242429)}
.offline-skeleton-line{height:24px;width:70%;background:#242429;border-radius:4px}
.offline-skeleton{animation:none!important}
.offline-game-dialog{position:fixed;inset:auto;left:50vw;top:50dvh;transform:translate(-50%,-50%);margin:0;height:fit-content;padding:0;width:min(520px,calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:calc(100dvh - 48px);border:1px solid #303036;border-radius:16px;background:#121216;color:#fff;overflow:auto;overscroll-behavior:contain}
.offline-game-dialog::backdrop{background:rgba(0,0,0,.75)}
.offline-dialog-content{position:relative;overflow:hidden}
.offline-dialog-close{position:absolute;right:12px;top:12px;z-index:2;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid #44444a;border-radius:10px;background:#17171be6;color:#eee}
.offline-catalog input[type=search]::-webkit-search-cancel-button{display:none}
.offline-error{min-height:24px}
.offline-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.offline-subscription-summary{display:flex;flex-direction:column;gap:4px;max-width:240px;padding:12px 16px;border:1px solid #303036;border-radius:12px;text-align:left;background:#17171b;font-size:12px;color:#92929e}
.offline-subscription-summary strong{color:#eee;font-size:14px}
.offline-plan-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:8px}
.offline-plan-heading h3{font-size:15px;font-weight:600}
.offline-plan-heading strong{font-size:17px;white-space:nowrap}
.offline-muted{color:#92929e;font-size:13px;line-height:1.5}
.offline-subscription-panel{border-top:1px solid #303036;padding-top:16px}
.offline-payment-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:16px 0}
.offline-currencies{display:flex;gap:4px;padding:3px;border:1px solid #303036;border-radius:9px}
.offline-currencies button{padding:6px 10px;border-radius:6px;font-size:13px;color:#92929e}
.offline-currencies button[aria-pressed=true]{background:#35353c;color:#fff}
.offline-primary{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;padding:10px 14px;margin-top:14px;border-radius:10px;background:#e9e9ed;color:#141418;font-size:14px;font-weight:600}
.offline-primary:disabled{opacity:.45;cursor:not-allowed}
.offline-primary:focus-visible,.offline-copy:focus-visible,.offline-currencies button:focus-visible{outline:2px solid #ddd;outline-offset:3px}
.offline-payment-confirm{display:flex;flex-direction:column;gap:4px;padding:12px 14px;background:#1c1c21;border:1px solid #35353c;border-radius:10px}
.offline-payment-confirm strong{font-size:22px}
.offline-action-error{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:13px;color:#e4b879;margin:12px 0}
.offline-text-button{text-decoration:underline;color:#eee}
.offline-credential{margin-top:12px}
.offline-credential-row{display:flex;align-items:center;gap:8px;border:1px solid #35353c;background:#1c1c21;border-radius:9px;padding:9px 10px;margin-top:5px}
.offline-credential-row input{width:100%;min-width:0;background:transparent;color:#fff;font-family:monospace;font-size:15px;outline:none}
.offline-copy{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:28px;height:28px;color:#c3c3cd}
.offline-guard-result{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding:12px 14px;background:#1c1c21;border:1px solid #35353c;border-radius:9px}
.offline-guard-result strong{font-family:monospace;font-size:24px;letter-spacing:4px}
.offline-account-loading{min-height:130px;display:flex;align-items:center;justify-content:center;color:#92929e;font-size:13px}
.offline-quota{margin:12px 0}
@media(max-width:479px){.offline-heading{gap:12px}.offline-subscription-summary{padding:10px;max-width:168px;font-size:11px}.offline-subscription-summary strong{font-size:12px}.offline-plan-heading strong{font-size:15px}.offline-plan-heading h3{font-size:14px}}

.offline-eyebrow{display:block;color:#8c83f5;font-size:11px;letter-spacing:.14em;font-weight:650;margin-bottom:8px}
.offline-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}
.offline-search{width:min(360px,100%)}
.offline-view-tabs{display:flex;gap:4px;padding:4px;background:#141418;border:1px solid #27272e;border-radius:12px}
.offline-view-tabs button{min-height:40px;padding:8px 14px;border-radius:8px;font-size:13px;color:#aaaab6;transition:background .15s,color .15s}
.offline-view-tabs button[aria-pressed=true]{background:#292332;color:#efe9ff}
.offline-view-tabs span{margin-left:8px;padding:2px 6px;border-radius:5px;background:#3c3150;font-size:11px}
.offline-test-note{color:#b5a5da;font-size:11px;margin-top:6px}
.offline-renewal-setting{border:1px solid #34303e;background:#1b1723;padding:12px;border-radius:12px;margin:14px 0}
.offline-renewal-setting label{display:flex;align-items:center;gap:10px;font-size:13px;min-height:32px;cursor:pointer}
.offline-renewal-setting input{accent-color:#8b5cf6;width:17px;height:17px}
.offline-renewal-setting p{font-size:11px;margin-top:5px}
.offline-new-access{margin-top:18px;border-top:1px solid #2b2b33;padding-top:16px}
.offline-new-access .offline-muted{margin-bottom:10px}
.offline-account-selector{display:flex;flex-direction:column;gap:8px;color:#aaaab6;font-size:12px;margin-bottom:18px}
.offline-account-selector select{min-height:42px;background:#1c1c22;border:1px solid #3b3b46;border-radius:9px;padding:8px 10px;color:#eee;max-width:100%}
.offline-instructions{border-top:1px solid #2b2b33;margin-top:20px;padding-top:16px;font-size:12px;color:#aaaab6;line-height:1.6}
.offline-instructions summary{cursor:pointer;color:#d6d1e4;min-height:30px}
.offline-instructions ol{list-style:decimal;padding-left:20px;margin-top:10px}
.offline-instructions li+li{margin-top:8px}
.offline-library-card{border:1px solid #303036;border-radius:14px;overflow:hidden;text-align:left;background:#141418;transition:border-color .15s}
.offline-library-card:hover{border-color:#746498}
.offline-empty{padding:56px 20px;text-align:center;border:1px dashed #303036;border-radius:16px;margin-top:20px}
.offline-empty strong{display:block;margin-bottom:8px;color:#e7e3ed}
.offline-primary{min-height:44px;transition:background .15s,opacity .15s}
.offline-primary:disabled{cursor:default;opacity:.45}
.offline-copy:focus-visible,.offline-view-tabs button:focus-visible,.offline-primary:focus-visible,.offline-game:focus-visible,.offline-library-card:focus-visible{outline:2px solid #a78bfa;outline-offset:3px}
.offline-game-dialog[open]{animation:offline-open .16s cubic-bezier(.2,.7,.3,1)}
@keyframes offline-open{from{opacity:0;transform:translate(-50%,-49%)}to{opacity:1;transform:translate(-50%,-50%)}}
@media(max-width:639px){.offline-heading{flex-direction:column;gap:16px}.offline-subscription-summary{max-width:none;width:100%}.offline-toolbar{flex-direction:column;align-items:stretch}.offline-search{width:100%}.offline-view-tabs{width:fit-content}.offline-game-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.offline-grid{gap:12px}.offline-count{max-width:270px}}
@media(prefers-reduced-motion:reduce){.offline-game-dialog[open]{animation:none}.offline-primary,.offline-view-tabs button,.offline-library-card{transition:none}}
