:root { --red:#CC0000; --green:#06C755; --bg:#e5e5ea; }
  * { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
  html, body {
    width:100%; height:100%;
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }
  body {
    background:var(--bg); font-family:'Noto Sans JP',sans-serif;
    display:flex; flex-direction:column;
    max-width:600px; margin:0 auto;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    max-width: 600px;
    margin: 0 auto;
  }

  .header {
    background:var(--red); padding:18px 20px;
    display:flex; align-items:center; gap:14px; flex-shrink:0;
  }
  .header-icon {
    width:50px; height:50px; background:rgba(255,255,255,0.2);
    border-radius:50%; display:flex; align-items:center; justify-content:center;
    font-size:28px; flex-shrink:0;
  }
  .header-name { font-size:20px; font-weight:700; color:#fff; }
  .header-status { font-size:14px; color:rgba(255,255,255,0.7); }

  .progress-wrap { background:rgba(0,0,0,0.15); height:6px; flex-shrink:0; }
  .progress-bar { height:6px; background:#fff; transition:width 0.4s ease; }

  .chat {
    flex:1; overflow-y:auto; padding:18px 16px;
    display:flex; flex-direction:column; gap:16px;
    scroll-behavior:smooth; -webkit-overflow-scrolling:touch;
  }

  .bubble-wrap { display:flex; align-items:flex-end; gap:10px; animation:fadeUp 0.25s ease both; }
  @keyframes fadeUp { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
  .bubble-wrap.bot  { justify-content:flex-start; }
  .bubble-wrap.user { justify-content:flex-end; }

  .bot-icon {
    width:44px; height:44px; background:var(--red); border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:24px; flex-shrink:0;
  }

  .bubble { max-width:84%; padding:16px 20px; border-radius:20px; font-size:19px; line-height:1.85; }
  .bubble.bot {
    background:#fff; border-bottom-left-radius:4px;
    color:#1a1a1a; box-shadow:0 2px 6px rgba(0,0,0,0.1);
  }
  .bubble.user {
    background:var(--green); border-bottom-right-radius:4px;
    color:#fff; font-weight:700;
  }
  .bubble.notice {
    background:#fff8e1; border:2px solid #ffc107;
    border-radius:14px; font-size:17px; color:#333; line-height:1.9;
    max-width:95%;
  }
  .step-tag {
    display:inline-block; background:var(--red); color:#fff;
    font-size:13px; font-weight:700; padding:4px 12px;
    border-radius:20px; letter-spacing:1px; margin-bottom:8px;
  }

  .typing { display:flex; align-items:center; gap:10px; animation:fadeUp 0.25s ease both; }
  .typing-dots {
    background:#fff; border-radius:20px; padding:14px 20px;
    display:flex; gap:6px; align-items:center;
    box-shadow:0 2px 6px rgba(0,0,0,0.1);
  }
  .typing-dots span { width:10px; height:10px; background:#ccc; border-radius:50%; animation:dot 1.2s infinite; }
  .typing-dots span:nth-child(2){animation-delay:.2s}
  .typing-dots span:nth-child(3){animation-delay:.4s}
  @keyframes dot { 0%,80%,100%{transform:scale(1);opacity:.4} 40%{transform:scale(1.3);opacity:1} }

  /* 入力エリア */
  .input-area {
    background:#fff; border-top:2px solid #ddd;
    padding:14px 16px 20px; flex-shrink:0; width:100%;
  }

  /* 選択ボタン */
  .choices { display:flex; flex-wrap:wrap; gap:12px; }
  .choice-btn {
    background:#f5f5f5; border:2px solid #ddd; border-radius:14px;
    padding:18px 16px; font-size:19px; font-weight:700;
    font-family:'Noto Sans JP',sans-serif; color:#333;
    cursor:pointer; flex:1; min-width:calc(50% - 6px);
    text-align:center; line-height:1.5; transition:all 0.15s;
  }
  .choice-btn.wide { min-width:100%; flex:none; width:100%; }
  .choice-btn:active,.choice-btn.selected { background:var(--red); border-color:var(--red); color:#fff; }
  .choice-btn:disabled { opacity:0.5; }

  /* テキスト入力 */
  .text-row { display:flex; flex-direction:column; gap:10px; }
  .text-input {
    width:100%; border:2px solid #ddd; border-radius:12px;
    padding:16px 18px; font-size:19px;
    font-family:'Noto Sans JP',sans-serif; outline:none;
    background:#f9f9f9; color:#1a1a1a;
  }
  .text-input:focus { border-color:var(--red); background:#fff; }
  .send-btn {
    width:100%; padding:18px; background:var(--red); border:none;
    border-radius:12px; color:#fff; font-size:20px; font-weight:700;
    font-family:'Noto Sans JP',sans-serif; cursor:pointer; letter-spacing:2px;
  }
  .send-btn:disabled { opacity:0.3; cursor:default; }

  /* 複数フィールド */
  .multi-row { display:flex; flex-direction:column; gap:10px; }
  .field-label { font-size:15px; font-weight:700; color:#666; letter-spacing:1px; }
  .field-hint { font-size:13px; color:#aaa; margin-top:-6px; }

  /* 確認・修正カード */
  .review-card {
    background:#fff; border-radius:16px; padding:20px;
    margin:0 4px 10px; box-shadow:0 2px 10px rgba(0,0,0,0.1);
    animation:fadeUp 0.35s ease;
  }
  .review-title {
    font-size:19px; font-weight:900; color:var(--red);
    text-align:center; margin-bottom:14px;
    padding-bottom:12px; border-bottom:2px solid #f0f0f0;
  }
  .review-section {
    font-size:13px; font-weight:700; letter-spacing:2px;
    color:var(--red); margin:12px 0 6px;
  }
  .review-row {
    display:flex; align-items:center; gap:10px;
    padding:12px 0; border-bottom:1px solid #f5f5f5;
  }
  .review-row:last-of-type { border-bottom:none; }
  .review-label { color:#888; font-weight:700; font-size:15px; flex-shrink:0; width:100px; }
  .review-value { color:#1a1a1a; font-weight:700; font-size:17px; flex:1; line-height:1.5; }
  .edit-btn {
    background:#f0f0f0; border:none; border-radius:8px;
    padding:8px 14px; font-size:15px; font-weight:700;
    font-family:'Noto Sans JP',sans-serif; color:#555; cursor:pointer; flex-shrink:0;
  }
  .edit-btn:active { background:var(--red); color:#fff; }
  .submit-btn {
    width:100%; margin-top:16px; background:var(--red); border:none;
    border-radius:12px; padding:20px; font-size:19px; font-weight:700;
    font-family:'Noto Sans JP',sans-serif; color:#fff; cursor:pointer; letter-spacing:1px;
  }

  /* 完了 */
  .complete-msg {
    background:#fff; border-radius:16px; padding:24px 20px;
    margin:0 4px 10px; box-shadow:0 2px 10px rgba(0,0,0,0.1);
    text-align:center; animation:fadeUp 0.35s ease;
  }
  .complete-icon { font-size:52px; margin-bottom:12px; }
  .complete-main { font-size:22px; font-weight:900; color:var(--red); margin-bottom:10px; }
  .complete-sub { font-size:17px; color:#555; line-height:1.8; }
  .complete-action {
    background:#fff3cd; border:2px solid #ffc107; border-radius:12px;
    padding:16px; margin-top:16px; font-size:17px;
    font-weight:700; color:#333; line-height:1.8; text-align:left;
  }

  /* 2x2グリッドボタン */
  .choices-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .choices-grid .choice-btn {
    min-width: 0;
    flex: none;
    width: 100%;
    font-size: 16px;
    padding: 16px 10px;
  }
  .zip-row { display:flex; flex-direction:column; gap:10px; }
  .zip-input-row { display:flex; gap:8px; }
  .zip-input {
    flex:1; border:2px solid #ddd; border-radius:12px;
    padding:16px 18px; font-size:20px; font-family:'Noto Sans JP',sans-serif;
    outline:none; background:#f9f9f9; color:#1a1a1a;
    letter-spacing:3px; font-weight:700;
  }
  .zip-result {
    border:2px solid #ddd; border-radius:12px; padding:14px 18px;
    font-size:17px; background:#f9f9f9; color:#333;
    font-weight:700; min-height:54px;
  }
  .zip-result.found { border-color:#4CAF50; background:#f1f8e9; color:#2e7d32; }
  .zip-result.error { border-color:#f44336; background:#ffeaea; color:#c62828; }
  .zip-detail-input {
    width:100%; border:2px solid #ddd; border-radius:12px;
    padding:16px 18px; font-size:18px; font-family:'Noto Sans JP',sans-serif;
    outline:none; background:#f9f9f9; color:#1a1a1a;
  }
  .zip-detail-input:focus { border-color:var(--red); background:#fff; }