/* DANQVORA STUDIO V6 — restrained, editorial visual system.
   Pure presentation: no application, auth, chat or data logic changes. */
:root {
  --bg:#101214;
  --surface:#16191b;
  --surface2:#1c2022;
  --surface3:#23282a;
  --line:#2c3234;
  --line2:#3d4345;
  --text:#eceeea;
  --muted:#b0b5b2;
  --subtle:#858e8a;
  --white:#eff0ec;
  --shadow:0 18px 44px rgba(0,0,0,.20);
}
html { scroll-behavior:smooth; }
body { background:#101214; color:#e9ece8; font-family:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif; font-size:13.5px; letter-spacing:0; }
* { -webkit-tap-highlight-color:transparent; }
::selection { background:#d9ddd6; color:#131719; }
:focus-visible { outline-color:#b9c3bd!important; outline-offset:3px!important; }
button, a, input, textarea { transition:background-color .19s ease,color .19s ease,border-color .19s ease,box-shadow .19s ease,transform .19s ease; }
button:active:not(:disabled) { transform:translateY(1px); }

/* Topbar: sparse, navigable, no ornamental pills */
.topbar { height:67px; padding:0 30px; gap:14px; background:#151819f7; border-bottom:1px solid #34393a; box-shadow:none; grid-template-columns:236px minmax(0,1fr) auto; }
.brand { gap:12px; }
.brand-mark { width:34px; height:34px; border-radius:6px; background:#e5e7e0; color:#181b1a; border:1px solid #cdd1ca; font-family:Georgia,serif; font-weight:700; font-size:21px; letter-spacing:-1.5px; box-shadow:none; }
.brand-name { font:700 17px/1.1 'DM Sans',system-ui,sans-serif; letter-spacing:1.4px; }
.brand-tag { font:600 9px/1.5 'DM Sans',system-ui,sans-serif; letter-spacing:1.4px; text-transform:uppercase; color:#9da5a0; margin-top:3px; }
.topbar > .tabs { justify-content:center; gap:5px; }
.topbar > .tabs .tab { border-radius:0; border:0; border-bottom:2px solid transparent; padding:21px 15px 19px; background:none; box-shadow:none; color:#a0a9a3; font-size:12px; font-weight:650; letter-spacing:.1px; height:67px; position:relative; }
.topbar > .tabs .tab:hover { background:#ffffff05; color:#f4f4f1; }
.topbar > .tabs .tab.active { background:none; border-bottom-color:#d9dcd4; color:#f6f6f2; box-shadow:none; }
.topbar > .tabs .tab .icon { width:15px; height:15px; stroke-width:1.6; }
.top-actions { gap:4px; }
.top-actions .icon-btn { width:34px; height:34px; border-radius:6px; }
.top-actions .outlined-btn { padding:8px 10px; border-radius:7px; font-size:11px; background:none; border-color:#343b3c; margin-left:5px; }
.top-actions .user-chip { background:#222727; border:1px solid #3a4141; border-radius:7px; padding:4px 11px 4px 4px; font-size:11px; margin-left:7px; gap:8px; }
.top-actions .admin-header-link { border-radius:7px; padding:7px 10px; font-size:11px; }

/* Ticker: narrow market desk, not a banner */
#dq-market-strip { background:#0c0f10; border-bottom:1px solid #272d2e; height:38px; flex-basis:38px; z-index:11; }
#dq-market-strip .dq-market-label { padding:0 21px; background:#121617; border-right:1px solid #283032; font-size:9px; letter-spacing:1.3px; color:#dee1dc; font-weight:750; }
#dq-market-strip .dq-market-dot { width:5px; height:5px; background:#b4c1b7; box-shadow:0 0 0 3px #b4c1b71b; }
#dq-market-strip .dq-market-inner,
#dq-market-strip tv-ticker-tape { height:37px; }
#dq-market-strip .dq-market-source { border-left:1px solid #283032; padding:0 14px; color:#909b97; font-size:10px; }
#dq-market-strip .dq-market-source a { font-weight:600; color:#ced7d1; }

/* Community: readable and seriously useful */
.app-grid { grid-template-columns:230px minmax(0,1fr) 245px; }
.sidebar { background:#141718; padding:24px 12px 15px; border-color:#303738; }
.sidebar-intro { border-bottom:1px solid #2b3132; margin:0 8px 25px; padding:0 5px 20px; text-transform:none; letter-spacing:1.1px; color:#c6cbc5; font-size:9px; }
.sidebar-intro p { font-size:11.5px; line-height:1.55; margin:8px 0 0; color:#9ca59f; }
.quiet-dot { background:#c1cbc3; height:6px; width:6px; box-shadow:none; margin-right:7px; }
.section-label { color:#8f9893; font-size:9px; font-weight:750; letter-spacing:1.6px; padding:0 13px; margin-bottom:11px; }
.app .room-btn { min-height:41px; border-radius:7px; font-size:12.3px; line-height:1.25; padding:10px 11px; gap:11px; color:#a9b1ac; font-weight:550; }
.app .room-btn .icon { width:16px; height:16px; stroke-width:1.6; }
.app .room-btn:hover { background:#23292a; color:#f5f5f1; transform:translateX(2px); }
.app .room-btn.active { background:#292f30; border:1px solid #414949; color:#f4f5f1; box-shadow:inset 2px 0 #cfd5ce; font-weight:650; }
.mini-dot { width:5px; height:5px; background:#d5ded4; }
.muted-action { border-radius:7px; font-size:11px; background:#1c2122; border:1px dashed #454c4d; color:#c4cac5; min-height:39px; }
.muted-action:hover { background:#262b2d; border-color:#8a9690; }
.sidebar-rule { background:#2d3435; margin:22px 11px; }
.rules-card { background:#191e1f; border:1px solid #303737; border-radius:9px; padding:14px; }
.rules-card .eyebrow { color:#c9cec9; font-size:9px; letter-spacing:1.1px; }
.rules-card p { color:#9ca59e; font-size:11px; }
.sidebar-foot { font-size:10px; }

.main { background:#171a1b; }
.chat-head { min-height:74px; padding:15px clamp(20px,2.2vw,35px); border-bottom:1px solid #313839; background:#181c1d; }
.header-symbol { width:38px; height:38px; border-radius:8px; background:#23292b; border-color:#384143; }
.header-symbol .icon { width:19px; height:19px; }
.app .head-title h1 { font:650 18px/1.25 'DM Sans',system-ui,sans-serif; letter-spacing:-.45px; }
.app .head-title p { font-size:11px; color:#9da7a1; margin-top:5px; }
.preview-pill { font:700 9px 'DM Sans',sans-serif; letter-spacing:.9px; border:1px solid #414849; border-radius:5px; background:#222728; padding:6px 9px; color:#aab6af; }
.app .messages { padding:22px clamp(16px,3%,42px) 28px; }
.welcome-inline { background:#1d2223; border:1px solid #333c3d; border-left:2px solid #adb9b0; border-radius:8px; margin-bottom:24px; padding:17px 19px; }
.welcome-inline::after { content:none; }
.welcome-inline strong { font:650 14px 'DM Sans',sans-serif; letter-spacing:0; }
.welcome-inline p { font-size:11.5px; max-width:600px; color:#aeb7b0; line-height:1.65; }
.welcome-icon { background:transparent; border:1px solid #394243; border-radius:6px; padding:8px; }
.date-separator { font:650 9px 'DM Sans',sans-serif; text-transform:uppercase; letter-spacing:1.8px; color:#8d9892; }
.date-separator::before,.date-separator::after { background:#313637; }
.app .message { padding:11px 7px 11px 8px; margin-bottom:11px; border-radius:7px; gap:12px; border:1px solid transparent; }
.app .message:hover { background:#ffffff05; border-color:#ffffff08; }
.app .avatar { width:32px; height:32px; border-radius:8px; background:#303638; border:1px solid #464f4f; box-shadow:none; }
.app .msg-name { font-size:12px; font-weight:700; }
.app .msg-text { font-size:13.15px; line-height:1.65; color:#d5dcd5; letter-spacing:0; }
.app .msg-time { font-size:10px; color:#8b9790; }
.app .msg-act { padding:4px 7px; font-size:10px; border-color:#333b3b; border-radius:5px; }
.app .message-actions { margin-top:8px; opacity:.45; }
.app .message:hover .message-actions, .app .message-actions:focus-within { opacity:1; }
.composer-wrap { background:#191d1e; border-top:1px solid #333a3a; padding:12px clamp(16px,3%,42px) 13px; }
.app .composer { background:#222829; border:1px solid #414a4b; box-shadow:none; border-radius:9px; padding:9px 13px; }
.app .composer:focus-within { border-color:#8d9b93; box-shadow:0 0 0 3px #b3c1b00f; }
.app #messageInput { font:400 13px/1.5 'DM Sans',sans-serif; min-height:43px; height:43px; padding-top:7px; color:#ebefeb; }
.app .send-btn { border-radius:6px; background:#dedfd8; color:#15191a; font-size:11.5px; padding:9px 15px; }
.app .send-btn:hover { background:#f7f7f2; transform:translateY(-1px); }
.fine-print { font-size:10px; color:#929e96; }
.rail { background:#161a1b; border-left:1px solid #303738; padding:23px 17px; }
.rail-title { font:750 10px 'DM Sans',sans-serif; letter-spacing:1px; color:#d8dcd6; }
.rail-block { margin-bottom:25px; }
.community-stat { background:#1d2223; border:1px solid #333b3d; border-radius:8px; padding:16px; }
.community-stat .big-label { font:650 19px 'DM Sans',sans-serif; letter-spacing:-.3px; }
.community-stat p { font-size:11.5px; line-height:1.6; color:#aab4ad; }
.member .avatar { border-radius:7px; }
.moderation-shortcut, .account-profile { border-radius:8px; }
.guest-compose { background:#222829; border-radius:8px; border-color:#424e4b; }
.user-chip,.guest-avatar { border-radius:7px; }

/* Picks: editorial commerce, not a landing-page template */
.picks-page { background:#121617; color:#e7eae5; }
.picks-page .container { max-width:1320px; padding:0 clamp(22px,4%,65px); }
.picks-page .hero { padding:45px 0 35px; display:grid; grid-template-columns:minmax(0,1.6fr) minmax(280px,.67fr); gap:clamp(30px,5vw,90px); align-items:end; border-bottom:1px solid #2f3636; }
.picks-page .kicker { color:#9fa9a1; font-size:9px; font-weight:700; letter-spacing:1.5px; }
.picks-page .eyebrow-mark { background:#7b8981; width:17px; margin-right:9px; }
.picks-page .hero h1 { font:550 clamp(38px,4.6vw,61px)/1.08 'DM Sans',system-ui,sans-serif; letter-spacing:-2.7px; margin:20px 0 16px; max-width:690px; }
.picks-page .hero h1 .dim { color:#8d9991; }
.picks-page .hero-description { font-size:13.5px; color:#aeb7ae; line-height:1.75; max-width:580px; }
.picks-page .hero-meta { margin-top:24px; gap:20px; }
.picks-page .primary-btn { border-radius:6px; padding:12px 16px; font-size:11px; font-weight:750; }
.picks-page .primary-btn:hover { transform:translateY(-2px); }
.picks-page .text-btn { font-size:11px; color:#aeb7b1; }
.picks-page .hero-side { padding:0 0 8px; }
.picks-page .signature { min-height:0; background:none; border:0; border-left:1px solid #3f4846; padding:7px 0 4px 25px; border-radius:0; }
.picks-page .signature::after { content:none; }
.picks-page .sig-top { color:#a3aea7; font-size:9px; letter-spacing:1.25px; }
.picks-page .signature h3 { font:550 21px/1.3 'DM Sans',sans-serif; letter-spacing:-.6px; max-width:320px; margin:13px 0 9px; }
.picks-page .signature p { color:#98a39d; font-size:11.5px; }
.picks-page .sig-foot { margin-top:21px; border-color:#35403c; padding-top:12px; color:#8e9a91; font-size:9px; }
.picks-page .market-bar { background:#191f20; border:1px solid #343c3c; border-radius:8px; padding:13px 16px; margin:21px 0 16px; }
.picks-page .globe { width:34px; height:34px; border-radius:5px; font-size:17px; }
.picks-page .market-info strong { font-size:12px; color:#e5e8e4; }
.picks-page .market-info span { font-size:11px; color:#9da9a0; }
.picks-page .tracking { font-size:10px; }
.picks-page .segmented { border-radius:6px; }
.picks-page .segmented button { font-size:11px; border-radius:4px; }
.picks-page .feature-grid { grid-template-columns:minmax(0,1.45fr) minmax(0,.9fr); gap:12px; }
.picks-page .feature-main { min-height:310px; background:#202627; border:1px solid #3b4444; border-radius:8px; padding:26px 31px; }
.picks-page .feature-label { color:#abb5ad; font-size:9px; letter-spacing:1.4px; }
.picks-page .feature-main h2 { font:580 clamp(23px,2.6vw,34px)/1.18 'DM Sans',sans-serif; max-width:260px; letter-spacing:-1.2px; }
.picks-page .feature-main p { color:#aab6ae; font-size:11.8px; max-width:290px; }
.picks-page .feature-art { width:48%; opacity:.40; filter:grayscale(1) drop-shadow(5px 16px 15px #0004); }
.picks-page .outline-light { font-size:11px; border-radius:5px; padding:11px 15px; }
.picks-page .feature-bottom .micro { font-size:9px; }
.picks-page .feature-side { gap:12px; }
.picks-page .side-panel, .picks-page .side-panel.light { min-height:145px; background:#1a2021; border:1px solid #343c3d; border-radius:8px; padding:22px 24px; color:#e1e6e0; }
.picks-page .side-panel.light { background:#242b2b; }
.picks-page .side-panel .kicker, .picks-page .side-panel.light .kicker { color:#a2afa5; }
.picks-page .side-panel h3 { font:600 17px 'DM Sans',sans-serif; letter-spacing:-.4px; margin:10px 0 7px; }
.picks-page .side-panel p,.picks-page .side-panel.light p { color:#a8b3ac; font-size:11px; line-height:1.55; }
.picks-page .side-panel .footline,.picks-page .side-panel.light .footline { color:#a5b0aa; font-size:10px; margin-top:10px; }
.picks-page .section-head { padding:47px 0 19px; }
.picks-page .section-head h2 { font:550 clamp(24px,2.6vw,34px) 'DM Sans',sans-serif; letter-spacing:-1.3px; }
.picks-page .section-head p { font-size:11.5px; }
.picks-page .tabs button { border-radius:5px; font-size:11px; padding:9px 13px; background:#1c2122; }
.picks-page .tabs button.selected { background:#e7e9e2; }
.picks-page .search-wrap { background:#1b2021; border-radius:6px; }
.picks-page .cards { gap:12px; }
.picks-page .item { border-radius:8px; background:#1a1e1f; border-color:#343c3d; box-shadow:none; }
.picks-page .item:hover { transform:translateY(-3px); border-color:#707c73; box-shadow:0 13px 30px #0002; }
.picks-page .item-visual { height:195px; }
.picks-page .item-visual::before { background:none; }
.picks-page .v-one,.picks-page .v-three,.picks-page .v-four,.picks-page .v-six { background:#2b3132; }
.picks-page .v-two,.picks-page .v-five { background:#777f7b; }
.picks-page .item-art { width:74%; height:85%; filter:grayscale(1) drop-shadow(3px 7px 12px #0003); }
.picks-page .item-badge { background:#1c2122b8; font-size:9px; letter-spacing:.65px; border-radius:4px; }
.picks-page .save { border-radius:6px; }
.picks-page .item-body { padding:19px 20px 16px; }
.picks-page .item h3 { font:600 16px 'DM Sans',sans-serif; letter-spacing:-.35px; }
.picks-page .item p { font-size:11.5px; line-height:1.65; }
.picks-page .item-foot a,.picks-page .item-foot button { font-size:11px; }
.picks-page .bottom-cta { margin:50px 0 42px; background:#e3e6de; border-radius:8px; padding:26px 32px; }
.picks-page .bottom-cta h2 { font:600 23px 'DM Sans',sans-serif; letter-spacing:-.75px; }
.picks-page .bottom-cta p { font-size:11.5px; }
.picks-page .bottom-cta button { font-size:11px; border-radius:5px; }

/* Motion speaks quietly: page transition, micro-interaction, message arrival. */
@keyframes dq-rise { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:translateY(0); } }
@keyframes dq-arrive { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@keyframes dq-line { from { transform:scaleX(0); } to { transform:scaleX(1); } }
.main > .picks-page .hero > div:first-child { animation:dq-rise .42s ease both; }
.picks-page .hero-side { animation:dq-rise .5s .08s ease both; }
.picks-page .market-bar { animation:dq-rise .52s .1s ease both; }
.picks-page .feature-main,.picks-page .feature-side { animation:dq-rise .52s .15s ease both; }
.picks-page .item { animation:dq-rise .35s both; }
.picks-page .item:nth-child(2) { animation-delay:.045s; }
.picks-page .item:nth-child(3) { animation-delay:.09s; }
.picks-page .item:nth-child(4) { animation-delay:.135s; }
.picks-page .item:nth-child(5) { animation-delay:.18s; }
.chat-head,.welcome-inline { animation:dq-rise .3s ease both; }
.app .message:last-child { animation:dq-arrive .21s ease both; }
.topbar > .tabs .tab.active { transition:border-color .2s ease,color .2s ease; }

@media(max-width:1150px) {
  .app-grid { grid-template-columns:215px minmax(0,1fr) 225px; }
  .topbar { grid-template-columns:215px minmax(0,1fr) auto; padding:0 17px; }
}
@media(max-width:980px) {
  .app-grid { grid-template-columns:210px minmax(0,1fr); }
  .rail { display:none; }
}
@media(max-width:820px) {
  .topbar { padding:0 14px; grid-template-columns:minmax(0,1fr) auto; }
  .topbar > .tabs { height:auto; }
  .topbar > .tabs .tab { height:auto; border-bottom:0; padding:11px 13px; }
  .topbar > .tabs .tab.active { background:#303638; border-radius:5px; }
  .picks-page .hero { grid-template-columns:1fr; padding:32px 0 24px; gap:16px; }
  .picks-page .hero-side { display:none; }
  .picks-page .hero h1 { font-size:clamp(36px,7vw,49px); letter-spacing:-1.7px; }
  .picks-page .feature-grid { grid-template-columns:1fr; }
  .picks-page .feature-side { grid-template-columns:1fr 1fr; grid-template-rows:auto; }
}
@media(max-width:680px) {
  .topbar { height:63px; }
  .topbar > .tabs { background:#171b1c; border-color:#333b3b; }
  .topbar > .tabs .tab.active { background:#e6e8e1; color:#171a1a; }
  .app-grid { display:flex; }
  .app .messages { padding:15px 13px 23px; }
  .app .msg-text { font-size:13px; }
  .app .message { padding:10px 5px; }
  .app .head-title h1 { font-size:16px; }
  .picks-page .container { padding:0 18px; }
  .picks-page .hero h1 { font-size:38px; }
  .picks-page .market-bar { flex-direction:column; align-items:stretch; }
  .picks-page .feature-side { grid-template-columns:1fr; }
  .picks-page .feature-main { min-height:300px; }
  .picks-page .feature-art { opacity:.24; }
  .picks-page .cards { grid-template-columns:1fr; }
  .picks-page .bottom-cta { grid-template-columns:1fr; padding:23px 22px; }
  #dq-market-strip { height:36px; flex-basis:36px; }
  #dq-market-strip .dq-market-inner, #dq-market-strip tv-ticker-tape { height:35px; }
  #dq-market-strip .dq-market-label { padding:0 10px; }
  #dq-market-strip .dq-market-source { padding:0 8px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}