/* UmmahCube chrome for app.ummahcube.com. Colours from /root/UMG-UmmahCube/mvp/assets/ummah-tokens.css. */
:root { --cube-forest: #166534; --cube-forest-deep: #0f4a26; --cube-gold: #c8912e; --cube-cream: #faf8f3; --cube-ink: #0f1f17; }
html { color-scheme: light; }
body.cube-body { background: var(--cube-cream); color: var(--cube-ink); font-family: 'Instrument Sans', 'Instrument Sans Fallback', system-ui, sans-serif; }
.cube-body h1, .cube-body h2, .cube-body .font-fraunces { font-family: 'Literata', 'Literata Fallback', Georgia, serif; }
.cube-top { background: var(--cube-forest-deep); color: var(--cube-cream); }
.cube-top a { color: var(--cube-cream); }
.cube-top .brand { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; text-decoration: none; }
.cube-top .brand img { width: 30px; height: 33px; }
.cube-top .brand-word { font: 500 1.25rem/1 'Literata', 'Literata Fallback', Georgia, serif; }
.cube-top .brand-word b { color: var(--cube-gold); font-weight: 600; }
.cube-top .brand-by { font-size: .8125rem; opacity: .85; }
.cube-top button, .cube-top .link { min-height: 44px; padding: 0 12px; background: none; border: 0; color: inherit; font: inherit; cursor: pointer; text-decoration: underline; }
.cube-foot { color: #4a6356; font-size: .875rem; }
.cube-foot a { color: var(--cube-forest); text-decoration: underline; }
.cube-btn { display: inline-block; min-height: 44px; padding: 11px 22px; border-radius: 10px; background: var(--cube-forest); color: #fff; font-weight: 600; text-decoration: none; }
.cube-btn:hover { background: var(--cube-forest-deep); }

/* r2970 walk fixes. Header at 390 px: one line for the sign-out button and the "by Ummah One" words. */
.cube-top .brand-by, .cube-top button, .cube-top .link { white-space: nowrap; }
.cube-top .brand { gap: 8px; flex-wrap: nowrap; }
@media (max-width: 480px) { .cube-top .brand-by { font-size: .6875rem; } .cube-top .brand-word { font-size: 1.125rem; } .cube-top button, .cube-top .link { padding: 0 6px; } }
/* Tap targets: at least 44 px (set only on this host; the class is added in the organization views). */
.cube-body .tap { display: inline-flex; align-items: center; min-height: 44px; }