:root{color-scheme:dark;--bg:#060915;--panel:#0a1023;--edge:#22294d;--txt:#f4f3ff;--muted:#96a2c8;--purple:#a342ff;--blue:#4575ff;--green:#30e7af;--rad:17px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#050714;color:var(--txt);font-family:Inter,system-ui,sans-serif;min-height:100vh;font-size:13px}button,input,select{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #bd8aff;outline-offset:3px}[hidden]{display:none!important}
.backglow{position:fixed;z-index:-1;inset:0;background:radial-gradient(ellipse at 35% 3%,#27106a88,transparent 46%),radial-gradient(ellipse at 97% 65%,#101960a6,transparent 38%),#050714}
.shell{max-width:1900px;margin:auto;min-height:100vh;display:grid;grid-template-columns:227px minmax(0,1fr);border-left:1px solid #121633;border-right:1px solid #121633;box-shadow:0 0 140px #08062c}
.sidebar{background:linear-gradient(165deg,#080b1e,#040711 80%);border-right:1px solid #202244;min-height:100vh;display:flex;flex-direction:column;padding:30px 17px 21px;gap:24px;position:sticky;top:0;height:100vh}
.logo{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:900;letter-spacing:-.5px}.logo-icon{display:grid;place-items:center;border-radius:12px;width:48px;height:48px;flex-shrink:0;background:linear-gradient(130deg,#4462ff,#a532ff);box-shadow:0 0 32px #683afa88;font-size:20px;letter-spacing:-2px;font-weight:900;color:#fff}.logo small{display:block;font-size:9px;color:#a2a8ec;letter-spacing:2px;margin-top:4px}
.nav-caption{font-size:10px;letter-spacing:2px;color:#626d9c;font-weight:800;margin:11px 10px -12px}.sidebar-menu{display:grid;gap:8px}.navitem{display:flex;align-items:center;gap:13px;color:#b2bedc;padding:13px 14px;background:transparent;border:1px solid transparent;border-radius:12px;text-align:left;font-size:12px;font-weight:600;min-height:44px;width:100%}.navitem>span{font-size:22px;color:#9ea9dc;line-height:1;width:23px;text-align:center}.navitem:hover,.navitem.active{background:#4e18a94d;color:#fff;border-color:#8545fc;box-shadow:inset 0 0 23px #571aff30,0 0 14px #6425e94b}.navitem.active>span{color:#fff}.new-pill{margin-left:auto;color:#ca9aff;border:1px solid #772ee3;border-radius:5px;padding:3px 5px;font-size:9px}
.sidebar-bottom{margin-top:auto;display:grid;gap:13px}.intelligence{background:linear-gradient(140deg,#160c3c,#0b1838);border:1px solid #493a9b;border-radius:13px;padding:14px;box-shadow:inset 0 0 35px #6630fd18}.kicker{font-size:10px;color:#a59aff;letter-spacing:1.1px;font-weight:800}.intelligence p{color:#96a2cd;line-height:1.65;font-size:11px}.wave{height:27px;background:linear-gradient(90deg,transparent,#9c48ff,transparent);mask-image:repeating-linear-gradient(120deg,transparent 0 8px,#000 8px 11px,transparent 11px 17px);opacity:.75}.sidebar-bottom>small{font-size:9px;color:#7681ac;display:flex;justify-content:space-between;align-items:center}.online-dot{display:inline-block;background:#20f0ad;border-radius:50%;width:7px;height:7px;box-shadow:0 0 8px #20f0ad}.owner-link{font-size:11px;color:#97a5cd;text-align:center;padding:8px}
.content{min-width:0;padding:23px 25px 12px}.topbar{display:flex;align-items:center;gap:18px;margin-bottom:21px}.welcome{min-width:215px}.welcome small{font-size:10px;color:#9bacd0}.welcome h1{font-size:21px;letter-spacing:-.6px;margin:7px 0 0;font-weight:800}.greeting-star{color:#b153ff}.global-search{margin-left:auto;max-width:560px;flex:1;min-width:120px;height:47px;display:flex;align-items:center;gap:11px;border-radius:12px;border:1px solid #2b335e;background:#090f21;padding:0 15px;transition:.2s}.global-search:focus-within{border-color:#a05bff;box-shadow:0 0 25px #673aff26}.global-search>span{font-size:26px;color:#b9c3ed}.global-search input{background:none;border:0;outline:0;width:100%;color:#fff;font-size:12px}.global-search input::placeholder{color:#707da6}.global-search kbd{border:1px solid #35416a;border-radius:5px;font-size:10px;padding:3px 6px;color:#8d96b5}.icon-button,.user-button{height:45px;border:1px solid #22294c;background:#0a1022;border-radius:50%;color:#c4befd;font-size:24px}.icon-button{width:45px;flex:none}.user-button{border-radius:26px;padding:4px 11px 4px 5px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;white-space:nowrap}.avatar-mark{width:35px;height:35px;background:linear-gradient(135deg,#5f2cef,#d234ee);display:grid;place-items:center;border-radius:50%;font-size:12px;overflow:hidden;box-shadow:0 0 0 2px #642fff}.avatar-mark img,.profile-avatar img{width:100%;height:100%;object-fit:cover}
.panel{border:1px solid var(--edge);background:linear-gradient(147deg,#0b1328,#070d1e);border-radius:var(--rad);box-shadow:0 15px 45px #0005}.upper-grid{display:grid;grid-template-columns:minmax(0,1.95fr) minmax(250px,.92fr);gap:13px}.hero{min-height:372px;position:relative;overflow:hidden;isolation:isolate;display:flex;justify-content:space-between;align-items:stretch;padding:24px 19px 24px 24px;border-color:#333082}.hero:after{position:absolute;content:"";inset:0;z-index:-1;background:linear-gradient(90deg,#080a1bee 0%,#070a1ab3 46%,#070a1888 70%,#05081cdf 100%)}.hero-bg{position:absolute;inset:0;z-index:-2;background-image:radial-gradient(ellipse at 60% 35%,#8336ff66,transparent 45%),linear-gradient(145deg,#112365,#090919);background-size:cover;background-position:center;transition:background-image .3s, transform 1s;animation:heroZoom 16s ease-in-out infinite alternate}@keyframes heroZoom{to{transform:scale(1.09)}}.hero-main{display:flex;flex-direction:column;align-items:flex-start;min-width:0;flex:1;z-index:1;justify-content:center}.hero-label{color:#e8d6ff;background:#4b16c7b5;box-shadow:0 0 18px #6426de8a;padding:8px 12px;font-size:10px;font-weight:800;border-radius:7px}.platform{color:#c9c8ea;letter-spacing:2px;margin-top:17px;font-weight:800;font-size:10px}.hero h2{text-shadow:0 4px 25px #000;margin:14px 0 8px;font-size:clamp(29px,3.1vw,48px);font-weight:900;line-height:1.04;letter-spacing:-1.8px;max-width:580px}.hero-main p{color:#ccd1ee;max-width:465px;line-height:1.5;font-size:12px;text-shadow:0 2px 6px #000}.specs{display:flex;gap:7px;flex-wrap:wrap;margin:15px 0 19px}.specs span{color:#c5d6ef;font-size:10px;padding:9px 8px;background:#070e26cc;border:1px solid #394277;border-radius:7px;font-weight:800}.hero-actions{display:flex;flex-wrap:wrap;gap:10px}.primary-btn,.ghost-btn{border-radius:11px;padding:12px 17px;font-weight:850;font-size:12px;color:#fff;min-height:39px}.primary-btn{background:linear-gradient(120deg,#6348f5,#a014ef);border:1px solid #b368ff;box-shadow:0 0 19px #732afa6b}.primary-btn:hover{filter:brightness(1.2);transform:translateY(-1px)}.ghost-btn{background:#101833c7;border:1px solid #475383}.ghost-btn:hover{background:#232d5b}.compat{align-self:center;width:154px;flex:none;background:#071025cf;border:1px solid #353f72;padding:14px;backdrop-filter:blur(14px)}.compat>small{font-size:10px;color:#c7d0ff;font-weight:800}.compat-ring{width:112px;height:112px;border:9px solid #4833b5;border-top-color:#9845ff;border-right-color:#4c8fff;display:grid;place-items:center;border-radius:50%;margin:15px auto;font-size:19px;font-weight:900;box-shadow:0 0 24px #5e38fb45}.compat-list{display:grid;gap:10px;font-size:10px;color:#c4d1ea}.compat-list>div:before{content:'✓';color:#10efa9;margin-right:8px}.hero-controls{display:flex;justify-content:space-between;align-items:center;margin-top:20px}.hero-controls button{background:#18254a;color:#d9dbff;border:1px solid #455289;border-radius:50%;width:26px;height:26px;font-size:20px}.hero-controls span{font-size:9px;color:#9c71ff;letter-spacing:2px}
.collection{padding:15px 13px;min-width:0}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-heading h2{font-size:13px;font-weight:800;margin:0}.section-heading p{color:var(--muted);font-size:11px;margin:7px 0 0}.text-link{font-size:10px;font-weight:800;color:#c26dff;background:none;border:0;padding:4px;white-space:nowrap}.text-link:hover{text-decoration:underline}.micro{font-size:10px;color:#8794be;line-height:1.5}.collection-list{margin-top:12px;display:grid;gap:8px}.collection-item{display:flex;gap:10px;align-items:center;border:1px solid #273254;background:#0b1428;border-radius:11px;padding:7px;width:100%;text-align:left;color:#e8ecff;min-width:0}.collection-item:hover{border-color:#8b5cff}.collection-item img{width:70px;height:66px;object-fit:cover;border-radius:8px}.collection-item .cinfo{min-width:0}.collection-item strong{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.collection-item small{display:block;font-size:9px;color:#889abd;margin-top:6px}.collection-item .meter{height:3px;background:linear-gradient(90deg,#9c39ff,#3ea4fa);margin-top:9px;border-radius:3px}.collection-empty{padding:16px 10px;color:#9eafd6;line-height:1.6}
.quick-widgets{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;margin:12px 0}.widget{display:flex;flex-direction:column;align-items:flex-start;min-height:118px;border-radius:12px;padding:13px 12px;border:1px solid #304369;background:linear-gradient(140deg,#0c1731,#090d1e);color:#edf1ff;text-align:left;position:relative;overflow:hidden;transition:.2s}.widget:before{content:"";position:absolute;width:120px;height:120px;right:-55px;top:-42px;background:currentColor;filter:blur(60px);opacity:.14}.widget:hover{transform:translateY(-4px);border-color:currentColor;box-shadow:0 15px 20px #0007}.widget span{font-size:24px;line-height:1}.widget strong{font-size:10px;margin:7px 0;letter-spacing:.3px}.widget small{font-size:10px;color:#b3c1e1;line-height:1.4;flex:1}.widget em{font-style:normal;font-size:10px;margin-top:12px;font-weight:800}.widget.teal{color:#27edcf}.widget.purple{color:#bb66ff}.widget.blue{color:#4fb8ff}.widget.indigo{color:#9db1ff}.widget.amber{color:#ffbb57}.widget.pink{color:#f474e3}
.lower-grid{display:grid;grid-template-columns:minmax(0,2.05fr) minmax(250px,.82fr);gap:12px}.library{min-width:0;padding:18px}.library .section-heading h2{font-size:15px}.library .section-heading h2 span{color:#aa5cff}.count-label{font-size:10px;color:#c98cff;border:1px solid #4a348c;padding:7px 9px;border-radius:9px;white-space:nowrap}.library-filters{margin:19px 0 15px}.filter-pills{display:flex;flex-wrap:wrap;gap:7px}.pill{border-radius:8px;border:1px solid #303959;background:#101830;color:#c4cced;padding:9px 11px;font-size:10px;font-weight:750}.pill:hover,.pill.selected{background:linear-gradient(120deg,#6843eb,#4930af);color:#fff;border-color:#9279ff;box-shadow:0 0 15px #7c4bee3f}.select-filters{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:11px}.select-filters label{font-size:10px;color:#8b97c0;display:flex;align-items:center;gap:6px}.select-filters select{appearance:none;background:#10172d;color:#d7d8f2;border:1px solid #2b365d;border-radius:7px;padding:7px 17px 7px 8px;font-size:10px;max-width:136px}.game-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.game-card{position:relative;min-width:0;background:#0e162e;border:1px solid #2b365e;border-radius:11px;overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s}.game-card:hover{transform:translateY(-5px);border-color:#9b58fa;box-shadow:0 11px 25px #0009,0 0 19px #6b31e448}.cover-button{display:block;width:100%;background:linear-gradient(135deg,#172456,#32105e);border:0;padding:0;color:#fff;position:relative;text-align:left}.game-cover{display:block;width:100%;height:155px;object-fit:cover;transition:transform .35s}.cover-button:hover .game-cover{transform:scale(1.055)}.ps5-strip{position:absolute;top:0;left:0;right:0;height:19px;background:#f4f5ff;color:#14234b;font-size:10px;font-weight:900;padding:4px 8px;letter-spacing:1px}.status-badge{position:absolute;bottom:6px;left:7px;color:#b1ffe3;background:#00634cdb;border:1px solid #22d5a5;padding:4px 6px;font-size:8px;font-weight:800;border-radius:5px}.status-badge.soon{color:#ffe8ae;background:#604013e8;border-color:#d3a95b}.game-data{padding:10px 9px 9px}.game-data h3{font-size:10.5px;min-height:29px;margin:0 0 7px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.game-data p{font-size:9px;color:#8ba2ca;margin:5px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tags{display:flex;gap:4px;margin:8px 0}.tag{padding:3px 5px;border:1px solid #2f406c;color:#94acf7;font-size:8px;border-radius:4px}.tag.available{color:#71eac4;border-color:#156c5d;background:#083c35}.card-actions{display:flex;gap:5px}.card-actions button{flex:1;border:1px solid #5841c7;background:#4424b9;color:#fff;border-radius:6px;padding:7px 2px;font-size:8px;font-weight:800}.card-actions .heart{flex:0 0 25px;color:#d3a8ff;background:#1a1642;font-size:14px}.card-actions .heart.saved{background:#a14aff;color:#fff}.load-more-wrap{text-align:center;margin-top:17px}
.right-lower{display:grid;gap:12px;align-content:start;min-width:0}.stats,.activity{padding:16px}.stats-grid{margin-top:16px;display:grid;grid-template-columns:1fr 1fr;gap:9px}.stats-grid>div{padding:13px 9px;border-radius:10px;background:linear-gradient(125deg,#181143,#0b1733);border:1px solid #343570}.stats-grid span{float:left;font-size:19px;color:#a457ff;margin-right:9px}.stats-grid strong{display:block;font-size:22px;line-height:1.1}.stats-grid small{font-size:9px;color:#95a7ca}.activity-list{display:grid;gap:6px}.activity-entry{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #1c2848}.activity-entry>span{color:#b47aff;font-size:17px}.activity-entry strong{font-size:10px;display:block;overflow-wrap:anywhere}.activity-entry small{font-size:9px;color:#8597b9;display:block;margin-top:5px}.empty-hint{color:#94a0c0;font-size:11px;line-height:1.5;padding:12px 0}.footer{color:#7d8aad;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;font-size:10px;padding:19px 0}.footer a:hover{color:#d3b1ff}
.dialog{color:#eef1ff;border:1px solid #6b4ce3;border-radius:19px;background:linear-gradient(150deg,#121636,#070b19);box-shadow:0 20px 90px #000c,0 0 45px #4a1cab66;padding:24px;max-width:min(860px,94vw);width:100%;max-height:90vh;overflow:auto}.dialog::backdrop{background:#020411d9;backdrop-filter:blur(9px)}.dialog-close{position:absolute;right:13px;top:10px;background:#22244a;color:#f3eaff;border:1px solid #57538b;border-radius:50%;width:30px;height:30px;font-size:21px}.game-dialog-grid{display:grid;grid-template-columns:minmax(140px,260px) 1fr;gap:22px;align-items:start}.game-dialog-grid>img{width:100%;max-height:380px;object-fit:contain;border-radius:13px}.dialog h2{font-size:24px;margin:14px 20px 13px 0}.dialog .game-meta{color:#a6b9e0;line-height:1.8}.dialog .notes{font-size:12px;white-space:pre-wrap;line-height:1.5;color:#b3bfdd}.dialog-actions{display:flex;gap:9px;flex-wrap:wrap;margin:16px 0}.dialog-actions button{font-size:11px}.counter-label{font-size:10px;color:#a8b3d1;align-self:center}.language-chips{display:flex;gap:6px;flex-wrap:wrap}.language-chips span{font-size:9px;border:1px solid #32456c;padding:4px 6px;border-radius:5px;color:#bac3de}.account-dialog{max-width:460px}.auth-header{text-align:center}.auth-header .logo-icon{margin:6px auto 13px}.auth-header h2{font-size:17px}.auth-header p{color:#adb8d9;line-height:1.6}.account-dialog form{display:grid;gap:15px;margin-top:20px}.account-dialog form label{display:grid;gap:7px;font-size:11px;color:#bcc7e9}.account-dialog input:not([type="file"]){background:#090f23;border:1px solid #35436f;color:#fff;border-radius:10px;min-height:43px;padding:10px}.account-dialog input[type="file"]{font-size:11px;max-width:100%}.account-dialog .primary-btn{width:100%}.form-message{font-size:12px;min-height:1.4em;color:#bfadfc}.auth-disabled{padding:12px;background:#372224;color:#ffdaba;border-radius:9px}.profile-hero{display:flex;align-items:center;gap:13px;border:1px solid #393661;padding:12px;border-radius:12px}.profile-avatar{width:60px;height:60px;border-radius:50%;background:#7334d9;display:grid;place-items:center;overflow:hidden}.profile-hero small{display:block;color:#9daace;margin-top:7px}.profile-actions{margin-top:20px;text-align:center}#toast{position:fixed;z-index:20;bottom:20px;right:24px;padding:13px 18px;border-radius:12px;border:1px solid #8963ec;background:#170d34;color:#f4edff;box-shadow:0 8px 30px #000a;max-width:min(350px,90vw);opacity:0;transform:translateY(16px);pointer-events:none;transition:.3s}#toast.visible{opacity:1;transform:none}
@media(max-width:1300px){.upper-grid{grid-template-columns:minmax(0,1.6fr) minmax(250px,.9fr)}.quick-widgets{grid-template-columns:repeat(3,1fr)}.game-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.welcome{min-width:145px}}
@media(max-width:1000px){.shell{grid-template-columns:75px minmax(0,1fr)}.sidebar{padding:16px 8px}.logo>span:last-child,.nav-caption,.navitem:not(.active) .new-pill,.sidebar-bottom,.navitem{font-size:0}.logo{justify-content:center}.logo-icon{width:44px;height:44px}.navitem{justify-content:center;padding:11px 4px;gap:0}.navitem>span{font-size:25px}.upper-grid,.lower-grid{grid-template-columns:1fr}.collection-list{grid-template-columns:repeat(4,minmax(0,1fr))}.collection-item{flex-direction:column;align-items:stretch}.collection-item img{width:100%;height:90px}.content{padding:16px}.game-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.right-lower{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.shell{display:block}.sidebar{position:static;width:100%;height:auto;min-height:0;flex-direction:row;align-items:center;padding:11px 14px;gap:10px;overflow-x:auto}.logo{margin-right:5px}.sidebar-menu{display:flex;gap:3px}.navitem{min-width:37px;width:39px;padding:7px}.sidebar>.nav-caption,.sidebar-bottom{display:none}.content{padding:12px}.topbar{flex-wrap:wrap;gap:9px}.welcome{flex:1}.welcome h1{font-size:18px}.global-search{order:3;flex:1 0 100%;max-width:none}.hero{min-height:360px;padding:15px}.hero-main{max-width:100%}.hero h2{font-size:34px}.compat{display:none}.collection-list{grid-template-columns:repeat(2,1fr)}.quick-widgets{grid-template-columns:repeat(2,minmax(0,1fr))}.widget{min-height:105px}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.game-cover{height:160px}.right-lower{grid-template-columns:1fr}.game-dialog-grid{grid-template-columns:1fr}.game-dialog-grid>img{max-height:210px;object-fit:contain}.dialog{padding:19px}.user-button{height:39px}.user-button .avatar-mark{height:30px;width:30px}.specs span{padding:7px 5px;font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}