:root{color-scheme:dark;--bg: #090d16;--surface: #111827;--surface-raised: #1f2937;--surface-soft: #1e293b;--border: #1f2937;--border-strong: #374151;--text: #f1f5f9;--text-strong: #f9fafb;--text-muted: #94a3b8;--text-subtle: #64748b;--accent: #38bdf8;--primary: #0284c7;--primary-hover: #0369a1;--neutral: #334155;--neutral-hover: #475569;--danger: #ef4444;--danger-surface: #7f1d1d;--success: #10b981;--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;min-height:100vh;min-height:100dvh;background:var(--bg);color:var(--text);font-family:var(--font-sans);line-height:1.5;-webkit-font-smoothing:antialiased}h1,h2,p{margin:0}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:20px;padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}.header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--surface-soft)}.header__brand{display:flex;align-items:center;gap:12px}.header__mark{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:10px;color:var(--accent);background:var(--surface);border:1px solid var(--border-strong)}.header__title{font-size:22px;font-weight:700;line-height:1.2;color:var(--accent)}.header__subtitle{margin-top:2px;font-size:14px;color:var(--text-muted)}.header__actions{display:flex;gap:8px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border:0;border-radius:var(--radius-md);font-size:14px;font-weight:600;color:#fff;transition:background-color .2s ease}.btn--primary{background:var(--primary)}.btn--primary:hover{background:var(--primary-hover)}.btn--secondary{background:var(--neutral)}.btn--secondary:hover{background:var(--neutral-hover)}.btn--neutral{background:var(--border-strong);font-weight:500}.btn--neutral:hover{background:#4b5563}.btn--danger{background:#b91c1c}.btn--danger:hover{background:#991b1b}.icon-btn{display:inline-grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:var(--radius-sm);background:transparent;color:#9ca3af;transition:background-color .2s ease,color .2s ease}.icon-btn:hover{color:#fff;background:var(--surface-raised)}.icon-btn--soft{background:var(--surface-soft);color:#93c5fd}.icon-btn--soft:hover{background:var(--neutral);color:#bfdbfe}.icon-btn--danger{color:#fca5a5}.icon-btn--danger:hover{background:var(--danger-surface);color:#fee2e2}.notice{display:flex;align-items:flex-start;gap:12px;padding:16px;border-radius:10px;background:#1e2415;border:1px solid #4d7c0f;color:#ecfccb}.notice__icon{flex:none;margin-top:1px;color:#bef264}.notice__body{font-size:13px;line-height:20px}.notice__title{color:#bef264;font-weight:700}.notice__text{margin-top:4px;color:#d9f99d}.notice code{font-family:var(--font-mono);font-size:12px}.search{position:relative}.search__icon{position:absolute;top:50%;left:14px;transform:translateY(-50%);color:var(--text-subtle);pointer-events:none}.search .search__input{padding:12px 16px 12px 42px;background:var(--surface)}.input{display:block;width:100%;padding:10px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-raised);color:var(--text-strong);font-size:14px}.input::placeholder{color:#6b7280}.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #38bdf840}.input--mono{font-family:var(--font-mono);letter-spacing:.5px}.input--area{resize:none}.list{display:flex;flex-direction:column;gap:12px}.card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:0 4px 12px #0000004d;transition:border-color .2s ease}.card:hover{border-color:var(--border-strong)}.card__info{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1 1 40%}.card__heading{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.card__name{font-size:16px;font-weight:600;color:var(--text-strong);overflow-wrap:anywhere}.card__description{font-size:13px;color:var(--text-muted);overflow-wrap:anywhere}.chip{padding:2px 8px;border-radius:9999px;background:var(--surface-soft);color:var(--accent);font-size:11px}.card__side{display:flex;align-items:center;gap:16px;flex:none}.card__code-block{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.card__actions{display:flex;gap:6px}.code-btn{display:inline-flex;align-items:center;gap:8px;padding:2px 4px;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--accent)}.code-btn:disabled{cursor:default;color:var(--text-subtle)}.code-btn__digits{font-family:var(--font-mono);font-size:24px;font-weight:700;letter-spacing:2px;font-variant-numeric:tabular-nums}.code-btn__icon{color:var(--text-subtle);transition:color .2s ease}.code-btn:hover:not(:disabled) .code-btn__icon{color:var(--text)}.code-btn__icon--done,.code-btn:hover:not(:disabled) .code-btn__icon--done{color:var(--success)}.countdown{display:flex;align-items:center;gap:6px}.countdown__track{width:60px;height:4px;overflow:hidden;border-radius:2px;background:var(--surface-soft)}.countdown__bar{height:100%;background:var(--success);transition:width 1s linear,background-color .3s ease}.countdown__bar--expiring{background:var(--danger)}.countdown__time{min-width:28px;font-size:11px;color:var(--text-subtle);font-variant-numeric:tabular-nums}.empty{display:flex;flex-direction:column;align-items:center;gap:4px;padding:40px 20px;text-align:center;background:var(--surface);border:1px dashed var(--border-strong);border-radius:var(--radius-lg)}.empty__icon{margin-bottom:8px;color:var(--text-subtle)}.empty__title{font-size:16px;color:#9ca3af}.empty__text{font-size:13px;color:#6b7280}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;overflow-y:auto;background:#000c}.modal{display:flex;flex-direction:column;gap:16px;width:100%;max-height:100%;padding:20px;overflow-y:auto;background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-lg)}.modal:focus{outline:none}.modal--sm{max-width:400px}.modal--md{max-width:460px}.modal--lg{max-width:500px}.modal__header{display:flex;align-items:center;justify-content:space-between;gap:12px}.modal__title{font-size:18px;font-weight:600;color:var(--text-strong)}.modal__text{font-size:14px;color:var(--text-muted);overflow-wrap:anywhere}.modal__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:4px}.form{display:flex;flex-direction:column;gap:12px}.field__label{display:block;margin-bottom:4px;font-size:13px;color:#9ca3af}.form__note{font-size:13px;color:var(--text-muted)}.form__error{font-size:13px;color:#fca5a5}.scanner{width:100%;min-height:260px;overflow:hidden;border-radius:var(--radius-md);background:#000}.scanner__status{font-size:13px;text-align:center;color:var(--text-muted)}.scanner__status--error{color:#fca5a5}.toast-region{position:fixed;left:0;right:0;bottom:max(20px,env(safe-area-inset-bottom));z-index:1100;display:flex;justify-content:center;padding:0 16px;pointer-events:none}.toast{display:flex;align-items:center;gap:10px;max-width:420px;padding:10px 16px;border-radius:var(--radius-md);background:var(--surface-raised);border:1px solid var(--border-strong);color:var(--text-strong);font-size:14px;box-shadow:0 8px 24px #00000073}.toast--success svg{color:var(--success)}.toast--error{border-color:#b91c1c}.toast--error svg{color:#f87171}@media (max-width: 560px){.header__actions{width:100%}.header__actions .btn{flex:1}.card{flex-direction:column;align-items:stretch}.card__side{justify-content:space-between}.card__code-block{align-items:flex-start}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
