/* coffeehub24 V37.0 · Real application visual integration.
   The separate design-preview.html contains explicit demo fixtures.
   This stylesheet does not create users, transactions, AI outcomes, or live metrics. */
:root{--bg:#070b20;--panel:#141a3c;--card:#1b2350;--line:#554b91;--txt:#f7f5ff;--muted:#b8c5e7;--purple:#9c58ff;--cyan:#36dbff;--pink:#ed4da0;--good:#23d69f;color-scheme:dark}
body{background:radial-gradient(ellipse at 3% 8%,#51219262,transparent 34%),radial-gradient(ellipse at 94% 4%,#064b946d,transparent 35%),radial-gradient(ellipse at 50% 89%,#231e6155,transparent 45%),#060b1e;background-attachment:fixed;letter-spacing:.005em}
.gradient-text{background:linear-gradient(105deg,#fff,#edc6ff 40%,#66deff 80%);background-clip:text;color:transparent}
.card{background:linear-gradient(140deg,rgba(33,34,84,.97),rgba(15,22,49,.98));border:1px solid #635697;box-shadow:0 8px 23px #02041888,inset 0 0 20px #6335a318;border-radius:16px}
.btn{border-color:#695baa;background:#20284f;border-radius:11px;box-shadow:inset 0 0 9px #55339822}
.btn.primary{background:linear-gradient(120deg,#b553ff,#6b38df);border-color:#bd85ff;box-shadow:0 4px 15px #8448e476,inset 0 0 9px #c285fa5a}
.btn:hover{transform:translateY(-1px)}.btn:focus-visible{outline:2px solid #59d6ff}
.input{background:#151d40;border-color:#564e8b;color:#f2f5ff}.input:focus{box-shadow:0 0 0 3px #9550fd2c}
.shell{max-width:1510px;grid-template-columns:224px minmax(0,1fr) 260px;gap:14px;padding:16px 14px 105px}
.side-nav{height:calc(100dvh - 32px);background:linear-gradient(160deg,#15163c,#0c152f);border:1px solid #4c427d;border-radius:22px;padding:0 8px 12px;box-shadow:0 0 22px #5c2c8b3a}
.side-nav .brand{padding:17px 8px 13px;border-bottom:1px solid #48397980}.side-nav .brand img{width:54px;height:54px;box-shadow:0 0 18px #b553ff77}.side-nav .brand strong{font-size:20px;letter-spacing:-.9px}.side-nav .brand small{font-size:9px;letter-spacing:1.1px;margin-top:2px}
.nav-scroll{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#7155b8 transparent;padding:6px 0;min-height:0;flex:1}.nav-group-label{font-size:10px;letter-spacing:1.8px;color:#9387d2;padding:8px 11px 9px;font-weight:900}
.navlink{min-height:42px;padding:10px 12px;border-radius:10px;color:#cad3ed;font-size:13px;gap:10px;margin:2px 0;line-height:1.2;width:100%}.navlink .ico{font-size:18px;flex:0 0 25px}.navlink.active,.navlink:hover{background:linear-gradient(95deg,#943ceecc,#39287ee3);border-color:#9e64fc;box-shadow:inset 3px 0 #dca8ff,0 0 13px #963ff34e}.navlink.safety{margin-top:0;border-color:#68456c;background:#4d1b5666}
.nav-extras{border-top:1px solid #57468e;margin:10px 0 0;padding-top:7px}.nav-extras summary{cursor:pointer;border-radius:9px;padding:10px 12px;font-size:12px;font-weight:800;color:#c5bdec;background:#1e2055}.nav-extras summary:hover{background:#2b2462}.nav-extras .navlink{font-size:12px}.nav-footer{font-size:10px;color:#aeb8db;line-height:1.7;padding:13px 9px;border-top:1px solid #423874}.nav-footer span{color:#8ecfff}
.main-header.v37-header{background:linear-gradient(100deg,#1b1e46,#1a214c 55%,#171b39);border:1px solid #50477f;padding:11px 13px;border-radius:16px;margin-bottom:14px;box-shadow:0 6px 24px #0c071e55;min-height:64px}.v37-header .v37-title{min-width:0}.v37-header h1{font-weight:900;font-size:22px;white-space:nowrap}.v37-header .sub{margin-top:3px;color:#a9b7dc}.v37-header-search{flex:1;min-width:60px;max-width:340px}.v37-header-search .btn{width:100%;background:#262a55;border-radius:99px;color:#aebce0;font-size:12px;font-weight:550;min-height:35px;padding:6px 12px}.v37-header-actions{gap:6px;flex-shrink:0}.v37-header-actions .btn{font-size:12px}.v37-sos{border-color:#ff7dab!important;color:#ffbddc!important;background:#3b1a3d!important}
.coffeehub24-hero{min-height:213px;position:relative;border-color:#9b75f8;background:radial-gradient(circle at 77% 45%,#5e3bb9bf,transparent 39%),linear-gradient(120deg,#36215c,#162758 62%,#08284a);box-shadow:0 0 21px #8c4cc359,inset 0 0 30px #8f4eaa3a;padding:25px}.coffeehub24-hero h2{font-size:clamp(25px,2.7vw,33px);line-height:1.2;max-width:590px}.coffeehub24-hero .eyebrow{color:#87ecff}.coffeehub24-hero-art{right:0;width:210px;top:0;height:100%;opacity:.85;display:flex;align-items:center;justify-content:center}.coffeehub24-hero-art img{height:178px;width:178px;filter:drop-shadow(0 0 26px #5c69ff)}.coffeehub24-hero-art .orb-wave{color:#f7aaff;right:21px}.coffeehub24-hero p{color:#d8defb}
.coffeehub24-quick-grid.v37-feature-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:13px 0 21px}.v37-feature-grid .coffeehub24-quick{border-radius:14px;min-height:96px;background:linear-gradient(140deg,#222451,#0e2146);border-color:#665aa0;box-shadow:inset 0 0 15px #7744d82d,0 4px 13px #05071577;transition:transform .16s,box-shadow .16s}.v37-feature-grid .coffeehub24-quick:hover{transform:translateY(-2px);box-shadow:0 0 16px #9d51ef7a}.v37-feature-grid .coffeehub24-quick span{font-size:29px}.v37-feature-grid .coffeehub24-quick b{font-size:12px;color:#f2eaff}
.feed-heading h2,.heading{font-weight:900}.post{border-color:#594e8b}.post .author b{color:#fff}.post .content{color:#e3e4f8}.post .media-thumb,.media-grid img{border:1px solid #5b6099}.post-actions{border-top-color:#484476}.post-actions button:hover{background:#3c2b6b}.coffeehub24-optin-note{border-color:#665796;background:linear-gradient(120deg,#1e2954,#28214f)}
.right-rail{gap:12px}.v37-ai-panel{padding:17px 13px;display:flex;flex-direction:column;align-items:center;background:radial-gradient(circle at 50% 18%,#5725a76b,transparent 52%),linear-gradient(160deg,#23204f,#141635)}.v37-bot-icon{font-size:54px;filter:drop-shadow(0 0 11px #5f8bff);margin:-1px 0 5px}.v37-ai-panel h3{margin:0;font-size:19px;font-weight:950}.v37-ai-panel p{margin:6px 0 13px;color:#c6cbec;font-size:11px;text-align:center;line-height:1.5}.v37-ai-links{display:grid;gap:7px;width:100%}.v37-ai-links button{padding:9px;text-align:left;border-radius:9px;color:#d7d5f3;font-size:11px;background:#292650;border:1px solid #6555a3;cursor:pointer}.v37-ai-links button:hover{background:#473478;border-color:#ae7eff}.v37-ai-start{margin-top:12px;width:100%}.v37-warning-panel{padding:14px;background:linear-gradient(140deg,#3b245a,#1d1c45);border-color:#8266aa}.v37-warning-panel b{color:#ffe4a6}.v37-warning-panel p{color:#d6d4ee;font-size:12px;line-height:1.55}.v37-profile-mini{padding:15px}
.v37-intro-panel{display:grid;grid-template-columns:120px minmax(0,1fr);gap:21px;padding:25px;background:radial-gradient(circle at 16% 50%,#6635a65b,transparent 38%),linear-gradient(125deg,#22215a,#111d3d);align-items:center}.v37-section-emblem{width:114px;height:114px;border:1px solid #aa81e5;border-radius:25px;display:grid;place-items:center;font-size:65px;background:linear-gradient(145deg,#40328d,#173b77);box-shadow:0 0 20px #7d49ef6b}.v37-intro-panel h2{font-size:23px;line-height:1.3}.v37-intro-panel p{line-height:1.6;color:#c3cdeb}.v37-simple-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.v37-simple-columns h3{margin:0 0 8px}.v37-simple-columns p{font-size:13px;color:#c5cde7;line-height:1.65}
/* Visual language of login/registration */
.auth-wrap{max-width:1230px;grid-template-columns:minmax(0,1fr) minmax(325px,460px);gap:26px}.auth-hero{border-radius:27px;min-height:570px;background:radial-gradient(circle at 35% 30%,#6736c070,transparent 48%),radial-gradient(circle at 90% 80%,#067bb44a,transparent 40%),#17143e;border:1px solid #9c75ed;box-shadow:0 0 20px #6932d850,inset 0 0 35px #7958bb32;position:relative;overflow:hidden}.auth-hero:after{content:'✦';font-size:260px;position:absolute;right:-45px;top:55px;color:#797cff08;pointer-events:none}.auth-hero .logo-big{width:136px;filter:drop-shadow(0 0 25px #8b5cf6)}.auth-hero h1{font-size:clamp(45px,4.9vw,67px);letter-spacing:-1.5px}.auth-hero h2{font-size:21px;line-height:1.4}.auth-hero p{max-width:540px;line-height:1.7}.auth-hero .tag-title{color:#90e4ff;letter-spacing:2px}.auth-form{border-color:#6352a1;box-shadow:0 0 25px #6c48af30}.auth-form .auth-tabs{padding:4px;border-radius:14px;background:#131739}.auth-form .auth-tabs button{border-radius:10px}.v37-auth-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.v37-auth-links .btn{font-size:12px}
@media(max-width:1220px){.shell{grid-template-columns:205px minmax(0,1fr) 218px;gap:10px}.side-nav .brand strong{font-size:17px}.v37-header-search .btn{max-width:160px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.v37-feature-grid .coffeehub24-quick b{font-size:11px}}
@media(max-width:1000px){.shell{grid-template-columns:185px minmax(0,1fr)}.right-rail{display:none}.side-nav .brand strong{font-size:17px}}
@media(max-width:720px){body{background-attachment:scroll}.shell{display:block;padding:10px 10px 94px}.side-nav{display:none}.main-header.v37-header{border-radius:13px;position:sticky;top:0;z-index:15;background:linear-gradient(110deg,#111b3af1,#171c3af1);backdrop-filter:blur(14px);margin:-10px -10px 12px;padding:10px 10px;min-height:60px}.v37-header h1{font-size:19px}.v37-header .sub{font-size:10px}.v37-header-search{display:none}.v37-header-actions{gap:2px}.v37-header-actions .btn{padding:7px;font-size:10px}.coffeehub24-hero{min-height:185px;padding:19px 15px}.coffeehub24-hero h2{font-size:24px;max-width:350px}.coffeehub24-hero p{font-size:12px;max-width:300px}.coffeehub24-hero-art img{width:133px;height:133px}.coffeehub24-hero-art{right:-30px;opacity:.35}.coffeehub24-quick-grid.v37-feature-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:10px 0 15px}.v37-feature-grid .coffeehub24-quick{min-height:78px;padding:7px 3px}.v37-feature-grid .coffeehub24-quick span{font-size:24px}.v37-feature-grid .coffeehub24-quick b{font-size:10px}.mobile-nav{background:linear-gradient(115deg,#31205af7,#1c1f54f7);border-top:1px solid #8764df;box-shadow:0 -4px 26px #6b36db66}.mobile-nav button.active{color:#efbbff}.mobile-nav button .ico{font-size:23px}.auth-wrap{grid-template-columns:1fr;gap:6px;padding:12px 12px 35px}.auth-hero{min-height:0;padding:21px 19px}.auth-hero .logo-big{width:79px}.auth-hero h1{font-size:36px}.auth-hero h2{font-size:17px}.auth-hero .preview-badges{margin-top:12px}.v37-auth-links{margin-top:13px}.v37-auth-links .btn{font-size:10px}.v37-intro-panel{grid-template-columns:1fr;padding:19px;gap:13px}.v37-section-emblem{width:74px;height:74px;font-size:41px;border-radius:18px}.v37-intro-panel h2{font-size:21px}.v37-simple-columns{grid-template-columns:1fr}}
@media(max-width:380px){.v37-header .sub{display:none}.coffeehub24-quick-grid.v37-feature-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.v37-feature-grid .coffeehub24-quick b{font-size:9px}.coffeehub24-hero h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){.btn,.v37-feature-grid .coffeehub24-quick{transition:none!important;transform:none!important}}

/* Visible development status on Web and Android, including narrow screens. */
.v37-stage-note{border:1px solid #6e59aa;background:#251c46;color:#e5d5ff;border-radius:12px;padding:10px 13px;margin:0 0 14px;font-size:12px;line-height:1.5;overflow-wrap:anywhere}