/* ============ Section styles (3): Operator + Cockpit ============ */

/* ---------- AI OPERATOR simulator ---------- */
.op-grid{display:grid; grid-template-columns:.82fr 1.18fr; gap:28px; margin-top:52px; align-items:start}
@media(max-width:920px){ .op-grid{grid-template-columns:1fr; gap:20px} }

.scn-list{display:flex; flex-direction:column; gap:9px}
.scn-btn{display:flex; align-items:center; gap:13px; text-align:left; padding:15px 17px; border-radius:16px; border:1px solid var(--glass-line); background:var(--glass); -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur); cursor:pointer; transition:.22s cubic-bezier(.4,0,.2,1); box-shadow:var(--sh-1), var(--glass-inset)}
.scn-btn:hover{transform:translateY(-2px); box-shadow:var(--sh-2), var(--glass-inset)}
.scn-btn.on{border-color:#fff; background:#fff; box-shadow:var(--sh-2), var(--glass-inset)}
.scn-dot{width:9px;height:9px;border-radius:50%; flex-shrink:0}
.scn-dot.neutral{background:var(--ink-4)} .scn-dot.accent{background:var(--accent)}
.scn-dot.warn{background:var(--warn)} .scn-dot.risk{background:var(--risk)} .scn-dot.ok{background:var(--success)}
.scn-btn .sk{font-size:14px; font-weight:600; letter-spacing:-.01em}
.scn-btn .sn{font-size:11.5px; color:var(--ink-3); margin-top:1px}

.call{background:var(--glass); -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur); border:1px solid var(--glass-line); border-radius:var(--radius-lg); box-shadow:var(--sh-3), var(--glass-inset); overflow:hidden}
.call-top{display:flex; align-items:center; justify-content:space-between; padding:16px 22px; border-bottom:1px solid var(--glass-line); background:rgba(255,255,255,.4)}
.call-who{display:flex; align-items:center; gap:11px}
.call-body{padding:24px 22px}
.call-meta{display:flex; flex-wrap:wrap; gap:9px; margin-bottom:18px}
.bubble{display:flex; gap:12px; align-items:flex-start}
.bubble .bt{background:rgba(255,255,255,.55); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:1px solid var(--glass-line); border-radius:6px 16px 16px 16px; padding:15px 18px; font-size:15px; line-height:1.5; color:var(--ink); font-weight:500; flex:1}
.verdict{display:flex; align-items:center; gap:11px; margin-top:18px; padding:15px 18px; border-radius:14px; font-size:14.5px; font-weight:700}
.verdict.ok{background:var(--success-soft); color:var(--success)}
.verdict.accent{background:var(--accent-soft); color:var(--accent-700)}
.verdict.warn{background:var(--warn-soft); color:var(--warn)}
.verdict.risk{background:var(--risk-soft); color:var(--risk)}
.call-mean{font-size:13.5px; color:var(--ink-2); line-height:1.55; margin-top:14px}
.logbox{margin-top:16px; border-top:1px solid var(--glass-line); padding-top:14px}
.logbox .lh{font-family:var(--mono); font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); margin-bottom:10px}
.logline{font-family:var(--mono); font-size:12px; line-height:1.85; color:var(--ink-2); display:flex; gap:8px; align-items:baseline; opacity:0; transform:translateY(4px); animation:logIn .4s forwards}
@keyframes logIn{to{opacity:1; transform:none}}
.logline .lk{color:var(--accent-700); flex-shrink:0}
.logline.block .lk{color:var(--risk)}

