/* app: 화면 뼈대 (헤더, 하단 탭, 데모 시계) */
body { padding-bottom: 96px; }
.topbar { position: sticky; top: 0; z-index: 20; background: rgba(255, 248, 236, .92); backdrop-filter: blur(8px); border-bottom: 2px solid var(--line); }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; height: 60px; }
.logo { display: flex; align-items: center; gap: 8px; text-decoration: none; color: var(--ink); }
.logo-mark { font-size: 30px; display: inline-block; transform: rotate(-20deg); }
.logo b { font-family: var(--font); font-size: 24px; display: block; line-height: 1; font-weight: 400; }
.logo small { font-size: 12px; color: var(--ink-2); }
.tabbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; display: flex; justify-content: center; gap: 4px;
  background: var(--paper); border-top: 2px solid var(--line); padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
}
.tabbar a {
  flex: 1; max-width: 120px; display: flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--ink-2);
  font-family: var(--font); font-size: 13px; padding: 4px; border-radius: 14px;
}
.tabbar a span { font-size: 22px; }
.tabbar a.active { background: var(--butter-2); color: var(--ink); }
.page-title { font-size: 26px; margin-top: 18px; }
.court-intro { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.case-meta { background: var(--paper); border: 2px solid var(--line); border-radius: 18px; padding: 10px; margin: 6px 0 14px; }
.submitted-banner { background: #e2f6ea; color: #2f7a52; border-radius: 16px; padding: 12px 14px; font-family: var(--font); font-size: 17px; text-align: center; }
.nudge { background: #fff6dc; border: 2px dashed var(--butter-dark); border-radius: 18px; padding: 12px; margin: 12px 0; text-align: center; }
.nudge .btn { margin-top: 8px; }
.after-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 12px 0; }
.error-box { text-align: center; }
.demo-bar {
  background: repeating-linear-gradient(45deg, #ffe29a 0 14px, #ffd56b 14px 28px); border-bottom: 2px solid var(--butter-dark);
  font-family: var(--font); font-size: 14px;
}
.demo-bar .wrap { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding-top: 6px; padding-bottom: 6px; }
.demo-bar b { font-size: 16px; font-variant-numeric: tabular-nums; }
.demo-bar button { border: 2px solid var(--bean-2); background: #fffaf0; border-radius: 999px; padding: 3px 10px; font-size: 13px; cursor: pointer; color: var(--ink); }
.upcoming { text-align: center; }
