/* AI Notices + tokens (js/notices.js) */
.notice-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.tok-chip { font-size: 12.5px; font-weight: 600; background: color-mix(in srgb, var(--brand) 10%, var(--panel-2)); border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--line)); border-radius: 20px; padding: 4px 11px; color: var(--brand); }
.tok-chip.low { background: color-mix(in srgb, var(--warn) 14%, transparent); border-color: color-mix(in srgb, var(--warn) 40%, var(--line)); color: var(--warn); }
.notice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.notice-lbl { font-size: 12px; font-weight: 700; color: var(--ink-soft); margin-bottom: 5px; }
.notice-out { width: 100%; font-family: 'Inter', system-ui, sans-serif; font-size: 13px; line-height: 1.5; }
.notice-prev { white-space: pre-wrap; background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px; padding: 12px; font-size: 12.5px; max-height: 40vh; overflow: auto; }
.notice-saved { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.notice-item { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; align-items: center; border: 1px solid var(--line); border-radius: 9px; padding: 9px 12px; }
.notice-item .notice-snip { grid-column: 1 / 2; }
.notice-item .btn { grid-row: 1 / 3; }
.tok-packs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.tok-pack { border: 1px solid var(--line); border-radius: 12px; padding: 14px; text-align: center; }
.tok-pack-n { font-weight: 800; font-size: 15px; }
.tok-pack-p { font-size: 22px; font-weight: 800; color: var(--brand); margin: 4px 0 2px; }
@media (max-width: 720px) { .notice-grid, .tok-packs { grid-template-columns: 1fr; } }