/* ---------- OPERATOR COCKPIT (deep) ---------- */
.ck-toggle{display:inline-flex; padding:4px; gap:3px; background:var(--surface-3); border:1px solid var(--border); border-radius:12px; margin-bottom:30px}
.ck-toggle .seg-btn.on.safe{color:var(--accent-700)}
.cockpit{display:grid; grid-template-columns:.78fr 1.22fr; gap:0; background:var(--glass); -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur); border:1px solid var(--glass-line); border-radius:var(--radius-lg); box-shadow:var(--sh-3), var(--glass-inset); overflow:hidden; min-height:430px}
@media(max-width:860px){ .cockpit{grid-template-columns:1fr} }
.ck-left{padding:22px; border-right:1px solid var(--glass-line); background:rgba(255,255,255,.4)}
@media(max-width:860px){ .ck-left{border-right:0; border-bottom:1px solid var(--glass-line)} }
.ck-right{padding:22px; position:relative}
.ck-caller{display:flex; align-items:center; gap:13px; margin-bottom:18px}
.ck-av{width:50px;height:50px;border-radius:13px; display:grid; place-items:center; color:#fff; font-weight:700; font-size:16px; font-family:var(--mono); background:linear-gradient(150deg,var(--accent),var(--accent-700)); flex-shrink:0}
.ck-field{padding:11px 0; border-bottom:1px dashed var(--border)}
.ck-field:last-child{border-bottom:0}
.ck-field .fk{font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3)}
.ck-field .fv{font-size:14px; font-weight:600; color:var(--ink); margin-top:3px}
.ck-blind{display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; height:100%; min-height:340px; color:var(--ink-3); gap:14px; padding:30px}
.ck-blind .bigring{width:64px;height:64px;border-radius:50%; border:2px solid var(--border-2); display:grid; place-items:center; color:var(--ink-4); animation:ring 1.6s ease-in-out infinite}
@keyframes ring{0%,100%{box-shadow:0 0 0 0 var(--surface-3)}50%{box-shadow:0 0 0 10px var(--surface-3)}}
.ck-skel{height:13px; border-radius:5px; background:var(--surface-3); margin-top:9px}
.ck-block{margin-bottom:16px}
.ck-label{font-family:var(--mono); font-size:10.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); margin-bottom:9px}
.ck-phrase{background:var(--accent-soft); border:1px solid var(--accent-line); border-radius:13px; padding:14px 16px; font-size:15px; line-height:1.5; color:var(--accent-700); font-weight:500}
.ck-do{display:flex; flex-direction:column; gap:7px}
.ck-do .di{display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--ink); font-weight:500}
.ck-do .di .dk{width:8px;height:8px;border-radius:50%; flex-shrink:0}
.ck-do .di .dk.ok{background:var(--success)}
.ck-cols{display:grid; grid-template-columns:1fr 1fr; gap:18px}
@media(max-width:560px){ .ck-cols{grid-template-columns:1fr} }
.donot{display:flex; flex-direction:column; gap:7px}
.donot-item{border:1px solid var(--glass-line); background:rgba(255,255,255,.45); border-radius:11px; overflow:hidden; transition:.16s}
.donot-item .dh{display:flex; align-items:center; gap:10px; padding:10px 12px; cursor:pointer; font-size:13px; font-weight:500; color:var(--ink)}
.donot-item .dh .dk{width:8px;height:8px;border-radius:50%; background:var(--risk); flex-shrink:0}
.donot-item .dh .cx{margin-left:auto; color:var(--ink-4); font-size:18px; font-weight:400; line-height:1; flex-shrink:0}
.donot-rule{overflow:hidden; animation:donotIn .2s ease}
@keyframes donotIn{from{opacity:0}to{opacity:1}}
.donot-rule .inner{padding:2px 12px 11px 30px; font-family:var(--mono); font-size:11.5px; line-height:1.55; color:var(--ink-2)}
.ck-warn{padding:12px 15px; border-radius:12px; background:var(--risk-soft); border:1px solid var(--risk-line); color:var(--risk); font-size:13px; font-weight:500; margin-top:4px; line-height:1.45}
.src-chips{display:flex; flex-wrap:wrap; gap:7px}
.src-chip{font-size:12.5px; font-weight:500; padding:8px 13px; border-radius:100px; background:rgba(255,255,255,.5); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); border:1px solid var(--glass-line); color:var(--ink-2); cursor:pointer; transition:.15s}
.src-chip:hover{color:var(--accent-700)}
.src-chip.on{background:var(--accent-soft); border-color:var(--accent-line); color:var(--accent-700)}
.src-reveal{font-family:var(--mono); font-size:11.5px; color:var(--ink-2); margin-top:9px; padding:10px 13px; background:rgba(255,255,255,.5); border:1px solid var(--glass-line); border-radius:11px}
.everything{display:flex; flex-wrap:wrap; gap:6px; margin-top:9px}
.ev-chip{font-size:11.5px; font-weight:500; padding:5px 9px; border-radius:7px; background:var(--surface-3); border:1px solid var(--border); color:var(--ink-3); font-family:var(--mono)}
.keyphrase{margin-top:26px; font-size:clamp(17px,1.6vw,22px); line-height:1.5; font-weight:500; color:var(--ink); max-width:62ch; text-wrap:pretty}
.keyphrase b{color:var(--accent-700); font-weight:600}
