/* CLOSER PUBLIC DESKTOP — OG CLOSER VISUAL SYSTEM
   Mirrors the OG brand/interaction language; never imports OG data or auth. */
:root{
  --closer-og-navy:#0b3050;--closer-og-deep:#071d34;--closer-og-teal:#075575;
  --closer-og-rose:#d66b9c;--closer-og-rose-light:#ec93b4;
  --closer-og-aqua:#8ad9d2;--closer-og-ice:#f0f9ff;--closer-og-muted:#bfd5e3;
  --closer-og-stroke:rgba(148,199,217,.27);
}
html{background:#071d34!important;color-scheme:dark}
html body{background:radial-gradient(ellipse 82% 43% at 100% -7%,rgba(63,136,167,.23),transparent 70%),radial-gradient(ellipse 60% 48% at -20% 72%,rgba(39,101,143,.16),transparent 80%),linear-gradient(163deg,#0b3050,#103451 47%,#0b2b4c)!important;background-attachment:fixed!important;color:var(--closer-og-ice)!important}
#app{color:var(--closer-og-ice)!important;background:linear-gradient(150deg,#0d3554,#0b2b4c)!important}
#app .closer-sticky-top{background:linear-gradient(180deg,#0b2f4dfb 0%,#0b2f4de9 76%,#0b2f4d00 100%)!important;border-bottom-color:rgba(151,197,217,.15)!important}
#app .closer-sticky-inner{max-width:none!important}
#app .closer-sticky-top .logo{color:#f0f9ff!important;font-size:29px!important;font-weight:900!important;letter-spacing:-1.3px!important}
#app .closer-sticky-top .logo b{color:#d66b9c!important;text-shadow:0 2px 10px #d66b9c26!important}
#app .mini-menu{background:#28587870!important;border:1px solid rgba(169,208,226,.33)!important;color:#f0f9ff!important;box-shadow:none!important}
#app .mini-menu:hover{background:#386e8b!important}
#app .eyebrow{color:#8ad9d2!important;letter-spacing:1.8px!important;font-weight:820!important;font-size:11px!important}
#app .heading,#app .section-title{color:#f0f9ff!important}
#app .subheading,#app .tiny,#app .muted,#app .small{color:#bfd5e3!important}
#app .subheading strong{color:#a5e6df!important}
#app .hero{
 background:radial-gradient(circle at 92% 12%,rgba(214,107,156,.18),transparent 47%),linear-gradient(133deg,#174f70,#244d70 56%,#344866)!important;
 border:1px solid rgba(208,164,199,.34)!important;border-radius:27px!important;
 box-shadow:0 20px 46px #061b3055,inset 0 1px 0 #ffffff1b!important
}
#app .hero h2{color:#f0f9ff!important;line-height:1.12!important}
#app .hero>p{color:#d1e6ef!important}
#app .hero-deco{color:#e8a1bf!important;opacity:.4!important}
#app .card,#app .followup-card,#app .quick-grid>button,
#app .og-page .studio-activity,#app .studio-item,#app .studio-card,
#app .studio-game-card,#app .studio-feature-card{
 background:linear-gradient(137deg,rgba(29,85,116,.94),rgba(31,67,101,.96))!important;
 border:1px solid var(--closer-og-stroke)!important;border-radius:22px!important;
 box-shadow:0 13px 36px #04162925,inset 0 1px 0 #ffffff0b!important;
}
#app .card h2,#app .card h3,#app .card .question{color:#f0f9ff!important}
#app .card p,#app .followup-card p{color:#bfd5e3!important}
#app .card .tag,#app .tag.mint{background:#1b6c77a8!important;color:#b6f4eb!important;border:1px solid #8ad9d251!important}
#app button.btn.primary,#app .btn.primary{
 background:linear-gradient(126deg,#8ad9d2,#a5e4d7)!important;border:1px solid #c0f0e8!important;
 color:#092c42!important;font-weight:850!important;box-shadow:0 8px 24px #012d3766!important
}
#app button.btn.secondary,#app .btn.secondary{background:#265b79a6!important;border:1px solid #7eb2c14f!important;color:#e6f7ff!important}
#app button.btn.tertiary,#app .btn.tertiary{background:transparent!important;border:1px solid #8ad9d242!important;color:#b8e8e7!important}
#app .btn:focus-visible,#app button:focus-visible,#closer-cloud button:focus-visible{outline:3px solid #e7a4c4!important;outline-offset:3px!important}
#app .btn:hover{filter:brightness(1.06)}
#app .tag.pink{color:#ffd5e4!important;border-color:#e798bb60!important;background:#7f456c77!important}
#app .chip{background:rgba(35,89,119,.85)!important;border:1px solid rgba(159,207,223,.31)!important;color:#e4f5fc!important}
#app .chip.selected{background:linear-gradient(115deg,rgba(67,119,143,.96),rgba(121,79,117,.9))!important;border-color:rgba(226,145,187,.76)!important}
#app .studio-tabs button.active,#app .studio-chip.active{background:#346881!important;border-color:#9de0d9!important;color:#f4fffe!important}
#app .closer-floating-dock{background:linear-gradient(152deg,#163e5bec,#12324eec)!important;border-color:#92c1d14d!important;box-shadow:0 15px 38px #05162885!important}
#app .closer-floating-dock button{color:#c4dbe9!important}
#app .closer-floating-dock button.active{background:linear-gradient(115deg,#285c79,#604967)!important;color:#fff!important}
#app .closer-floating-dock button.active .ico{color:#ec93b4!important}
#app .closer-floating-dock button:hover{background:#3c729359!important}
#closer-cloud .cloud-shell{background:linear-gradient(145deg,#143954,#112f4c)!important;border-color:#729ebc55!important}
#closer-cloud .cloud-head{background:#123653!important}
#closer-cloud .cloud-logo{color:#f0f9ff!important}
#closer-cloud .cloud-logo:first-letter{color:#d66b9c!important}
#closer-cloud .cloud-nav button.active{background:#295e7f!important;color:#fff!important;border-color:#db8bae88!important}
#closer-cloud .cloud-panel,#closer-cloud .cloud-card{background:#19435f!important;border-color:#87afc655!important}
#closer-cloud .cloud-panel button:not(.closer-google-btn){border-radius:14px}
#closer-cloud button[data-cloud="login"],#closer-cloud button[data-cloud="signup"]{background:#8ad9d2!important;color:#092b3b!important}
#closer-desktop-rail .desktop-rail-card{background:linear-gradient(135deg,#17415f,#215074)!important;border-color:#8bb5c050!important;box-shadow:0 16px 42px #051a3040!important}
#closer-desktop-rail .desktop-rail-kicker{color:#a6e5de!important}
#closer-desktop-rail .desktop-rail-card h3{color:#f0f9ff!important}
#closer-desktop-rail .desktop-rail-card p{color:#c5dce8!important}
#closer-desktop-rail button{background:#92dcd5!important;color:#0b3050!important}
#closer-desktop-rail button.secondary{background:#2b607d!important;border:1px solid #8db8c85e!important;color:#eaf8ff!important}
#closer-desktop-rail .desktop-rail-note{color:#b9d5e4!important}
#closer-desktop-rail .desktop-rail-note:before{color:#ec93b4!important}
.closer-og-note{
 position:relative;isolation:isolate;background:#f3d8cc!important;
 border-radius:4px 6px 13px 5px!important;box-shadow:4px 7px 0 #b17f9c28,0 18px 33px #041a3455!important;
 color:#363342!important;padding:25px 24px 24px!important;transform:rotate(-1.2deg);
 border:0!important;overflow:visible
}
.closer-og-note:before{content:"";position:absolute;top:-9px;left:37%;width:75px;height:19px;background:#e6ede3a8;transform:rotate(3deg);box-shadow:0 2px 4px #0002;z-index:2}
.closer-og-note .og-note-kicker{font-size:10px!important;font-weight:900;letter-spacing:2px;text-transform:uppercase;color:#8e4c70!important;margin:0 0 13px!important}
.closer-og-note .og-note-handwriting{font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive!important;font-size:clamp(19px,1.7vw,25px)!important;line-height:1.45!important;color:#4f3451!important;margin:0 0 13px!important;min-height:50px}
.closer-og-note .og-note-disclaimer{font-size:11px;color:#775d6f!important;line-height:1.45;margin:0 0 15px}
.closer-og-note .og-note-actions{display:flex;gap:9px;flex-wrap:wrap}
.closer-og-note button{background:#ffffffa8!important;color:#633c55!important;border:1px solid #b78b9f74!important;padding:9px 11px!important;border-radius:11px!important;font-size:12px!important;font-weight:750!important;box-shadow:none!important}
.closer-og-note button:hover{background:#fff!important}
.closer-og-page-tagline{font-size:13px;color:#d6e8ed;letter-spacing:.2px;padding-top:4px;margin:0 0 17px}
.closer-og-page-tagline:before{content:"♥";color:#d66b9c;margin-right:9px}
.closer-og-home-note{margin:29px 0 34px!important;max-width:580px}
#closer-desktop-rail .closer-og-note{margin:6px 5px 0 3px!important;padding:21px 18px!important}
#closer-desktop-rail .closer-og-note .og-note-handwriting{font-size:19px!important}
#closer-desktop-rail .closer-og-note .og-note-actions{gap:7px}
#closer-desktop-rail .closer-og-note button{font-size:11px!important;padding:8px!important}
@media(min-width:960px){
 html body{background:#071d34!important}
 #app{max-width:none!important;width:100%!important;background:radial-gradient(ellipse at 88% -10%,rgba(46,125,156,.24),transparent 39%),radial-gradient(ellipse at 6% 75%,rgba(25,79,123,.28),transparent 44%),linear-gradient(154deg,#0c3453,#0a2949)!important}
 #app .closer-sticky-top{max-width:none!important;width:100vw!important;left:0!important;right:0!important;top:0!important;height:80px!important;min-height:80px!important;padding:0!important;box-sizing:border-box!important;background:linear-gradient(90deg,#0b2c49fc,#104366f5)!important}
 #app .closer-sticky-top .closer-sticky-inner{width:100%!important;max-width:none!important;height:80px!important;padding:0 44px 0 34px!important}
 #app>.shell{margin-left:264px!important;margin-right:22px!important;max-width:none!important;padding:117px 37px 90px!important;background:none!important;box-sizing:border-box!important}
 #app .closer-floating-dock{position:fixed!important;left:19px!important;top:99px!important;bottom:auto!important;max-width:none!important;width:221px!important;height:auto!important;display:flex!important;flex-direction:column!important;gap:9px!important;padding:12px!important;border-radius:24px!important;transform:none!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;z-index:55!important}
 #app .closer-floating-dock button{min-height:55px!important;padding:11px 13px!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;text-align:left!important;border-radius:15px!important}
 #app .closer-floating-dock button .ico{font-size:23px!important;width:27px!important;text-align:center!important}
 #app .closer-floating-dock button .label{font-size:14px!important;font-weight:800!important}
 #app .closer-floating-dock button.active{border:1px solid #e9acc25e!important}
 #app>.shell>.og-page>.fadein{width:100%;max-width:1180px!important;margin:0 auto}
 #app .og-page .heading{font-size:clamp(38px,3.4vw,54px)!important;font-weight:850!important;letter-spacing:-1.9px!important}
 #app .og-page .subheading{max-width:790px}
 #app .hero{min-height:270px!important;padding:38px!important}
 #app .hero h2{max-width:650px!important;font-size:clamp(29px,3vw,42px)!important}
 #app .section-title{font-size:21px!important;font-weight:790!important}
 #app .quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:15px!important}
 #app .card{border-radius:22px!important}
 #app .closer-og-home-note{max-width:580px}
}
@media(min-width:1430px){
 #app>.shell{margin-left:264px!important;margin-right:333px!important;padding-left:38px!important;padding-right:34px!important}
}
@media(min-width:960px) and (max-width:1429px){#closer-desktop-rail{display:none!important}}
@media(min-width:1430px){#closer-desktop-rail{width:283px!important;right:25px!important;top:101px!important;display:flex!important}}
@media(max-width:959px){
 #app .closer-sticky-top{max-width:100%!important}
 #app .closer-sticky-top .closer-sticky-inner{max-width:590px!important;margin:auto!important}
 #app .hero{padding:24px!important}
 #app .hero h2{font-size:clamp(27px,7vw,34px)!important}
 #app .card{border-radius:22px!important}
 .closer-og-home-note{margin:22px 0 31px!important}
}
@media(prefers-reduced-motion:reduce){.closer-og-note{transform:none!important}}

/* OG welcome-back pattern in first-use flow. */
#app .intro.improved-intro{max-width:840px!important}
#app .intro.improved-intro h1{color:#f0f9ff!important;font-weight:850!important;letter-spacing:-2px!important}
#app .intro.improved-intro h1 em{color:#ec93b4!important}
#app .intro.improved-intro>p{color:#bfd5e3!important}
#app .focus-choice{background:linear-gradient(140deg,#17415fe8,#215074e8)!important;border:1px solid #8bb7c349!important;color:#f0f9ff!important;box-shadow:0 11px 30px #061a3040!important}
#app .focus-choice[aria-pressed="true"]{background:linear-gradient(135deg,#285f7c,#6a526f)!important;border-color:#e49dbb!important}
#app .focus-choice small{color:#b5d7e4!important}
#app .focus-icon{color:#ee9dc1!important}
#app .closer-og-auth-entry{background:radial-gradient(circle at 95% 8%,#d66b9c20,transparent 40%),linear-gradient(135deg,#17415f,#215074)!important;border:1px solid #a5c9d54c!important;border-radius:23px!important;padding:24px 23px!important;margin:27px 0 26px!important;box-shadow:0 14px 34px #071d346b!important;width:100%;text-align:left!important}
#app .closer-og-auth-entry .og-auth-pill{display:inline-flex;background:#235674;border:1px solid #d890b174;border-radius:999px;padding:7px 10px;font-size:10px;font-weight:850;letter-spacing:1.1px;color:#f0c2d6}
#app .closer-og-auth-entry h2{color:#fff!important;font-size:27px!important;letter-spacing:-.9px!important;margin:15px 0 7px!important}
#app .closer-og-auth-entry p{font-size:13px!important;line-height:1.55!important;color:#cadce8!important;max-width:560px;margin:0 0 17px!important}
#app .closer-og-auth-entry button{background:linear-gradient(120deg,#8ad9d2,#b2e7de)!important;color:#0d2f46!important;font-weight:820!important;border:1px solid #c2f0e8!important;border-radius:13px!important;min-height:46px!important;padding:11px 19px!important;font-size:14px!important}
#app .closer-og-auth-entry button:hover{filter:brightness(1.07)}
@media(min-width:960px){#app .intro.improved-intro{margin:0 auto!important;padding-top:118px!important}}
