/* ========== F.R.A.N. System Styles v6.9.30 ========== */

/* FRAN Sub-Navigation */
.fran-subnav{display:flex;gap:0;background:var(--c-surface);border-radius:var(--r-lg);padding:4px;margin-bottom:16px}
.fran-subnav-item{flex:1;text-align:center;padding:10px 0;font-size:var(--fs-small);font-weight:500;color:var(--c-fg-3);border-radius:var(--r-md);cursor:pointer;transition:all var(--dur-base) var(--ease-out);min-height:48px;display:flex;align-items:center;justify-content:center}
.fran-subnav-item.act{background:var(--c-primary);color:#fff;font-weight:700}

/* FRAN Page Container */
.fran-page{display:none}
.fran-page.act{display:block}

/* === 驾驶舱 === */
.fran-section-label{font-size:var(--fs-small);color:var(--c-fg-2);margin:0 0 10px;font-weight:600;letter-spacing:0.04em}

/* 状态扫描 */
.fran-status-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px}
.fran-status-btn{background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:16px 8px;text-align:center;cursor:pointer;transition:all var(--dur-base) var(--ease-out);min-height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.fran-status-btn .emoji{font-size:28px;line-height:1}
.fran-status-btn .label{font-size:var(--fs-tiny);color:var(--c-fg-3)}
.fran-status-btn.act{border-color:var(--c-primary);background:var(--c-accent);transform:translateY(-2px);box-shadow:var(--shadow-2)}
.fran-status-btn.act .label{color:var(--c-primary);font-weight:700}

/* 火种确认 */
.fran-spark-grid{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.fran-spark-btn{background:var(--c-surface);border:1.5px solid var(--c-border);border-radius:var(--r-md);padding:14px 16px;display:flex;align-items:center;gap:12px;cursor:pointer;transition:all var(--dur-base) var(--ease-out);min-height:52px}
.fran-spark-btn .spark-ic{font-size:22px;width:32px;text-align:center;flex-shrink:0}
.fran-spark-btn .spark-text{flex:1;font-size:var(--fs-body);color:var(--c-fg)}
.fran-spark-btn .spark-check{font-size:18px;color:var(--c-success);opacity:0;transition:opacity var(--dur-base)}
.fran-spark-btn.lit{border-color:var(--c-success);background:rgba(123,160,122,0.08)}
.fran-spark-btn.lit .spark-check{opacity:1}
.fran-spark-btn.lit .spark-text{color:var(--c-success)}
.fran-spark-btn:disabled{opacity:0.4;cursor:not-allowed}

/* 护盾开启 */
.fran-shield-card{background:var(--c-surface);border-radius:var(--r-lg);padding:20px;text-align:center;border:1px solid var(--c-border);position:relative;overflow:hidden;min-height:100px;display:flex;flex-direction:column;justify-content:center}
.fran-shield-card .shield-ic{font-size:32px;margin-bottom:8px}
.fran-shield-card .shield-state{font-size:var(--fs-small);color:var(--c-fg-3);margin-bottom:6px}
.fran-shield-card .shield-quote{font-size:var(--fs-body);color:var(--c-fg);line-height:1.6;font-family:"Noto Serif SC",serif}

/* FRAN 头像 + 对话气泡（动态语录） */
.fran-avatar-card{display:flex;align-items:flex-start;gap:12px;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:14px;margin-bottom:18px}
.fran-avatar-face{width:48px;height:48px;border-radius:50%;flex-shrink:0;background:linear-gradient(135deg,var(--c-primary),var(--c-primary2));display:flex;align-items:center;justify-content:center;font-size:24px;line-height:1;box-shadow:var(--shadow-1)}
.fran-avatar-bubble{flex:1;min-width:0;background:var(--c-bg3);border-radius:4px 16px 16px 16px;padding:10px 14px}
.fran-avatar-name{font-size:var(--fs-tiny);font-weight:700;color:var(--c-primary);letter-spacing:0.06em;margin-bottom:4px}
.fran-avatar-tone{font-weight:400;color:var(--c-fg-3);letter-spacing:0}
.fran-avatar-talk{font-size:var(--fs-small);color:var(--c-fg);line-height:1.6;font-family:"Noto Serif SC",serif;transition:opacity var(--dur-base) var(--ease-out)}

/* 护盾语调（4 档切换） */
.fran-tone-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:8px}
.fran-tone-btn{background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-md);padding:12px 4px;text-align:center;cursor:pointer;transition:all var(--dur-base) var(--ease-out);min-height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.fran-tone-btn .tone-ic{font-size:22px;line-height:1}
.fran-tone-btn .tone-label{font-size:var(--fs-tiny);color:var(--c-fg-3)}
.fran-tone-btn.act{border-color:var(--c-primary);background:var(--c-accent);transform:translateY(-2px);box-shadow:var(--shadow-1)}
.fran-tone-btn.act .tone-label{color:var(--c-primary);font-weight:700}

/* === 引擎室 === */
.fran-engine-card{background:var(--c-surface);border-radius:var(--r-lg);padding:16px;margin-bottom:12px;border:1px solid var(--c-border)}
.fran-engine-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.fran-engine-title{display:flex;align-items:center;gap:8px;font-size:var(--fs-body);font-weight:600;color:var(--c-fg)}
.fran-engine-title .eng-ic{font-size:20px}
.fran-engine-value{font-size:var(--fs-h2);font-weight:700;font-variant-numeric:tabular-nums}
.fran-progress-bar{height:8px;background:var(--c-bg3);border-radius:var(--r-full);overflow:hidden;position:relative}
.fran-progress-fill{height:100%;border-radius:var(--r-full);transition:width 0.6s var(--ease-out);min-width:0}
.fran-progress-fill.body{background:linear-gradient(90deg,#7BA07A,#9BC89B)}
.fran-progress-fill.mind{background:linear-gradient(90deg,#7A9CB0,#9ABED0)}
.fran-progress-fill.wealth{background:linear-gradient(90deg,#C9A876,#E0C498)}
.fran-progress-fill.mission{background:linear-gradient(90deg,#A88FB5,#C8ABD5)}
.fran-progress-fill.relation{background:linear-gradient(90deg,#C98B8B,#E0A8A8)}
.fran-engine-detail{font-size:var(--fs-tiny);color:var(--c-fg-3);margin-top:6px}
.fran-no-data{text-align:center;color:var(--c-fg-muted);font-size:var(--fs-small);padding:20px}

/* === 工具箱 === */
.fran-panel{background:var(--c-surface);border-radius:var(--r-lg);margin-bottom:12px;border:1px solid var(--c-border);overflow:hidden}
.fran-panel-header{display:flex;align-items:center;justify-content:space-between;padding:16px;cursor:pointer;min-height:52px;user-select:none}
.fran-panel-title{display:flex;align-items:center;gap:8px;font-size:var(--fs-body);font-weight:600;color:var(--c-fg)}
.fran-panel-title .panel-ic{font-size:20px}
.fran-panel-arrow{font-size:14px;color:var(--c-fg-3);transition:transform var(--dur-base) var(--ease-out)}
.fran-panel.open .fran-panel-arrow{transform:rotate(180deg)}
.fran-panel-body{max-height:0;overflow:hidden;transition:max-height var(--dur-slow) var(--ease-out)}
.fran-panel.open .fran-panel-body{max-height:2000px}
.fran-panel-content{padding:0 16px 16px}

/* 表单 */
.fran-field{margin-bottom:14px}
.fran-field label{display:block;font-size:var(--fs-small);color:var(--c-fg-2);margin-bottom:6px;font-weight:500}
.fran-field label .required{color:var(--c-danger)}
.fran-input,.fran-textarea,.fran-select{width:100%;background:var(--c-input-bg);border:1px solid var(--c-input-border);border-radius:var(--r-md);padding:12px 14px;color:var(--c-fg);font-size:16px;outline:none;transition:border-color var(--dur-base);box-sizing:border-box;font-family:inherit}
.fran-input:focus,.fran-textarea:focus,.fran-select:focus{border-color:var(--c-primary)}
.fran-textarea{min-height:80px;resize:vertical;line-height:1.5}
.fran-input-row{display:flex;gap:10px;align-items:center}
.fran-input-row .fran-input{flex:1}
.fran-input-suffix{font-size:var(--fs-small);color:var(--c-fg-3);white-space:nowrap}

/* 复选框信号 */
.fran-signal-list{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.fran-signal-item{display:flex;align-items:center;gap:10px;background:var(--c-input-bg);border-radius:var(--r-md);padding:12px 14px;min-height:48px;cursor:pointer;transition:background var(--dur-base)}
.fran-signal-item:hover{background:var(--c-surface-2)}
.fran-signal-item input{width:20px;height:20px;accent-color:var(--c-primary);flex-shrink:0;cursor:pointer}
.fran-signal-item label{flex:1;font-size:var(--fs-body);color:var(--c-fg);cursor:pointer}

/* 状态选择 */
.fran-status-select{display:flex;gap:8px;margin-bottom:14px}
.fran-status-opt{flex:1;text-align:center;padding:12px 0;border-radius:var(--r-md);font-size:var(--fs-small);font-weight:500;cursor:pointer;border:2px solid var(--c-border);transition:all var(--dur-base) var(--ease-out);min-height:48px;display:flex;align-items:center;justify-content:center}
.fran-status-opt.act.yellow{border-color:#D4A574;background:rgba(212,165,116,0.12);color:#D4A574}
.fran-status-opt.act.red{border-color:var(--c-danger);background:rgba(201,116,116,0.12);color:var(--c-danger)}
.fran-status-opt.act.observe{border-color:var(--c-fg-3);background:var(--c-accent);color:var(--c-fg)}

/* 物理隔离协议 */
.fran-isolation{background:rgba(201,116,116,0.08);border:1px solid rgba(201,116,116,0.3);border-radius:var(--r-md);padding:14px;margin-top:12px;animation:franFadeIn 0.3s var(--ease-out)}
.fran-isolation-title{font-size:var(--fs-small);font-weight:700;color:var(--c-danger);margin-bottom:8px}
.fran-isolation-text{font-size:var(--fs-tiny);color:var(--c-fg-2);line-height:1.6}
@keyframes franFadeIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

/* 财富阶梯结果 */
.fran-ladder-result{margin-top:14px}
.fran-ladder-row{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.fran-ladder-label{font-size:var(--fs-small);color:var(--c-fg-2);width:100px;flex-shrink:0}
.fran-ladder-bar{flex:1;height:10px;background:var(--c-bg3);border-radius:var(--r-full);overflow:hidden}
.fran-ladder-fill{height:100%;border-radius:var(--r-full);transition:width 0.5s var(--ease-out)}
.fran-ladder-fill.f1{background:linear-gradient(90deg,#C9A876,#E0C498)}
.fran-ladder-fill.f2{background:linear-gradient(90deg,#A88FB5,#C8ABD5)}
.fran-ladder-fill.f3{background:linear-gradient(90deg,#7BA07A,#9BC89B)}
.fran-ladder-amount{font-size:var(--fs-small);font-weight:600;color:var(--c-fg);width:80px;text-align:right;flex-shrink:0;font-variant-numeric:tabular-nums}

/* 提交按钮 */
.fran-submit-btn{width:100%;background:linear-gradient(135deg,var(--c-primary),var(--c-primary-2));color:#fff;border:none;border-radius:var(--r-md);padding:14px;font-size:var(--fs-body);font-weight:600;cursor:pointer;min-height:48px;transition:opacity var(--dur-base);margin-top:8px}
.fran-submit-btn:active{opacity:0.8}
.fran-submit-btn:disabled{opacity:0.5;cursor:not-allowed}

/* 离线指示 */
.fran-offline-badge{display:inline-flex;align-items:center;gap:4px;font-size:var(--fs-tiny);color:var(--c-warning);background:rgba(212,165,116,0.1);padding:4px 10px;border-radius:var(--r-full)}
.fran-online-badge{display:inline-flex;align-items:center;gap:4px;font-size:var(--fs-tiny);color:var(--c-success);background:rgba(123,160,122,0.1);padding:4px 10px;border-radius:var(--r-full)}

/* 历史记录列表 */
.fran-history-list{margin-top:12px}
.fran-history-item{background:var(--c-input-bg);border-radius:var(--r-md);padding:12px;margin-bottom:8px;font-size:var(--fs-small)}
.fran-history-item .h-date{color:var(--c-fg-3);font-size:var(--fs-tiny);margin-bottom:4px}
.fran-history-item .h-content{color:var(--c-fg-2);line-height:1.5}

/* Toast */
.fran-toast{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);background:var(--c-elevated);color:var(--c-fg);padding:10px 20px;border-radius:var(--r-full);font-size:var(--fs-small);box-shadow:var(--shadow-3);z-index:9999;animation:franToastIn 0.3s var(--ease-out);white-space:nowrap}
@keyframes franToastIn{from{opacity:0;transform:translateX(-50%) translateY(10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
