/* 2026-10-17 「自分の会社で試す」scripted demo (partial try-demo). Tokens come from the launch-20260928 product stylesheet.
   Extra tints beyond the shared tokens: user bubble #e3eefc (product demo screenshot), keyword highlight #ffe58a (product demo screenshot). */
.try-section{background:#fff;padding-bottom:96px}
.try-section .japan-intro{margin-bottom:40px}
.try-section .japan-intro .copy{max-width:42em;word-break:keep-all}

/* ---------- picker: roles + scenes ---------- */
.try-picker{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}
.try-roles{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.try-label{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.06em}
.try-role-list{display:flex;gap:8px;flex-wrap:wrap}
.try-role{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:6px 16px;font-size:14px;line-height:1.6;transition:background .2s,border-color .2s,color .2s}
.try-role:hover{border-color:#b9cbe0}
.try-role[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.try-scenes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.try-scene{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:2px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:12px 16px 13px;min-width:0;transition:background .2s,border-color .2s}
.try-scene:hover{border-color:#b9cbe0}
.try-scene-top{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:22px}
.try-scene-no{font-size:15px;color:var(--muted);line-height:1}
.try-rec{font-size:10px;font-weight:600;color:var(--blue);background:#e8f2fd;border-radius:999px;padding:1px 8px;line-height:1.8}
.try-scene strong{font-size:16px;font-weight:600;line-height:1.5;color:var(--ink)}
.try-scene small{font-size:12px;color:var(--muted);line-height:1.6}
.try-scene[aria-selected=true]{background:#eef6fe;border-color:#9fcaf3}
.try-scene[aria-selected=true] .try-scene-no,.try-scene[aria-selected=true] strong{color:var(--blue)}

/* ---------- stage ---------- */
.try-stage{display:grid;grid-template-columns:320px minmax(0,1fr);gap:24px;align-items:stretch}
.try-brief{display:flex;flex-direction:column;background:var(--pale);border-radius:20px;padding:22px 24px 18px;min-width:0}
.try-brief-title{display:flex;gap:8px;font-size:13px;font-weight:600;color:var(--blue);line-height:1.7}
.try-brief-title span{flex:none}
.try-pain{font-size:18px;font-weight:700;line-height:1.65;letter-spacing:-.02em;color:var(--ink);margin-top:12px}
.try-brief-facts{margin:14px 0 0;display:grid;gap:10px}
.try-brief-facts dt{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.06em;margin-bottom:3px}
.try-brief-facts dd{margin:0;font-size:13.5px;line-height:1.8;color:var(--body)}
.try-cast{margin-top:auto;padding-top:14px}
.try-cast-h{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.04em;padding-top:12px;border-top:1px solid var(--line);margin-bottom:6px}
.try-cast ul{list-style:none;margin:0;padding:0;display:grid;gap:3px}
.try-cast .try-avatar-sm{width:20px;height:20px}
.try-cast li{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);line-height:1.5;min-width:0}
.try-cast li.try-st-on{color:var(--ink);font-weight:600}
.try-cast li:not(.try-st-on) .try-avatar{background:#e6ebf1;color:var(--muted)}

/* ---------- chat panel ---------- */
.try-chat{height:560px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 70px -34px rgba(31,64,97,.28);overflow:hidden;min-width:0}
.try-chat-head{flex:none;display:flex;align-items:center;gap:9px;height:54px;padding:0 18px;border-bottom:1px solid #edf0f4}
.try-chat-head strong{font-size:14px;font-weight:700;letter-spacing:.02em}
.try-mark{width:22px;height:22px;border-radius:7px;background:#eef6fe;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:0 4px}
.try-mark i{display:block;height:3px;border-radius:2px;background:var(--sky)}
.try-mark i:nth-child(1){background:#37d0b4;width:80%}
.try-mark i:nth-child(3){background:var(--blue);width:90%}
.try-pill{margin-left:auto;font-size:11px;color:var(--body);background:#f3f6fa;border:1px solid #e7ecf2;border-radius:999px;padding:2px 10px;line-height:1.6}
.try-chat-main{position:relative;flex:1;min-height:0;display:flex}
.try-chat-main::after{content:"";position:absolute;left:0;right:12px;bottom:0;height:34px;background:linear-gradient(rgba(255,255,255,0),#fff);pointer-events:none;opacity:0;transition:opacity .2s}
.try-chat-main.try-st-more::after{opacity:1}
.try-chat-body{flex:1;min-width:0;overflow-y:auto;overscroll-behavior:contain;padding:20px 22px 12px;font-size:14px;line-height:1.85;color:var(--ink);overflow-wrap:anywhere;container-type:inline-size}
.try-chat-body:focus-visible{outline-offset:-3px}
.try-chat-foot{flex:none;display:flex;align-items:center;gap:14px;padding:12px 14px 12px 16px;border-top:1px solid #edf0f4;background:#fbfcfe}
.try-composer{flex:1;min-width:0;border:1px solid var(--line);background:#fff;border-radius:14px;padding:7px 14px 8px;min-height:52px;display:flex;flex-direction:column;justify-content:center}
.try-composer small{display:block;font-size:10px;color:var(--muted);line-height:1.5}
.try-composer span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;line-height:1.6;color:var(--ink)}
.try-composer.try-st-empty{display:none}
.try-foot-actions{flex:none;display:flex;align-items:center;gap:14px;margin-left:auto}
.try-run{min-height:44px;padding:9px 22px;font-size:14px}
.try-run.try-st-blocked{opacity:.45;cursor:default}
.try-run.try-st-blocked:hover{background:var(--blue)}
.try-other{border:0;background:none;padding:0;color:var(--blue);font-size:13px;gap:6px;min-height:44px}
.try-other::after{font-size:20px}
.try-other:hover{text-decoration:underline;text-underline-offset:5px}

/* ---------- messages ---------- */
.try-msg{margin-bottom:16px;max-width:100%}
.try-msg.try-st-in{animation:try-in .32s var(--ease) both}
@keyframes try-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.try-bubble{border-radius:16px;padding:10px 15px;line-height:1.8}
.try-avatar{flex:none;width:30px;height:30px;border-radius:50%;background:#dbe9f8;color:#24527f;font-size:12px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;line-height:1}
.try-avatar-sm{width:22px;height:22px;font-size:10px}
.try-msg-team{display:flex;gap:10px;align-items:flex-start;max-width:86%}
.try-team-col{min-width:0}
.try-team-name{font-size:11px;color:var(--muted);margin-bottom:4px;line-height:1.5}
.try-msg-team .try-bubble{background:#f1f4f8;border-top-left-radius:5px}
.try-msg-user{display:flex;flex-direction:column;align-items:flex-end;margin-left:auto;max-width:84%}
.try-user-label{font-size:11px;color:var(--muted);margin-bottom:4px;line-height:1.5}
.try-msg-user .try-bubble{background:#e3eefc;border-top-right-radius:5px}
.try-msg-thinking{font-size:12px;color:var(--muted)}
.try-thinking-line{display:flex;align-items:center;gap:7px;line-height:1.6}
.try-thinking-ic{display:inline-flex;color:var(--blue)}
.try-thinking-ic .try-ic{width:15px;height:15px}
.try-dots{display:none;gap:3px;margin-left:2px}
.try-msg-thinking.try-st-pending .try-dots{display:inline-flex}
.try-dots i,.try-typing i{display:block;width:4px;height:4px;border-radius:50%;background:#9fb0c3;animation:try-blink 1s infinite}
.try-dots i:nth-child(2),.try-typing i:nth-child(2){animation-delay:.15s}
.try-dots i:nth-child(3),.try-typing i:nth-child(3){animation-delay:.3s}
@keyframes try-blink{0%,100%{opacity:.25}50%{opacity:1}}
.try-typing{display:flex;gap:4px;padding:8px 2px}
.try-typing i{width:6px;height:6px}
.try-sources{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.try-src{display:inline-flex;align-items:center;gap:5px;font-size:12px;line-height:1.5;color:var(--body);background:#f3f5f8;border:1px solid #e9edf2;border-radius:8px;padding:3px 9px}
.try-src .try-ic{flex:none;width:13px;height:13px;color:var(--sky)}
.try-src.try-st-fade{animation:try-fade .3s ease both}
@keyframes try-fade{from{opacity:0}to{opacity:1}}
.try-ic{width:14px;height:14px}
.try-chat-body mark{color:inherit;font-weight:600;background:linear-gradient(transparent 58%,#ffe58a 58%);padding:0 1px}

/* cards (result / tasks / draft) */
.try-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px 14px;box-shadow:0 10px 30px -24px rgba(31,64,97,.35)}
.try-card-title{display:flex;align-items:center;gap:7px;font-size:15px;font-weight:700;line-height:1.6;padding-bottom:10px;margin-bottom:4px;border-bottom:1px solid #edf0f4}
.try-card-title .try-ic{width:16px;height:16px;color:var(--blue)}
.try-sec{padding:9px 0;border-bottom:1px dashed #e6ebf1}
.try-sec:last-child{border-bottom:0}
.try-sec-h{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.03em;line-height:1.6;margin-bottom:2px}
.try-sec-c p,.try-option p{line-height:1.8}
.try-sec ul,.try-option ul{list-style:none;margin:0;padding:0}
.try-sec li,.try-option li{position:relative;padding-left:14px;line-height:1.8}
.try-sec li::before,.try-option li::before{content:"";position:absolute;left:2px;top:.8em;width:4px;height:4px;border-radius:50%;background:#9fb0c3}
@container (min-width:560px){
  .try-sec{display:grid;grid-template-columns:9.5em minmax(0,1fr);gap:14px}
  .try-sec .try-sec-h{margin:0;padding-top:3px}
  .try-sec-plain{display:block}
}
.try-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:10px 0;border-bottom:1px dashed #e6ebf1}
.try-option{background:var(--pale);border-radius:12px;padding:11px 13px}
.try-option:first-child{background:#eef6fe;box-shadow:inset 0 0 0 1px #cfe4fa}
.try-option .try-sec-h{color:var(--ink);font-size:12px;margin-bottom:4px}
@container (max-width:479px){.try-pair{grid-template-columns:1fr}}
.try-basis{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px}
.try-basis-label{font-size:11px;font-weight:600;color:var(--muted);margin-right:2px}
.try-src-link{background:#fff;color:var(--ink)}
.try-src-link .try-ic{color:var(--blue)}
.try-gate{display:flex;align-items:flex-start;gap:7px;font-size:12px;line-height:1.7;color:var(--body);margin-top:12px;padding-top:11px;border-top:1px solid #edf0f4}
.try-gate .try-ic{flex:none;width:15px;height:15px;color:var(--blue);margin-top:2px}

/* file chip (③) */
.try-file{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:9px 12px;margin:10px 0 4px;max-width:420px}
.try-file-ic{position:relative;flex:none;width:34px;height:40px;display:flex;align-items:center;justify-content:center;color:#c2410c;background:#fff4ec;border-radius:7px}
.try-file-ic .try-ic{width:20px;height:20px}
.try-file-ic b{position:absolute;bottom:-4px;font-size:8px;font-weight:700;background:#c2410c;color:#fff;border-radius:3px;padding:0 3px;line-height:1.5}
.try-file-name{min-width:0;font-size:13px;font-weight:600;line-height:1.5}
.try-file-name small{display:block;font-size:11px;font-weight:400;color:var(--muted)}

/* tasks */
.try-task-list{list-style:none;margin:6px 0 0;padding:0}
.try-task-list li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:baseline;gap:10px;padding:9px 0;border-bottom:1px solid #f0f3f6;line-height:1.7}
.try-task-list li:last-child{border-bottom:0}
.try-task-list-inline{margin:0}
.try-task-list-inline li{padding:3px 0;border:0}
.try-task-list-inline li::before{content:none}
.try-who{font-size:11px;font-weight:600;color:var(--blue);background:#eef6fe;border-radius:999px;padding:1px 9px;white-space:nowrap;line-height:1.7}
.try-task-due{font-size:12px;color:var(--muted);white-space:nowrap;text-align:right}
.try-task-note{display:flex;gap:7px;align-items:flex-start;font-size:12px;color:var(--muted);line-height:1.7;margin-top:8px}
.try-task-note .try-ic,.try-draft-note .try-ic{flex:none;width:14px;height:14px;margin-top:2px}

/* draft (mail) */
.try-draft{padding:16px 20px 16px}
.try-draft-top{display:flex;align-items:flex-start;gap:10px;padding-bottom:10px;border-bottom:1px solid #edf0f4}
.try-draft-ic{flex:none;display:inline-flex;width:30px;height:30px;border-radius:50%;background:#eef6fe;color:var(--blue);align-items:center;justify-content:center}
.try-draft-meta{flex:1;min-width:0;margin:0;font-size:12px;line-height:1.7}
.try-draft-meta div{display:flex;gap:8px}
.try-draft-meta dt{color:var(--muted);flex:none;width:3.6em}
.try-draft-meta dd{margin:0;color:var(--ink)}
.try-unsent{flex:none;font-size:11px;color:var(--body);background:#f3f6fa;border:1px solid #e7ecf2;border-radius:999px;padding:1px 10px;line-height:1.7;white-space:nowrap}
.try-draft-subject{font-size:14px;font-weight:600;margin:10px 0 8px;line-height:1.7}
.try-draft-subject span{font-size:11px;font-weight:500;color:var(--muted);margin-right:10px}
.try-draft-body{font-size:13px;line-height:2;color:var(--body)}
.try-draft-body p+p{margin-top:8px}
.try-draft-note{display:flex;gap:7px;align-items:flex-start;font-size:12px;line-height:1.7;color:var(--muted);margin-top:12px;padding-top:10px;border-top:1px solid #edf0f4}
.try-draft-note.try-gate{color:var(--body)}

/* decision (④ 森田さんの画面) */
.try-decision{border:1px solid #cfdbe8;border-radius:16px;overflow:hidden;max-width:440px;background:#fff;box-shadow:0 14px 34px -26px rgba(20,35,56,.45)}
.try-decision-bar{display:flex;align-items:center;gap:8px;background:var(--ink);color:#fff;font-size:12px;font-weight:600;padding:8px 14px;line-height:1.5}
.try-decision-bar .try-avatar{background:#fff;color:var(--ink)}
.try-decision-body{padding:14px 16px 16px}
.try-decision-label{display:inline-block;font-size:11px;font-weight:600;color:var(--blue);background:#eef6fe;border-radius:999px;padding:1px 10px;line-height:1.7}
.try-decision-main{font-size:17px;font-weight:700;margin-top:6px;line-height:1.6}
.try-decision-by,.try-decision-material{font-size:12px;color:var(--muted);line-height:1.8}
.try-inline-link{border:0;background:none;padding:0;color:var(--blue);font-size:12px;text-decoration:underline;text-underline-offset:3px}
.try-decision-action{margin-top:12px}
.try-approve{min-height:42px;padding:8px 20px;font-size:14px}
.try-approved{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:var(--blue)}
.try-approved .try-ic{width:18px;height:18px}
.try-approved-note{font-size:12px;color:var(--body);line-height:1.7;margin-top:2px}
.try-decision.try-st-approved{border-color:#9fcaf3}

/* ---------- closing ---------- */
.try-closing{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;margin-top:24px;padding:22px 28px;background:var(--pale);border-radius:20px}
.try-closing:not([hidden]){animation:try-in .4s var(--ease) both}
.try-closing-q{font-size:17px;font-weight:600;line-height:1.7;color:var(--ink);max-width:34em}
.try-closing-actions{flex:none;display:flex;gap:12px;flex-wrap:wrap}
.try-note{text-align:center;margin-top:20px}

/* ---------- responsive ---------- */
@media(max-width:1100px){
  .try-stage{grid-template-columns:290px minmax(0,1fr)}
  .try-pain{font-size:17px}
}
@media(max-width:820px){
  .try-section{padding-bottom:72px}
  .try-section .japan-intro{margin-bottom:30px}
  .try-scenes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .try-stage{grid-template-columns:1fr;gap:16px}
  .try-brief{background:none;border-radius:0;padding:0 2px}
  .try-pain{font-size:17px;margin-top:8px}
  .try-brief-facts{margin-top:10px;gap:8px}
  .try-brief-facts div{display:grid;grid-template-columns:auto 1fr;gap:10px}
  .try-brief-facts dt{margin:3px 0 0}
  .try-cast{display:none}
  .try-chat{height:480px}
  .try-closing{flex-direction:column;align-items:flex-start}
}
@media(max-width:580px){
  .try-section{padding-bottom:60px}
  .try-picker{gap:12px;margin-bottom:18px}
  .try-roles{gap:10px}
  .try-role{font-size:13px;padding:5px 13px}
  .try-scenes{gap:8px}
  .try-scene{padding:10px 12px 11px;border-radius:12px}
  .try-scene strong{font-size:14px}
  .try-scene small{font-size:11px}
  .try-brief-title{font-size:12px}
  .try-pain{font-size:16px}
  .try-brief-facts dd{font-size:13px}
  .try-chat{height:440px;border-radius:16px}
  .try-chat-head{height:46px;padding:0 14px}
  .try-chat-body{padding:14px 14px 8px;font-size:13px}
  .try-chat-foot{padding:10px 12px}
  .try-composer{display:none}
  .try-foot-actions{flex:1;justify-content:space-between}
  .try-msg-team,.try-msg-user{max-width:92%}
  .try-bubble{padding:9px 13px}
  .try-card{padding:14px 14px 12px}
  .try-card-title{font-size:14px}
  .try-draft{padding:14px}
  .try-draft-body{font-size:12.5px;line-height:1.95}
  .try-task-list li{grid-template-columns:auto minmax(0,1fr);gap:4px 8px}
  .try-task-due{grid-column:2;text-align:left}
  .try-closing{padding:20px 18px}
  .try-closing-q{font-size:15px}
  .try-closing-actions{width:100%;flex-direction:column}
  .try-closing-actions .btn{width:100%}
  .try-note{text-align:left;font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  .try-msg.try-st-in,.try-src.try-st-fade,.try-closing:not([hidden]){animation:none}
  .try-dots i,.try-typing i{animation:none;opacity:.6}
}
