/* DOS Cloud public website: browsable without an account. */
.public-site, .public-page {min-height:100vh;background:#080c13;color:#edf3fb;}
.public-header {height:78px;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:0 clamp(20px,5vw,82px);border-bottom:1px solid #283143;background:#0b1019;position:relative;z-index:2;}
.public-header .brand {text-decoration:none;color:#f5f7fb;white-space:nowrap;font-size:25px;}
.public-nav {display:flex;flex-wrap:wrap;gap:clamp(14px,2.3vw,32px);align-items:center;}
.public-nav a,.public-footer a {color:#aab9ca;text-decoration:none;font-size:14px;font-weight:650;}
.public-nav a:hover,.public-nav a[aria-current],.public-footer a:hover {color:white;}
.public-signin {border:1px solid #94b8ef;border-radius:8px;padding:11px 17px;color:#e6f0ff;text-decoration:none;font-size:14px;font-weight:750;white-space:nowrap;}
.public-signin:hover {background:#1a3457;}
.public-content {padding-bottom:60px;}
.public-hero {min-height:430px;display:flex;justify-content:space-between;align-items:center;gap:35px;padding:64px clamp(20px,6vw,100px);background:radial-gradient(ellipse at 80% 30%,#213956 0%,#101b2b 30%,#080c13 76%);border-bottom:1px solid #1b2838;}
.public-hero-copy {max-width:690px;}
.public-hero h1 {font-size:clamp(42px,6vw,80px);letter-spacing:-.055em;line-height:1.04;margin:14px 0 20px;}
.public-hero h1 em {font-style:normal;color:#8fbaff;}
.public-hero p {font-size:clamp(15px,1.5vw,18px);line-height:1.7;color:#b0c0d2;max-width:620px;}
.public-hero-actions {display:flex;gap:12px;flex-wrap:wrap;margin-top:27px;}
.public-cta {text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:8px;background:#e6f0ff;color:#081423;font-weight:800;padding:14px 21px;min-height:48px;}
.public-cta:hover {background:white;}
.public-cta.secondary {background:transparent;color:#d5e5fb;border:1px solid #3c5573;}
.public-cta.secondary:hover {background:#172639;}
.public-hero .public-guest-note {font-size:13px;color:#8394a9;margin-top:16px;}
.public-hero-art {flex:0 1 350px;min-height:245px;padding:42px 28px;background:linear-gradient(140deg,#101f31,#0a121d);border:1px solid #416187;box-shadow:0 20px 90px #0008,inset 0 1px #ffffff14;border-radius:14px;color:#9ee3ab;font:20px/2 ui-monospace,SFMono-Regular,Consolas,monospace;transform:rotate(-3deg);}
.public-hero-art>span {font-size:54px;font-weight:800;white-space:nowrap;letter-spacing:-.08em;}
.public-hero-cursor {animation:public-blink 1.3s steps(2,start) infinite;}
@keyframes public-blink {50% {opacity:0;}}
.public-section {padding:45px clamp(20px,5vw,82px) 8px;}
.public-section-heading {display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:21px;}
.public-section-heading h2 {margin:7px 0 0;font-size:clamp(25px,3vw,34px);letter-spacing:-.025em;}
.public-section-heading a {text-decoration:none;color:#96bdff;font-weight:700;font-size:14px;padding-bottom:4px;}
.public-count {color:#96abc4;font-size:14px;}
.public-game-grid {display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,245px),1fr));gap:17px;width:100%;align-items:stretch;}
.public-game-card {min-width:0;display:flex;flex-direction:column;background:linear-gradient(180deg,#151f2b,#0f1722);border:1px solid #2a384a;border-radius:11px;overflow:hidden;transition:transform .14s,border-color .14s;}
.public-game-card:hover {transform:translateY(-2px);border-color:#5a81b6;}
.public-game-poster {height:155px;position:relative;overflow:hidden;background:radial-gradient(circle at 70% 20%,var(--accent,#41648b),#0d1721 80%);display:flex;justify-content:center;align-items:center;}
.public-game-poster img {width:100%;height:100%;object-fit:cover;}
.public-game-glyph {font-size:65px;letter-spacing:-.08em;color:#d7ebff9e;text-shadow:0 10px 30px #000a;}
.public-game-year {position:absolute;bottom:9px;right:10px;background:#070b11bc;border:1px solid #ffffff2e;border-radius:5px;padding:3px 7px;color:#dbe7f5;font:12px ui-monospace,monospace;}
.public-game-info {padding:18px;display:flex;flex-direction:column;flex:1;gap:9px;}
.public-game-info h3 {margin:0;font-size:19px;line-height:1.25;}
.public-game-subtitle {margin:0;min-height:18px;font-size:12px;color:#97acc4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.public-game-tags {min-height:25px;}
.public-game-tags span {display:inline-block;font-size:11px;font-weight:750;padding:5px 9px;border-radius:5px;border:1px solid #46638b;color:#9ec5ff;background:#152b46;}
.public-game-description {font-size:13px;line-height:1.55;color:#a9b8c9;margin:0;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.public-game-action {margin-top:8px;text-decoration:none;font-size:13px;font-weight:800;color:#e4efff;background:#263b53;border:1px solid #46658c;border-radius:7px;text-align:center;padding:12px 10px;}
.public-game-action:hover {background:#345478;}
.public-filters {display:flex;gap:12px;flex-wrap:wrap;margin-bottom:24px;}
.public-filters input,.public-filters select {background:#152131;border:1px solid #3b516c;color:#e5effb;padding:12px 15px;border-radius:8px;font:inherit;min-height:48px;}
.public-filters input {flex:1 1 330px;min-width:0;}
.public-filters select {flex:1 1 185px;}
.public-filters :focus-visible {outline:2px solid #a3c4f9;outline-offset:2px;}
.public-message {font-size:14px;color:#b5c6d8;grid-column:1/-1;padding:10px 0;}
.public-footer {border-top:1px solid #29384b;padding:30px clamp(20px,5vw,82px);display:flex;justify-content:space-between;gap:25px;flex-wrap:wrap;font-size:13px;color:#8599af;}
.public-footer nav {display:flex;gap:22px;flex-wrap:wrap;}
.brand-blue {color:#71a7ff;}
.public-page-intro {max-width:900px;padding:64px clamp(20px,5vw,82px) 15px;}
.public-page-intro h1,.public-article h1 {font-size:clamp(36px,5vw,58px);letter-spacing:-.045em;margin:10px 0 14px;}
.public-page-intro p {font-size:17px;line-height:1.7;color:#afbed2;}
.public-article {max-width:880px;margin:35px auto 90px;padding:0 25px;line-height:1.78;color:#bdc9d9;}
.public-article h2 {color:#eef5fc;font-size:23px;margin-top:37px;}
.public-article h3 {color:#dbeafa;font-size:18px;}
.public-article p,.public-article li {font-size:15px;}
.public-article a {color:#a6c6ff;}
.public-article .updated {font-size:13px;color:#8ca2bc;}
.public-feature-list {display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:17px;margin:30px 0;}
.public-feature-list article {background:#121d2b;border:1px solid #2c4059;border-radius:10px;padding:22px;}
.public-feature-list h2 {margin:0 0 8px;font-size:20px;}
.public-feature-list p {margin:0;}
.app-nav-link {color:#aebcd0;text-decoration:none;align-self:center;font-size:14px;padding:9px 5px;}
.app-nav-link:hover {color:white;}
/* Every authenticated category is a wrapping tile grid, never a side-scrolling rail. */
#app-view .catalog-row {padding-right:4vw;}
#app-view .card-rail {display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,245px),1fr));grid-auto-flow:row;grid-auto-columns:auto;overflow:visible;scroll-snap-type:none;padding-right:0;gap:15px;}
#app-view .game-card {scroll-snap-align:none;}
@media (max-width:850px) {
 .public-nav {gap:10px;}
 .public-hero-art {display:none;}
 .public-hero {min-height:350px;}
 .topbar .app-nav-link {display:none;}
}
@media (max-width:650px) {
 .public-header {height:auto;min-height:70px;padding:15px 20px;flex-wrap:wrap;gap:14px;}
 .public-header .brand {font-size:23px;}
 .public-signin {padding:9px 13px;}
 .public-nav {order:3;width:100%;gap:20px;overflow-x:auto;flex-wrap:nowrap;padding:5px 0 3px;}
 .public-nav a {white-space:nowrap;font-size:13px;}
 .public-hero {padding:45px 20px;}
 .public-section {padding:30px 20px 7px;}
 .public-game-grid {grid-template-columns:repeat(auto-fill,minmax(min(100%,175px),1fr));gap:12px;}
 .public-game-poster {height:120px;}
 .public-game-info {padding:13px;gap:7px;}
 .public-game-info h3 {font-size:16px;}
 .public-game-description {font-size:12px;}
 #app-view .catalog-row {padding-right:20px;}
 #app-view .card-rail {grid-template-columns:repeat(auto-fill,minmax(min(100%,245px),1fr));}
}
@media (prefers-reduced-motion:reduce) {
 .public-hero-cursor {animation:none;}
 .public-game-card {transition:none;}
}
/* Keep privacy and public pages reachable from the signed-in mobile app. */
.app-page-menu {display:none;position:relative;}
.app-page-menu summary {list-style:none;cursor:pointer;border:1px solid #415877;border-radius:7px;padding:8px 11px;color:#d5e8ff;font-size:13px;}
.app-page-menu summary::-webkit-details-marker {display:none;}
.app-page-menu summary:focus-visible {outline:2px solid #a9d2ff;outline-offset:3px;}
.app-page-menu nav {position:absolute;right:0;top:calc(100% + 8px);width:min(235px,calc(100vw - 24px));max-height:calc(100dvh - 85px);overflow-y:auto;display:flex;flex-direction:column;gap:2px;padding:8px;background:#172335;border:1px solid #405773;border-radius:9px;box-shadow:0 15px 35px #0008;z-index:50;}
.app-page-menu nav a,.app-page-menu nav button {display:block;width:100%;padding:10px;color:#deecff;text-decoration:none;text-align:left;font-size:13px;line-height:1.3;border:0;border-radius:5px;background:transparent;}
.app-page-menu nav a:hover,.app-page-menu nav button:hover,.app-page-menu nav a:focus-visible,.app-page-menu nav button:focus-visible {background:#2a3d55;}
.app-page-menu .menu-divider {border-top:1px solid #405773;margin:5px 3px;}
@media(max-width:850px) {
  .topbar > nav {display:none;}
  .app-page-menu {display:block;}
  .topbar .account {gap:8px;}
  .topbar #user-name {max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .topbar #profile-edit-button,.topbar #logout-button {display:none;}
}
/* Play style is a primary discovery path; privacy stays in quiet bottom footers. */
.public-site,.public-page {display:flex;flex-direction:column;}
.public-site>main,.public-page>main {flex:1;}
.public-play-guide {padding-bottom:18px;}
.public-play-paths {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:12px;}
.public-play-paths a {display:flex;flex-direction:column;gap:8px;min-height:110px;padding:19px 18px;
 border:1px solid #354a65;border-radius:12px;background:linear-gradient(160deg,#18283a,#101b2a);
 color:#dceafc;text-decoration:none;transition:background .16s,border-color .16s;}
.public-play-paths a strong {font-size:17px;color:#edf5ff;}
.public-play-paths a span {color:#a8bdd5;font-size:13px;line-height:1.5;}
.public-play-paths a:hover,.public-play-paths a[aria-current="page"] {border-color:#86b8f7;background:#233c58;}
.public-play-paths a:focus-visible {outline:2px solid #97c5ff;outline-offset:3px;}
.public-guide-steps {display:grid;gap:12px;margin:18px 0;}
.public-guide-steps article {background:#121d2b;border:1px solid #31445e;border-radius:10px;padding:18px;}
.public-guide-steps h3 {margin:0 0 6px;color:#eaf3ff;}
.public-guide-steps p {margin:0;}
#app-view {display:flex;flex-direction:column;min-height:100vh;}
#app-view>main {flex:1;}
.site-legal-footer {border-top:1px solid #243348;padding:22px clamp(20px,4vw,64px);display:flex;
 flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;color:#8195ad;font-size:12px;}
.site-legal-footer a,.login-legal-footer a {font-size:12px;color:#99b2d0;text-decoration:none;}
.site-legal-footer a:hover,.login-legal-footer a:hover {color:#fff;text-decoration:underline;}
.login-shell {position:relative;padding-bottom:70px;}
.login-legal-footer {position:absolute;left:0;right:0;bottom:18px;text-align:center;}
@media(max-width:650px){.public-play-paths{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));}
.public-play-paths a{padding:14px;min-height:106px;}
.public-play-paths a strong{font-size:15px;}}

/* Signed-in catalog uses the public browsing layout, with full play/install actions. */
#app-view .auth-catalog-main {background:#080c13;padding-bottom:64px;}
#app-view .auth-catalog-main .public-page-intro {max-width:1000px;}
#app-view .auth-game-grid .game-card {
  min-height:0;scroll-snap-align:none;box-shadow:none;
  background:linear-gradient(180deg,#151f2b,#0f1722);
  border-color:#2a384a;border-radius:11px;
}
#app-view .auth-game-grid .game-card:hover {border-color:#5a81b6;transform:translateY(-2px);}
#app-view .auth-game-grid .poster {height:155px;flex:0 0 155px;}
#app-view .auth-game-grid .card-body {padding:18px;}
#app-view .auth-game-grid .description {min-height:48px;max-height:48px;-webkit-line-clamp:3;line-clamp:3;}
#app-view .auth-game-grid .card-actions {margin-top:auto;}
#app-view .auth-game-grid .catalog-load-more {grid-column:1/-1;}
@media(max-width:650px) {
  #app-view .auth-game-grid .poster {height:120px;flex-basis:120px;}
  #app-view .auth-game-grid .card-body {padding:13px;}
}

#catalog {scroll-margin-top:80px;}
