/* ============ リセット & 共通 ============ */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary, time, mark, audio, video, main {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  font-style: normal;
    
  letter-spacing: normal;
  vertical-align: baseline;
  background: transparent;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main {
  display: block;
  margin: 0;
}

body{
  position: relative;
}

ul {
    padding-left: 0px;
    margin-block-start: 0em;
    margin-block-end: 0em;
    padding-inline-start: 0px;
}
li {
    list-style: none;
}


*, *::before, *::after { box-sizing: border-box; }
/* hidden属性は常に display:none を優先させる（display:flex/grid等が上書きしないよう） */
[hidden] { display: none !important; }
html, body { margin: 0; padding: 0; height: 100%; }
html, body { overflow-x: hidden; } /* レスポンシブ崩れた時の保険 */
button { font: inherit; cursor: pointer; }

/* ============ 色変数（ここを変えるだけで全体トーンを調整可） ============ */
:root {
  --color-bg: #edf0f299;
  --color-pane: #f9fafc;
  --color-text: #1f2328dd;
  --color-text-sub: #3a434edd;
  --color-border: #00000012;
  --color-accent: #204b66;
  --color-accent-soft: #18829b;

  /* サービス別カラー（左線・タグ色） */
  --color-svc-email:     #18829b;
  --color-svc-line:      #4dbc2e;
  --color-svc-chatwork:  #219b75;
  --color-svc-sms:       #a1bc06;

  /* バッジ色 */
  --badge-unread:     #ff6950;
  --badge-unreplied:  #ffa052;
  --badge-replied:    #219b75;
  --badge-incomplete: #a1bc06;
  --badge-resolved:   #18829b;

  /* 経過時間の段階色 */
  --elapsed-normal:  #6a737d;
  --elapsed-normal-2:#18829b;
  --elapsed-soon:    #219b75;
  --elapsed-warn:    #ffa052;
  --elapsed-late:    #ff6950;

  --radius-4: 4px;
  --radius: 6px;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.06);

  --ft-16: 16px;
  --ft-14: 14px;
  --ft-13: 13px;
  --ft-12: 12px;
  --ft-11: 11px;
  --ft-10: 10px;
}

/* ============ タイポ ============ */
body {
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic UI", sans-serif;
  font-size: 14px;
  color: var(--color-text);
  background: var(--color-bg);
}

a { color: var(--color-accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* スクロールバー控えめ（任意） */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.15); border-radius: 4px; }