/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Cairn signed-in surfaces (auth + dashboard). Mirrors the landing palette. */
:root {
  --bg:#0f1115; --panel:#161a21; --line:#262c36; --ink:#e8eaee;
  --soft:#9aa3b2; --faint:#5e6675; --accent:#d8b46a;
}
body {
  margin:0; background:var(--bg); color:var(--ink);
  font:16px/1.6 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
.auth, .dashboard { max-width:680px; margin:0 auto; padding:64px 24px 96px; }
.auth h1, .dashboard h1 { font-size:32px; font-weight:800; letter-spacing:-.01em; margin:0 0 8px; }
.auth p, .dashboard p { color:var(--soft); }
.auth form { display:flex; flex-direction:column; gap:10px; max-width:360px; margin-top:24px; }
label { font-size:13px; color:var(--soft); }
input[type=email], input[type=text] {
  background:var(--panel); border:1px solid var(--line); border-radius:10px;
  color:var(--ink); padding:12px 14px; font-size:15px;
}
input[type=submit], button {
  background:var(--accent); color:#1a1407; border:0; border-radius:10px;
  padding:12px 16px; font-size:15px; font-weight:700; cursor:pointer;
}
.flash { max-width:680px; margin:16px auto 0; padding:12px 16px; border-radius:10px; font-size:14px; }
.flash-notice { background:rgba(216,180,106,.12); border:1px solid var(--line); color:var(--ink); }
.flash-alert  { background:rgba(220,80,80,.14); border:1px solid #5e2a2a; color:#f2c7c7; }
.apps { list-style:none; padding:0; margin:24px 0; display:grid; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.apps li { background:var(--panel); padding:16px 18px; }
.apps b { display:block; }
.apps .slug { color:var(--faint); font:600 12px/1 ui-monospace,monospace; }
.apps .key { display:block; margin-top:8px; font:13px/1.4 ui-monospace,monospace; color:var(--accent); word-break:break-all; }
.panel { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:24px; margin-top:24px; }
.muted { color:var(--faint); font-size:13px; }
a { color:var(--accent); }