:root {
  --ai-ink:#29251f;
  --ai-muted:#7c7469;
  --ai-green:#2e4930;
  --ai-green-soft:#edf3e7;
  --ai-gold:#e9bd5c;
  --ai-berry:#a92f55;
  --ai-berry-dark:#86213f;
  --ai-line:#e8dfd2;
  --ai-surface:#fff;
  --ai-wash:#faf7f2;
  --ai-shadow:0 14px 38px rgba(55,45,33,.08);
}
* { box-sizing:border-box; }
body { background:#f7f4ef; color:var(--ai-ink); }
.ai-settings-main { padding-bottom:92px; }
.ai-secure { display:inline-flex; align-items:center; gap:8px; padding:9px 13px; border:1px solid #cbd8c2; border-radius:999px; background:#f1f6ec; color:#3d5a3d; font-size:12px; font-weight:800; }
.ai-secure svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; }
.settings-subnav { display:flex; align-items:center; gap:5px; margin:15px 0 22px; padding:6px; border:1px solid var(--ai-line); border-radius:16px; background:#fffaf3; box-shadow:0 6px 22px rgba(58,47,34,.04); overflow:auto; }
.settings-subnav a { min-height:43px; padding:0 17px; border-radius:11px; color:#5f584e; font-size:12px; font-weight:800; }
.settings-subnav a.active { color:#fff; background:linear-gradient(135deg,#47633e,#2e4930); box-shadow:0 6px 15px rgba(36,65,38,.2); }
.settings-subnav svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; }
.ai-hero { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(240px,310px); gap:28px; align-items:end; min-height:245px; padding:38px 40px; border-radius:28px; color:#fff; overflow:hidden; background:radial-gradient(circle at 82% 5%,rgba(235,190,93,.28),transparent 38%),linear-gradient(135deg,#193a2a,#314d2d 62%,#746f37); box-shadow:0 20px 44px rgba(28,53,35,.17); }
.ai-hero::after { content:""; position:absolute; width:330px; height:330px; right:-110px; bottom:-210px; border:1px solid rgba(255,255,255,.16); border-radius:50%; box-shadow:0 0 0 48px rgba(255,255,255,.025),0 0 0 94px rgba(255,255,255,.02); }
.ai-hero > * { position:relative; z-index:1; }
.ai-eyebrow,.ai-card > header span:first-child { display:block; margin-bottom:10px; color:#f3cc71; font-size:10px; font-weight:900; letter-spacing:.16em; }
.ai-hero h2 { max-width:850px; margin:0; font-size:clamp(30px,3.2vw,50px); line-height:1.02; letter-spacing:-.045em; }
.ai-hero p { max-width:780px; margin:17px 0 0; color:rgba(255,255,255,.77); font-size:15px; line-height:1.6; }
.ai-scope-control { padding:19px; border:1px solid rgba(255,255,255,.2); border-radius:18px; background:rgba(255,255,255,.09); backdrop-filter:blur(8px); }
.ai-scope-control label,.ai-scope-control small { display:block; }
.ai-scope-control label { margin-bottom:8px; color:#f4d484; font-size:10px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.ai-scope-control select { width:100%; min-height:45px; padding:0 12px; border:1px solid rgba(255,255,255,.28); border-radius:11px; outline:none; background:rgba(255,255,255,.96); color:#30412d; font-weight:800; }
.ai-scope-control small { margin-top:9px; color:rgba(255,255,255,.7); line-height:1.45; }
.ai-status-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:18px 0; }
.ai-status-grid article { display:flex; align-items:center; gap:15px; min-height:118px; padding:20px; border:1px solid var(--ai-line); border-radius:19px; background:var(--ai-surface); box-shadow:0 7px 24px rgba(55,45,33,.04); }
.ai-status-grid small,.ai-status-grid strong,.ai-status-grid p { display:block; }
.ai-status-grid small { color:var(--ai-muted); font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.ai-status-grid strong { margin-top:4px; font-size:20px; }
.ai-status-grid p { margin:3px 0 0; color:var(--ai-muted); font-size:12px; }
.ai-status-icon { display:grid; flex:0 0 48px; width:48px; height:48px; place-items:center; border-radius:15px; }
.ai-status-icon svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.75; }
.ai-status-icon.internal { color:#355637; background:#e7f0df; }
.ai-status-icon.public { color:#b86532; background:#fff0e2; }
.ai-status-icon.lifecycle { color:#95506a; background:#f8eaf0; }
.ai-settings-layout { display:grid; grid-template-columns:210px minmax(0,1fr); gap:20px; align-items:start; }
.ai-section-nav { position:sticky; top:16px; display:flex; flex-direction:column; padding:10px; border:1px solid var(--ai-line); border-radius:18px; background:#fff; box-shadow:var(--ai-shadow); }
.ai-section-nav a { position:relative; padding:13px 14px; border-radius:11px; color:#6b6359; font-size:13px; font-weight:800; line-height:1.35; transition:background .16s ease,color .16s ease,box-shadow .16s ease; }
.ai-section-nav a:hover,.ai-section-nav a:focus-visible { background:#f2f6ed; color:var(--ai-green); outline:none; }
.ai-section-nav a.is-active,.ai-section-nav a[aria-current="location"] { color:#29482e; background:linear-gradient(135deg,#eaf2e5,#f3f6ee); box-shadow:inset 3px 0 #5f7b53; }
.ai-settings-form { display:grid; gap:18px; min-width:0; }
.ai-card { scroll-margin-top:20px; padding:27px; border:1px solid var(--ai-line); border-radius:22px; background:#fff; box-shadow:var(--ai-shadow); }
.ai-card > header { display:flex; justify-content:space-between; gap:18px; align-items:start; margin-bottom:22px; }
.ai-card > header span:first-child { color:#a15d42; }
.ai-card h2 { margin:0; font-size:24px; letter-spacing:-.025em; }
.ai-card header p { max-width:760px; margin:7px 0 0; color:var(--ai-muted); line-height:1.55; }
.scope-lock,.phase-badge,.test-label { flex:0 0 auto; padding:7px 10px; border-radius:999px; background:#f7efe2; color:#8a6539!important; font-size:9px!important; font-weight:900!important; letter-spacing:.08em!important; }
.ai-switch-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.ai-switch-card { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:112px; padding:18px; border:1px solid #dbe5d5; border-radius:17px; background:#f6f9f3; cursor:pointer; }
.ai-switch-card.public-switch { border-color:#eedbd3; background:#fff7f3; }
.ai-switch-copy { display:flex; align-items:center; gap:13px; }
.ai-switch-copy > svg { width:27px; height:27px; fill:none; stroke:#496b46; stroke-width:1.7; }
.public-switch .ai-switch-copy > svg { stroke:#bd684c; }
.ai-switch-copy strong,.ai-switch-copy small { display:block; }
.ai-switch-copy small { margin-top:4px; color:var(--ai-muted); font-size:11px; line-height:1.4; }
.ai-switch-card input,.inline-toggle input { position:absolute; opacity:0; pointer-events:none; }
.ai-switch-card > i,.inline-toggle > i { position:relative; flex:0 0 48px; width:48px; height:27px; border-radius:999px; background:#cfcac1; transition:.2s; }
.ai-switch-card > i::after,.inline-toggle > i::after { content:""; position:absolute; width:21px; height:21px; left:3px; top:3px; border-radius:50%; background:#fff; box-shadow:0 2px 7px rgba(0,0,0,.15); transition:.2s; }
.ai-switch-card input:checked + i,.inline-toggle input:checked + i { background:#56794b; }
.ai-switch-card input:checked + i::after,.inline-toggle input:checked + i::after { transform:translateX(21px); }
.ai-warning { display:flex; gap:12px; margin-top:14px; padding:14px 16px; border:1px solid #f0ddae; border-radius:14px; background:#fff9e9; color:#68563a; }
.ai-warning svg,.ai-readonly-note svg { flex:0 0 20px; width:20px; height:20px; fill:none; stroke:#ad7b26; stroke-width:1.8; }
.ai-warning p { margin:0; font-size:12px; line-height:1.55; }
.ai-field-grid { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
.ai-field-grid > label,.language-field { display:flex; flex-direction:column; gap:7px; min-width:0; }
.ai-field-grid .wide { grid-column:1/-1; }
.ai-field-grid label > span,.language-field legend { color:#585046; font-size:11px; font-weight:850; }
.ai-field-grid input,.ai-field-grid select,.ai-field-grid textarea,.test-composer input { width:100%; min-height:46px; padding:11px 13px; border:1px solid #ddd3c6; border-radius:12px; outline:none; background:#fdfcf9; color:#2d2923; font:inherit; resize:vertical; }
.ai-field-grid textarea { line-height:1.5; }
.ai-field-grid textarea.ai-compact-textarea { height:46px; min-height:46px; overflow:auto; resize:vertical; }
.ai-field-grid input:focus,.ai-field-grid select:focus,.ai-field-grid textarea:focus,.test-composer input:focus { border-color:#778f69; box-shadow:0 0 0 3px rgba(91,122,77,.13); }
.ai-field-grid small { color:var(--ai-muted); font-size:10px; line-height:1.4; }
.critical textarea { border-color:#e4c9a6; background:#fffbf4; }
.language-field { position:relative; margin:0; padding:0; border:0; }
.language-field legend { margin-bottom:7px; padding:0; }
.language-menu { position:relative; }
.language-menu summary { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:46px; padding:8px 13px; border:1px solid #ddd3c6; border-radius:12px; outline:none; background:#fdfcf9; cursor:pointer; list-style:none; }
.language-menu summary::-webkit-details-marker { display:none; }
.language-menu summary > span { min-width:0; }
.language-menu summary strong,.language-menu summary small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.language-menu summary strong { color:#302b25; font-size:12px; }
.language-menu summary small { margin-top:2px; color:var(--ai-muted); font-size:10px; }
.language-menu summary > i { position:relative; flex:0 0 18px; width:18px; height:18px; }
.language-menu summary > i::before,.language-menu summary > i::after { position:absolute; top:8px; width:8px; height:2px; border-radius:2px; background:#696158; content:""; transition:transform .18s ease; }
.language-menu summary > i::before { left:1px; transform:rotate(45deg); }
.language-menu summary > i::after { right:1px; transform:rotate(-45deg); }
.language-menu[open] summary { border-color:#778f69; border-radius:12px 12px 8px 8px; box-shadow:0 0 0 3px rgba(91,122,77,.1); }
.language-menu[open] summary > i { transform:rotate(180deg); }
.language-menu-panel { position:absolute; z-index:35; top:calc(100% + 7px); right:0; left:0; display:grid; gap:7px; padding:9px; border:1px solid #d9d1c5; border-radius:15px; background:#fff; box-shadow:0 18px 42px rgba(47,39,29,.16); }
.language-toggle { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:54px; padding:8px 10px 8px 12px; border:1px solid transparent; border-radius:11px; background:#faf8f4; cursor:pointer; }
.language-toggle:hover { border-color:#dbe5d4; background:#f3f7ef; }
.language-toggle > span { min-width:0; }
.language-toggle strong,.language-toggle small { display:block; }
.language-toggle strong { color:#352f28; font-size:12px; }
.language-toggle small { margin-top:2px; color:var(--ai-muted); font-size:9px; }
.language-toggle input { position:absolute; opacity:0; pointer-events:none; }
.language-toggle > i,.website-logo-option > i { position:relative; flex:0 0 48px; width:48px; height:27px; border-radius:999px; background:#cfcac1; transition:background .2s ease; }
.language-toggle > i::after,.website-logo-option > i::after { position:absolute; top:3px; left:3px; width:21px; height:21px; border-radius:50%; background:#fff; box-shadow:0 2px 7px rgba(0,0,0,.15); content:""; transition:transform .2s ease; }
.language-toggle input:checked + i,.website-logo-option input:checked + i { background:#56794b; }
.language-toggle input:checked + i::after,.website-logo-option input:checked + i::after { transform:translateX(21px); }
.language-toggle:focus-within,.website-logo-option:focus-within { outline:3px solid rgba(91,122,77,.18); outline-offset:2px; }
.ai-modules,.ai-sources { margin:18px 0 0; padding:0; border:0; }
.ai-modules legend,.ai-sources legend { margin-bottom:11px; font-size:11px; font-weight:900; }
#moduleChoices { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; }
#moduleChoices label,.ai-sources label,.simple-check { display:flex; align-items:center; gap:8px; min-height:42px; padding:10px 11px; border:1px solid #e5ddd1; border-radius:11px; background:#fcfaf7; font-size:11px; font-weight:750; }
.ai-sources { display:flex; flex-wrap:wrap; gap:9px; }
.ai-readonly-note { display:flex; align-items:center; gap:9px; margin:16px 0 0; padding:12px 14px; border-radius:12px; background:#f4f7f0; color:#53624e; font-size:11px; }
.faq-builder { margin-top:23px; padding-top:20px; border-top:1px solid var(--ai-line); }
.faq-heading { display:flex; justify-content:space-between; align-items:center; gap:14px; }
.faq-heading h3,.faq-heading p { margin:0; }
.faq-heading p { margin-top:3px; color:var(--ai-muted); font-size:11px; }
.faq-heading button { min-height:39px; padding:0 13px; border:1px solid #d9cbb9; border-radius:10px; background:#fff; color:#5c4f40; font-weight:800; }
#faqList { display:grid; gap:10px; margin-top:14px; }
.faq-row { display:grid; grid-template-columns:1fr 1.5fr auto; gap:10px; padding:12px; border:1px solid #e8dfd2; border-radius:14px; background:#faf8f4; }
.faq-row input,.faq-row textarea { width:100%; min-height:42px; padding:10px; border:1px solid #ddd3c6; border-radius:9px; background:#fff; resize:vertical; }
.faq-row button { width:39px; height:39px; border:0; border-radius:9px; background:#f4e6e9; color:#9a2e4e; font-size:20px; }
.inline-toggle { display:flex; align-items:center; gap:12px; margin-bottom:18px; cursor:pointer; }
.inline-toggle span strong,.inline-toggle span small { display:block; }
.inline-toggle span small { margin-top:2px; color:var(--ai-muted); }
.appearance-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:22px; }
.website-logo-option { display:grid!important; grid-column:1/-1; grid-template-columns:86px minmax(0,1fr) auto; align-items:center; gap:14px!important; min-height:82px!important; padding:10px 12px!important; border:1px solid #ddd3c6!important; border-radius:14px!important; background:#fdfcf9!important; cursor:pointer; }
.website-logo-option:has(input:checked) { border-color:#b9cdb0!important; background:#f2f7ee!important; }
.website-logo-mark { display:grid; width:86px; height:58px; place-items:center; overflow:hidden; border:1px solid #e8dfd3; border-radius:11px; background:#fff; }
.website-logo-mark img { display:block; width:80px; height:52px; object-fit:contain; }
.website-logo-copy strong,.website-logo-copy small { display:block; }
.website-logo-copy strong { color:#363028; font-size:12px; }
.website-logo-copy small { margin-top:3px; color:var(--ai-muted); font-size:9px; line-height:1.35; }
.website-logo-option input { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); opacity:0; }
.widget-preview { display:flex; min-height:280px; flex-direction:column; justify-content:flex-end; align-items:flex-end; padding:20px; border-radius:20px; background:radial-gradient(circle at 10% 10%,#f8eee2,transparent 36%),linear-gradient(145deg,#f1f5eb,#f8f4ed); }
.widget-preview-panel { width:100%; margin-bottom:13px; padding:17px; border:1px solid rgba(55,71,50,.13); border-radius:16px; background:#fff; box-shadow:0 12px 30px rgba(37,50,36,.1); }
.widget-preview-brand { display:flex; align-items:center; gap:9px; min-height:20px; }
.widget-preview-logo { display:none; width:58px; height:35px; object-fit:contain; border:1px solid #eee7dd; border-radius:8px; background:#fff; }
.widget-preview.uses-website-logo .widget-preview-logo { display:block; }
.widget-preview-panel span { color:var(--ai-berry); font-size:9px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.widget-preview-panel strong { display:block; margin-top:7px; font-size:17px; }
.widget-preview-panel p { margin:7px 0 0; color:var(--ai-muted); font-size:11px; }
.widget-preview > button { display:flex; align-items:center; gap:8px; min-height:46px; padding:0 17px; border:0; border-radius:999px; background:var(--preview-accent,var(--ai-berry)); color:#fff; font-weight:900; box-shadow:0 10px 24px rgba(118,38,62,.22); }
.widget-preview > button svg { width:17px; height:17px; fill:none; stroke:currentColor; }
.test-card { border-color:#cfdbc5; background:linear-gradient(145deg,#fff,#f7faF3); }
.test-composer { display:grid; grid-template-columns:1fr auto; gap:10px; }
.test-composer button { min-height:48px; padding:0 18px; border:0; border-radius:12px; background:var(--ai-green); color:#fff; font-weight:900; }
.test-composer svg { width:17px; height:17px; vertical-align:-3px; fill:none; stroke:currentColor; }
.test-result { margin-top:14px; padding:17px; border:1px solid #d7e2cf; border-radius:15px; background:#fff; }
.test-result p { margin:8px 0; line-height:1.6; }
.test-result span { display:inline-block; margin:4px 6px 0 0; padding:5px 8px; border-radius:999px; background:#f2f5ee; color:#51664b; font-size:10px; font-weight:800; }
.history-list { display:grid; gap:9px; }
.history-item { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; padding:12px 14px; border:1px solid #e6ddd0; border-radius:13px; }
.history-item > span { display:grid; width:38px; height:38px; place-items:center; border-radius:11px; background:#f5efe6; color:#9b5d40; font-weight:900; }
.history-item strong,.history-item small { display:block; }
.history-item small { margin-top:3px; color:var(--ai-muted); }
.history-item button { min-height:35px; padding:0 10px; border:1px solid #dacdbc; border-radius:9px; background:#fff; color:#5b5043; font-weight:800; }
.ai-readiness { margin:0 0 16px; padding:14px 16px; border:1px solid #e4d7c6; border-radius:13px; background:#faf7f1; }
.ai-readiness.ready { border-color:#c9dbc2; background:#f0f7ed; }
.ai-readiness.blocked { border-color:#ead2b8; background:#fff7ec; }
.ai-readiness strong,.ai-readiness p { display:block; margin:0; }
.ai-readiness p { margin-top:4px; color:var(--ai-muted); font-size:12px; }
.ai-sticky-actions { position:sticky; bottom:10px; z-index:20; display:flex; align-items:center; gap:10px; padding:13px 14px; border:1px solid #ded3c3; border-radius:16px; background:rgba(255,252,247,.96); box-shadow:0 15px 45px rgba(54,44,31,.17); backdrop-filter:blur(14px); }
.ai-sticky-actions > div { min-width:0; margin-right:auto; }
.ai-sticky-actions strong,.ai-sticky-actions small { display:block; }
.ai-sticky-actions small { margin-top:2px; color:var(--ai-muted); }
.ai-button { min-height:43px; padding:0 15px; border-radius:11px; font-weight:900; cursor:pointer; }
.ai-button:disabled { opacity:.45; cursor:not-allowed; }
.ai-button.primary { border:0; background:var(--ai-berry); color:#fff; }
.ai-button.primary:hover:not(:disabled) { background:var(--ai-berry-dark); }
.ai-button.secondary { border:1px solid #d8cab8; background:#fff; color:#584d40; }
.ai-button.muted { border:1px solid #ecc7d2; background:#fff6f8; color:#992d50; }
.ai-page-footer { display:flex; justify-content:space-between; gap:20px; padding:22px 2px 0; color:#8a8176; font-size:10px; }
.ai-sidebar-note p { display:flex; gap:8px; color:rgba(255,255,255,.72); font-size:11px; line-height:1.5; }
.ai-sidebar-note svg { flex:0 0 18px; width:18px; height:18px; fill:none; stroke:#efca72; }
.publish-dialog { width:min(520px,calc(100vw - 30px)); padding:0; border:0; border-radius:22px; color:var(--ai-ink); box-shadow:0 30px 80px rgba(25,34,24,.32); }
.publish-dialog::backdrop { background:rgba(24,38,25,.65); backdrop-filter:blur(5px); }
.publish-dialog form { position:relative; padding:0; }
.publish-dialog form > span { color:#a25b3f; font-size:10px; font-weight:900; letter-spacing:.14em; }
.publish-dialog h2 { margin:9px 0; font-size:27px; }
.publish-dialog p { color:var(--ai-muted); line-height:1.55; }
.publish-dialog label { display:flex; gap:9px; margin:20px 0; padding:13px; border-radius:12px; background:#f8f5ef; font-weight:750; }
.publish-dialog .publish-dialog-actions { display:flex; justify-content:flex-end; gap:9px; }
.dialog-close { position:absolute; right:16px; top:16px; display:grid; width:38px; height:38px; place-items:center; border:1px solid #ded5c8; border-radius:50%; background:#fff; }
.dialog-close svg { width:17px; height:17px; fill:none; stroke:currentColor; }
.toast { position:fixed; z-index:80; left:50%; bottom:26px; transform:translate(-50%,25px); padding:12px 17px; border-radius:12px; background:#263f2b; color:#fff; opacity:0; pointer-events:none; transition:.2s; box-shadow:0 12px 35px rgba(0,0,0,.2); }
.toast.show { transform:translate(-50%,0); opacity:1; }
.scope-organization-only-disabled { opacity:.58; }
.scope-organization-only-disabled textarea,.scope-organization-only-disabled input { pointer-events:none; }
.language-field.scope-organization-only-disabled .language-menu { pointer-events:none; }

@media (max-width:1100px) {
  .ai-settings-layout { grid-template-columns:1fr; }
  .ai-section-nav { position:static; flex-direction:row; overflow:auto; }
  .ai-section-nav a { flex:0 0 auto; white-space:nowrap; }
  #moduleChoices { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:820px) {
  .ai-settings-main { padding-bottom:130px; }
  .ai-hero { grid-template-columns:1fr; padding:28px 24px; border-radius:22px; }
  .ai-status-grid,.ai-switch-grid,.appearance-layout { grid-template-columns:1fr; }
  .ai-field-grid { grid-template-columns:1fr; }
  .ai-field-grid .wide { grid-column:auto; }
  .language-menu-panel { position:static; margin-top:7px; box-shadow:0 12px 28px rgba(47,39,29,.12); }
  #moduleChoices { grid-template-columns:1fr 1fr; }
  .faq-row { grid-template-columns:1fr auto; }
  .faq-row textarea { grid-column:1/2; }
  .ai-sticky-actions { flex-wrap:wrap; bottom:5px; }
  .ai-sticky-actions > div { flex:1 1 100%; }
  .ai-sticky-actions .ai-button { flex:1 1 150px; }
  .ai-page-footer { flex-direction:column; }
}
@media (max-width:560px) {
  .ai-secure { display:none; }
  .ai-card { padding:20px; border-radius:17px; }
  .ai-card > header { flex-direction:column; }
  #moduleChoices { grid-template-columns:1fr; }
  .test-composer { grid-template-columns:1fr; }
  .ai-status-grid { grid-template-columns:1fr; }
  .website-logo-option { grid-template-columns:64px minmax(0,1fr) auto; }
  .website-logo-mark { width:64px; }
  .website-logo-mark img { width:58px; }
}
