:root {
  color-scheme: light dark;
  font-family: Inter, Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #f4f4f4;
  color: #111;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: linear-gradient(180deg, #f7f7f7, #ececec); }
button, textarea { font: inherit; }
.shell { width: min(760px, 100%); margin: 0 auto; padding: max(28px, env(safe-area-inset-top)) 20px max(40px, env(safe-area-inset-bottom)); }
.hero { padding: 24px 4px 20px; }
.eyebrow, .label { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; opacity: .56; }
h1 { margin: 10px 0 14px; font-size: clamp(38px, 8vw, 72px); line-height: .98; letter-spacing: -.055em; }
.subtitle { margin: 0; max-width: 560px; line-height: 1.55; opacity: .66; }
.status-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 16px 0; }
.card, .action-panel, .future-panel, .diagnostics { background: rgba(255,255,255,.82); border: 1px solid rgba(0,0,0,.08); border-radius: 20px; box-shadow: 0 14px 40px rgba(0,0,0,.05); }
.card { padding: 18px; min-height: 104px; display: flex; flex-direction: column; justify-content: space-between; }
.card strong { font-size: 18px; }
.action-panel { padding: 22px; display: flex; justify-content: space-between; gap: 20px; align-items: center; }
.action-panel h2, .future-panel h2, .diagnostics h2 { margin: 7px 0 8px; font-size: 20px; }
.action-panel p { margin: 0; opacity: .63; line-height: 1.45; }
button { border: 0; border-radius: 999px; background: #111; color: white; padding: 12px 18px; min-width: 92px; font-weight: 700; cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .34; }
button.secondary { background: rgba(0,0,0,.08); color: inherit; }
.reentry-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.future-panel { margin-top: 12px; padding: 22px; }
textarea { width: 100%; min-height: 110px; resize: vertical; border: 1px solid rgba(0,0,0,.09); border-radius: 14px; padding: 14px; background: rgba(0,0,0,.035); color: inherit; }
.diagnostics { margin-top: 12px; padding: 22px; }
.diagnostics ul { list-style: none; padding: 0; margin: 8px 0 0; }
.diagnostics li { display: flex; justify-content: space-between; gap: 20px; padding: 11px 0; border-top: 1px solid rgba(0,0,0,.07); }
.toast { position: fixed; left: 50%; bottom: max(18px, env(safe-area-inset-bottom)); transform: translateX(-50%); background: #111; color: white; padding: 11px 16px; border-radius: 999px; box-shadow: 0 10px 35px rgba(0,0,0,.28); }
@media (max-width: 620px) {
  .status-grid { grid-template-columns: 1fr; }
  .card { min-height: 82px; }
  .action-panel { align-items: flex-start; flex-direction: column; }
}
@media (prefers-color-scheme: dark) {
  :root { background: #0d0d0d; color: #f5f5f5; }
  body { background: linear-gradient(180deg, #101010, #171717); }
  .card, .action-panel, .future-panel, .diagnostics { background: rgba(28,28,28,.9); border-color: rgba(255,255,255,.09); }
  textarea { border-color: rgba(255,255,255,.09); background: rgba(255,255,255,.04); }
  button { background: #f5f5f5; color: #111; }
  button.secondary { background: rgba(255,255,255,.12); color: #f5f5f5; }
  .diagnostics li { border-color: rgba(255,255,255,.08); }
}