:root{--color-bg:#f5f6f8;--color-surface:#fff;--color-text:#1f2933;--color-muted:#6b7280;--color-border:#d8dce3;--color-primary:#2563eb;--color-error:#b91c1c;--color-success:#15803d;--radius:8px}*{box-sizing:border-box}body{background:var(--color-bg);color:var(--color-text);margin:0;font-family:system-ui,Hiragino Sans,Noto Sans JP,sans-serif;line-height:1.6}.header{background:var(--color-surface);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.5rem;display:flex}.header__title{margin:0;font-size:1.25rem}.header__user{align-items:center;gap:.75rem;display:flex}.main{max-width:720px;margin:0 auto;padding:1.5rem}.panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:1.25rem}.panel__title{margin-top:0;font-size:1.05rem}.form{gap:.5rem;display:grid}.form--inline{grid-template-columns:1fr auto;align-items:center;margin-bottom:1rem}.form__label{color:var(--color-muted);font-size:.875rem}.form__input{border:1px solid var(--color-border);border-radius:var(--radius);padding:.5rem .75rem;font-size:1rem}.form__input:focus-visible{outline:2px solid var(--color-primary);outline-offset:1px}.form__actions{gap:.5rem;margin-top:.5rem;display:flex}.button{border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);cursor:pointer;padding:.5rem 1rem;font-size:.9375rem}.button:hover:not(:disabled){border-color:var(--color-primary)}.button:disabled{opacity:.6;cursor:not-allowed}.button--primary{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.notice{border-radius:var(--radius);border:1px solid var(--color-error);color:var(--color-error);background:#fef2f2;margin:0 0 1rem;padding:.75rem 1rem}.notice[data-kind=success]{border-color:var(--color-success);color:var(--color-success);background:#f0fdf4}.message-list{gap:.5rem;margin:0;padding:0;list-style:none;display:grid}.message{border:1px solid var(--color-border);border-radius:var(--radius);grid-template-columns:1fr auto auto;align-items:center;gap:.75rem;padding:.75rem;display:grid}.message--archived{opacity:.55}.message--archived .message__text{text-decoration:line-through}.message__text{overflow-wrap:anywhere}.message__time{color:var(--color-muted);white-space:nowrap;font-size:.8125rem}.message-list__empty,.loading{color:var(--color-muted)}