/* AdaReady dashboard. Same palette and focus signature as the marketing site;
   deliberately plainer, because this is a tool rather than a pitch. */
:root{
  --ink:#101413; --ink-soft:#46514c; --paper:#fff; --wash:#f2f4f2;
  --rule:#d6dbd7; --pine:#0e3b2a; --pine-lift:#17513a; --signal:#cfe84a;
  --ok:#1b6b3a; --warn:#a85408; --err:#b3261e;
  --sans:system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--wash);color:var(--ink);font-family:var(--sans);font-size:1rem;line-height:1.6}
.wrap{width:min(1060px,100%);margin-inline:auto;padding-inline:clamp(1rem,4vw,2rem)}
h1{font-size:clamp(1.8rem,4vw,2.4rem);letter-spacing:-.03em;margin:0 0 .4em}
h2{font-size:1.25rem;letter-spacing:-.02em;margin:2rem 0 .75rem}
h3{font-size:1.05rem;margin:0 0 .4rem}
p{margin:0 0 1rem}
a{color:inherit}
code,pre{font-family:var(--mono);font-size:.85rem}
pre{background:var(--wash);border:1px solid var(--rule);border-radius:6px;padding:.85rem;overflow-x:auto;white-space:pre-wrap;word-break:break-all}

/* Same double focus ring as adaready.com — it is the brand signature. */
:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 6px var(--signal);border-radius:3px}
.skip{position:absolute;left:-9999px;background:var(--ink);color:#fff;padding:.8rem 1.2rem;font-weight:600;z-index:10}
.skip:focus{left:1rem;top:.5rem}

.app-head{background:var(--paper);border-bottom:1px solid var(--rule)}
.app-head__in{display:flex;align-items:center;gap:2rem;min-height:64px}
.brand{display:flex;align-items:center;gap:.5rem;font-weight:800;letter-spacing:-.03em;text-decoration:none}
.brand__mark{width:20px;height:20px}
.app-nav{margin-left:auto;display:flex;align-items:center;gap:1.5rem;font-size:.95rem;font-weight:600}
.app-nav a{text-decoration:none}
.app-nav a:hover{text-decoration:underline}
.inline-form{display:inline}
.linkish{background:none;border:0;font:inherit;font-weight:600;cursor:pointer;color:inherit;padding:0;text-decoration:underline}

.page{padding-block:2.5rem 4rem}
.narrow{max-width:26rem}
.lede{color:var(--ink-soft);font-size:1.05rem}
.muted{color:var(--ink-soft);font-size:.92rem}

.cards{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));margin-bottom:1rem}
.card{background:var(--paper);border:1px solid var(--rule);border-radius:10px;padding:1.4rem}
.card--current{border:2px solid var(--pine)}
.card h2{margin-top:0;font-size:.78rem;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.stat{font-size:2rem;font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:0 0 .3rem}
.stat small{font-size:.9rem;font-weight:400;color:var(--ink-soft);letter-spacing:0}

.meter{height:8px;background:var(--wash);border:1px solid var(--rule);border-radius:99px;overflow:hidden;margin:.75rem 0}
.meter span{display:block;height:100%;background:var(--ok)}

.ticks{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.45rem;font-size:.93rem;color:var(--ink-soft)}
.ticks li{display:grid;grid-template-columns:.9rem 1fr;gap:.55rem;align-items:start}
.ticks li::before{content:"";width:7px;height:7px;margin-top:.5rem;border-radius:2px;background:var(--ok)}

.btn{display:inline-flex;align-items:center;justify-content:center;font:inherit;font-weight:600;padding:.7rem 1.2rem;border-radius:6px;border:2px solid transparent;text-decoration:none;cursor:pointer}
.btn--primary{background:var(--pine);color:#fff}
.btn--primary:hover{background:var(--pine-lift)}
.btn--primary:disabled{opacity:.45;cursor:not-allowed}
.btn--ghost{border-color:var(--ink);color:var(--ink);background:transparent}
.btn--ghost:hover{background:var(--ink);color:#fff}

.field{display:grid;gap:.35rem;margin-bottom:1.1rem}
.field label{font-weight:600;font-size:.93rem}
input[type=text],input[type=email],input[type=password]{font:inherit;padding:.65rem .8rem;border:1px solid var(--ink-soft);border-radius:6px;background:var(--paper);color:var(--ink);width:100%}
.stack>*+*{margin-top:0}

.messages{margin-bottom:1.5rem}
.msg{border-left:3px solid var(--rule);padding:.7rem 1rem;background:var(--paper);border-radius:0 6px 6px 0;font-size:.95rem}
.msg--success{border-left-color:var(--ok)}
.msg--warning{border-left-color:var(--warn)}
.msg--error{border-left-color:var(--err)}
.msg--info{border-left-color:var(--pine)}

.app-foot{border-top:1px solid var(--rule);background:var(--paper);padding-block:1.5rem;font-size:.88rem;color:var(--ink-soft)}
.app-foot p{margin:0}