/* 완성 알림 card (B3-A6) in Liquid Glass (P2): loaded by web/account/index.html and injected by web/account/boot.js on the making page.
   Tokens from /static/lg/lg-tokens.css (with the app's styles.css values as fallbacks, so the card never renders unstyled). */
.notify-card {
  display: grid; gap: var(--s2); padding: var(--s4); border-radius: var(--r3); background: var(--n0); border: 0;
  box-shadow: var(--e2), 0 0 0 var(--hair) var(--n3); color: var(--n9);
  font-family: var(--font); transition: opacity var(--dur-move) var(--ease-out);}
.notify-card h3 { margin: 0; font: var(--t-body);}
.notify-card .nc-form { display: flex; gap: var(--s2);}
.notify-card input { flex: 1; min-width: 0; height: var(--s7); padding: 0 var(--s3); border: 0; border-radius: var(--r2); background: var(--n2); color: inherit;
  font-size: var(--fs-body); font-variant-numeric: tabular-nums; box-shadow: none; outline: none;}
.notify-card input:focus-visible { box-shadow: 0 0 0 var(--hair2) color-mix(in srgb, var(--accent) 70%, transparent);}
.notify-card input[aria-invalid="true"] { box-shadow: 0 0 0 var(--hair2) var(--warn);}

.notify-card .nc-consent { font-size: var(--fs-caption); color: var(--n5);}
.notify-card .nc-done { font-weight: var(--fw-bold); color: var(--ok);}
.notify-card.nc-out { opacity: 0;}
/* on the dark make stage (P1's screen) the card keeps the stage's own colours */
.stage .notify-card { background: var(--stage-surface); box-shadow: 0 0 0 var(--hair) var(--stage-line); color: var(--stage-text);}
.stage .notify-card .meta, .stage .notify-card .nc-consent { color: var(--stage-text-2);}
.stage .notify-card input { background: var(--stage); color: var(--stage-text); box-shadow: inset 0 0 0 var(--hair) var(--stage-line);}
@media (prefers-reduced-motion: reduce) { .notify-card { transition: none;} }