/* AI 電子名片生成器／名片需求小助手 共用樣式（鍛造所鐵灰＋古銅色系） */
:root{--iron:#333735;--brass:#b68a4b;--brass-soft:#eee3cf;--paper:#f7f3eb;--paper-2:#fffdf8;--ink:#252925;--muted:#73766f;--line:rgba(49,53,51,.18);--green:#06c755;--ok:#596e61}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;background:#e9e5dc;color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased}
button,textarea,input{font-family:inherit}
a{color:#7d6039}
.nc-top{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:14px;padding:10px 20px;background:var(--iron);color:#eee8dd;border-bottom:1px solid #5e625f}
.nc-top .brand{font:800 12px/1 ui-monospace,monospace;letter-spacing:.14em;color:#d4b57d;text-decoration:none;display:flex;align-items:center;gap:8px}
.nc-top .brand img{width:22px;height:22px}
.nc-top .crumb{font-size:13px;color:#c9c4b8}
.nc-top .crumb b{color:#fff}
.nc-top .save{margin-left:auto;font-size:12px;color:#cfe3d3;background:rgba(89,110,97,.35);border:1px solid rgba(89,110,97,.7);padding:4px 12px;border-radius:999px;white-space:nowrap}
.nc-top .save::before{content:"●";color:#8fd19e;margin-right:6px}
.nc-top .save.dirty::before{color:#e3b04b}
.nc-layout{display:grid;grid-template-columns:400px 1fr;gap:0;min-height:calc(100vh - 47px)}
@media(max-width:960px){.nc-layout{grid-template-columns:1fr}.nc-top .crumb{display:none}}

/* ── 聊天 ── */
.nc-chat{background:var(--paper);border-right:1px solid var(--line);display:flex;flex-direction:column;position:sticky;top:47px;height:calc(100vh - 47px)}
@media(max-width:960px){.nc-chat{position:static;height:auto;min-height:70vh;border-right:0;border-bottom:1px solid var(--line)}}
.nc-chat-head{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);background:#f1ece2}
.nc-chat-head b{display:block;font-size:15px}
.nc-status{font-size:11.5px;color:var(--ok)}
.nc-avatar-bot{width:40px;height:40px;border-radius:999px;background:#333735;display:grid;place-items:center;font-size:20px;flex:none}
.nc-gem{margin-left:auto;border:1px solid #c5a675;background:#eee3cf;color:#6e5431;font-size:11.5px;font-weight:700;padding:6px 10px;cursor:pointer;border-radius:999px}
.nc-log{flex:1;overflow:auto;padding:14px 12px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.nc-msg{max-width:92%;padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.55;position:relative}
.nc-msg.bot{align-self:flex-start;background:#fffdf8;border:1px solid var(--line);border-top-left-radius:4px}
.nc-msg.bot.live{border-color:#b68a4b;box-shadow:inset 3px 0 #b68a4b}
.nc-msg.bot.done{background:#e6ebe6;border-color:#b8c4bb}
.nc-msg.bot p{margin:0}
.nc-msg.bot .q{font-weight:800}
.nc-msg.bot .hint{font-size:12px;color:var(--muted);margin-top:4px}
.nc-msg.me{align-self:flex-end;background:#333735;color:#f1eee7;border-top-right-radius:4px;display:flex;gap:8px;align-items:flex-start;font-weight:700}
.nc-msg.me i{font-weight:400;color:#bbb}
.nc-edit{flex:none;border:0;background:rgba(255,255,255,.12);color:#f1eee7;width:26px;height:26px;border-radius:999px;cursor:pointer;font-size:13px}
.nc-edit:hover{background:#b68a4b;color:#1e1a12}
.nc-input{border-top:1px solid var(--line);padding:10px 12px 12px;background:#f1ece2}
.nc-opts{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.nc-opt{border:1px solid #c9c3b7;background:#fffdf8;color:#252925;font-size:12.5px;font-weight:700;padding:6px 11px;cursor:pointer;border-radius:999px;text-align:left}
.nc-opt:hover{border-color:#b68a4b;background:#fff}
.nc-opt.ai{background:#e6ebe6;border-color:#b8c4bb;color:#3f5146}
.nc-row{display:flex;gap:8px;align-items:flex-end}
.nc-row textarea{flex:1;resize:vertical;min-height:44px;border:1px solid #c9c3b7;background:#fffdf8;padding:9px 12px;font-size:14px;border-radius:10px;color:var(--ink)}
.nc-row textarea:focus{outline:none;border-color:#b68a4b;box-shadow:0 0 0 3px rgba(182,138,75,.14)}
.nc-row textarea:disabled{background:#ebe6dc;color:#999}
.nc-send{width:44px;height:44px;border-radius:999px;border:0;background:#333735;color:#fff;font-size:20px;font-weight:900;cursor:pointer;flex:none}
.nc-send:hover{background:#b68a4b;color:#1e1a12}
.nc-tools{display:flex;gap:6px;align-items:center;margin-top:8px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.nc-tools button{border:1px solid #d0cbc1;background:transparent;color:#5c5f5a;font-size:11.5px;padding:4px 10px;cursor:pointer;border-radius:999px}
.nc-tools button:hover{border-color:#b68a4b;color:#6e5431}
.nc-tools span{margin-left:auto}

/* ── 右側工作區 ── */
.nc-main{padding:22px 26px 60px;max-width:1120px}
@media(max-width:960px){.nc-main{padding:18px 14px 50px}}
.nc-sec{background:rgba(248,245,238,.96);border:1px solid var(--line);padding:18px 20px;margin-bottom:18px;box-shadow:0 14px 34px rgba(45,48,46,.07)}
.nc-sec h2{margin:0;font-size:18px;display:flex;align-items:center;gap:8px;color:#303431}
.nc-sec h2 .k{font:800 10px/1 ui-monospace,monospace;letter-spacing:.14em;background:#333735;color:#d4b57d;padding:4px 8px}
.nc-sec .lede{margin:4px 0 14px;font-size:13px;color:var(--muted)}
.nc-sec-head{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}
.nc-sec-head .sp{flex:1}
.nc-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid #c8c1b4;background:#fffdf8;color:#303431;font-size:13.5px;font-weight:800;padding:10px 16px;cursor:pointer;text-decoration:none;white-space:nowrap}
.nc-btn:hover{border-color:#b68a4b;background:#fff}
.nc-btn.primary{background:#333735;border-color:#333735;color:#f1eee7}
.nc-btn.primary:hover{background:#4a4f4c}
.nc-btn.brass{background:#b68a4b;border-color:#b68a4b;color:#1e1a12}
.nc-btn.green{background:var(--green);border-color:var(--green);color:#fff}
.nc-btn.done{background:var(--ok)!important;border-color:var(--ok)!important;color:#fff!important}
.nc-btn:disabled{opacity:.45;cursor:not-allowed}
.nc-btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.nc-btn-row .grow{flex:1;justify-content:center}
.nc-asset{display:flex;gap:14px;align-items:center;border:1px solid var(--line);background:#fffdf8;padding:12px 14px;max-width:460px}
.nc-asset img,.nc-asset .mono{width:72px;height:72px;border-radius:12px;object-fit:cover;background:#e6ebe6;display:grid;place-items:center;font-size:28px;font-weight:900;color:#3f5146;flex:none}
.nc-asset b{display:block;font-size:14px}
.nc-asset small{display:block;color:var(--muted);font-size:12px;word-break:break-all;max-height:36px;overflow:hidden}
.nc-asset .links{margin-top:6px;display:flex;gap:10px;font-size:12.5px}
.nc-asset .links button{border:0;background:none;color:#7d6039;font-weight:700;cursor:pointer;padding:0}
textarea.nc-code{width:100%;min-height:260px;resize:vertical;border:1px solid #8f764f;background:#2d312f;color:#eee8dd;font:13px/1.6 ui-monospace,Menlo,Consolas,monospace;padding:14px;white-space:pre-wrap}
textarea.nc-code:focus{outline:none;border-color:#d4b57d}
.nc-note{font-size:12.5px;color:var(--muted);margin-top:8px}
.nc-note b{color:#755a34}
.nc-warn{background:#fff4e0;border:1px solid #e3b04b;color:#6e4a12;font-size:13px;padding:10px 12px;margin-top:10px}
.nc-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.nc-tab{border:1px solid #c8c1b4;background:#fffdf8;font-size:13px;font-weight:800;padding:8px 14px;cursor:pointer;color:#303431}
.nc-tab.on{background:#e6ebe6;border-color:#8ea597;color:#2f4a3a}
.nc-preview{background:#2b2f2d;border:1px solid #5e625f;padding:22px;display:flex;justify-content:center;min-height:300px}
.nc-preview iframe{width:min(430px,100%);height:760px;border:0;background:#fff;border-radius:22px;box-shadow:0 30px 60px rgba(0,0,0,.45)}
.nc-preview .empty{color:#bbb;font-size:14px;text-align:center;align-self:center}
.nc-hist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.nc-hist li{display:flex;gap:10px;align-items:center;border:1px solid var(--line);background:#fffdf8;padding:8px 12px;font-size:13px}
.nc-hist li b{font-family:ui-monospace,monospace;font-weight:700}
.nc-hist li .sp{flex:1;color:var(--muted)}
.nc-hist li button{border:1px solid #c8c1b4;background:#fff;font-size:12px;padding:4px 10px;cursor:pointer}
.nc-field{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.nc-field label{font-size:13px;font-weight:800;color:#76603f}
.nc-field input{flex:1;min-width:220px;border:1px solid #c9c3b7;background:#fffdf8;padding:9px 12px;font-size:14px}
.nc-field input:focus{outline:none;border-color:#b68a4b}

/* Flex 預覽 */
.nc-flex{display:flex;gap:12px;overflow-x:auto;padding:16px;background:#8fa3b8;border:1px solid #6b7f92}
.nc-bubble{flex:none;width:300px;border-radius:16px;overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,.25);font-size:13px;display:flex;flex-direction:column}
.nc-bubble .hero{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.nc-bubble .body{padding:18px;flex:1}
.nc-bubble .body p{margin:0 0 6px;line-height:1.5}
.nc-bubble .row{display:flex;gap:10px;align-items:center;margin:8px 0}
.nc-bubble .num{width:26px;height:26px;border-radius:999px;display:grid;place-items:center;font-weight:900;font-size:12px;flex:none}
.nc-bubble .tile{border-radius:10px;padding:10px 12px;margin-top:8px}
.nc-bubble .foot{padding:12px;display:flex;flex-direction:column;gap:8px}
.nc-bubble .fb{display:block;text-align:center;border-radius:8px;padding:9px;font-weight:800;font-size:13px;text-decoration:none}
.nc-alt{font-size:12px;color:#dfe7ee;background:#5a6d80;padding:8px 12px;margin-top:0}

/* 獨立版需求單 */
.nc-brief{white-space:pre-wrap;font-size:14px;line-height:1.7;background:#fffdf8;border:1px solid var(--line);padding:16px 18px}
.nc-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin:0;padding:0;list-style:none}
.nc-steps li{border:1px solid var(--line);background:#fffdf8;padding:12px 14px;font-size:13px}
.nc-steps li span{display:block;font:800 11px/1 ui-monospace,monospace;color:#b68a4b;margin-bottom:6px;letter-spacing:.12em}
.nc-hero{padding:26px 26px 6px}
.nc-hero h1{margin:0;font-size:28px;letter-spacing:-.03em;color:#303431}
.nc-hero p{margin:6px 0 0;color:var(--muted);font-size:14px;max-width:640px}
.nc-foot{text-align:center;color:var(--muted);font-size:12px;padding:20px}
.nc-foot b{color:#755a34}
.nc-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#333735;color:#f1eee7;padding:10px 18px;font-size:13px;border:1px solid #b68a4b;z-index:99;opacity:0;pointer-events:none;transition:.2s}
.nc-toast.on{opacity:1}
.nc-gem:disabled{opacity:.5;cursor:not-allowed}
