:root {
  --ink: #17211f;
  --muted: #71807b;
  --line: #e4ebe7;
  --paper: #f7f9f7;
  --surface: #ffffff;
  --teal: #137a68;
  --teal-dark: #0d5b4e;
  --teal-soft: #e5f3ef;
  --orange: #d77842;
  --shadow: 0 16px 38px rgba(20, 53, 46, .08);
  --sidebar: #143d36;
  --sidebar-text: #e9f5f1;
  --sidebar-muted: #9fc4bb;
  --sidebar-subtle: #78a399;
  --accent-ring: rgba(19,122,104,.08);
  --accent-shadow: rgba(19,122,104,.18);
  --modal-overlay: rgba(12,38,33,.46);
  --modal-shadow: rgba(7,37,31,.22);
  --hero-bg: #f4faf7;
  --hero-border: #dceee7;
}

body[data-theme="violet"] { --ink: #241f2e; --muted: #7c7488; --line: #ebe6f0; --paper: #faf8fc; --teal: #7a4fc0; --teal-dark: #5f38a3; --teal-soft: #f0e9fa; --sidebar: #2f2445; --sidebar-text: #f5f0fb; --sidebar-muted: #c1afd9; --sidebar-subtle: #9e89ba; --accent-ring: rgba(122,79,192,.1); --accent-shadow: rgba(122,79,192,.2); --modal-overlay: rgba(35,25,52,.48); --modal-shadow: rgba(38,24,58,.22); --hero-bg: #faf7fd; --hero-border: #e9def5; --shadow: 0 16px 38px rgba(66,42,96,.09); }
body[data-theme="blue"] { --ink: #172334; --muted: #708092; --line: #e2e9f1; --paper: #f6f9fc; --teal: #286fc2; --teal-dark: #18559b; --teal-soft: #e7f0fb; --sidebar: #173653; --sidebar-text: #edf6ff; --sidebar-muted: #a8c7e3; --sidebar-subtle: #7fa6c8; --accent-ring: rgba(40,111,194,.1); --accent-shadow: rgba(40,111,194,.2); --modal-overlay: rgba(15,39,63,.48); --modal-shadow: rgba(14,43,72,.22); --hero-bg: #f3f8fd; --hero-border: #d9e8f6; --shadow: 0 16px 38px rgba(31,72,111,.09); }

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.app-shell { min-height: 100vh; display: flex; }
.sidebar { width: 238px; flex: 0 0 238px; background: var(--sidebar); color: var(--sidebar-text); display: flex; flex-direction: column; padding: 28px 18px 22px; transition: background .25s ease; }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 8px 45px; }
.brand-mark { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--sidebar-text); color: var(--sidebar); font-weight: 800; font-size: 19px; }
.brand-name { font-size: 14px; font-weight: 700; letter-spacing: .02em; }
.brand-subtitle { color: var(--sidebar-subtle); font: 500 9px/1 ui-monospace, "SFMono-Regular", Consolas, monospace; letter-spacing: .18em; margin-top: 4px; }
.nav-list { display: grid; gap: 24px; }
.nav-group { display: grid; gap: 6px; }
.nav-group-label { color: var(--sidebar-subtle); padding: 0 12px 7px; font: 500 8px ui-monospace, "SFMono-Regular", Consolas, monospace; letter-spacing: .16em; text-transform: uppercase; }
.nav-item { border: 0; border-radius: 9px; background: transparent; color: var(--sidebar-muted); padding: 12px 12px; text-align: left; font-size: 13px; display: flex; align-items: center; gap: 12px; }
.nav-item:hover, .nav-item.active { background: rgba(255,255,255,.12); color: #fff; }
.nav-icon { width: 19px; height: 19px; display: grid; place-items: center; flex: 0 0 19px; }.nav-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sidebar-footer { margin-top: auto; border-top: 1px solid rgba(255,255,255,.13); padding: 15px 0 0; color: var(--sidebar-muted); font-size: 11px; }
.storage-label { display: flex; align-items: center; gap: 8px; color: var(--sidebar-text); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #63d5ab; box-shadow: 0 0 0 4px rgba(99,213,171,.12); }
.account-wrap { position: relative; margin-top: 13px; }
.account-button { width: 100%; border: 0; border-radius: 10px; padding: 9px; display: flex; align-items: center; gap: 10px; color: var(--sidebar-text); background: rgba(255,255,255,.08); text-align: left; }
.account-button:hover, .account-button[aria-expanded="true"] { background: rgba(255,255,255,.14); }
.account-avatar { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 9px; display: grid; place-items: center; color: var(--sidebar); background: var(--sidebar-text); font-weight: 800; }
.account-copy { min-width: 0; display: grid; gap: 3px; flex: 1; }.account-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }.account-copy small { color: var(--sidebar-subtle); font-size: 9px; }
.account-chevron { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; transition: transform .2s ease; }.account-button[aria-expanded="true"] .account-chevron { transform: rotate(180deg); }
.account-menu { position: absolute; left: 0; right: 0; bottom: calc(100% + 8px); padding: 6px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); box-shadow: var(--shadow); z-index: 12; }
.account-menu-item { width: 100%; border: 0; border-radius: 7px; padding: 9px 10px; display: flex; align-items: center; gap: 9px; background: transparent; color: var(--ink); text-align: left; font-size: 11px; }.account-menu-item:hover { background: var(--teal-soft); }.account-menu-item .nav-icon { width: 16px; height: 16px; flex-basis: 16px; }.account-menu-item .nav-icon svg { width: 16px; height: 16px; }.account-menu-divider { height: 1px; background: var(--line); margin: 5px 4px; }.account-menu-danger { color: #b84f44; }
.main-content { flex: 1; max-width: 1440px; padding: 36px 52px 60px; margin: 0 auto; width: 100%; }
.topbar, .section-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 34px; }
.section-description { color: var(--muted); font-size: 12px; line-height: 1.7; margin-top: 9px; max-width: 620px; }
.eyebrow { color: var(--teal); font: 600 10px/1.2 "DM Mono", monospace; letter-spacing: .14em; text-transform: uppercase; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 30px; letter-spacing: -.04em; margin-top: 8px; }
h2 { font-size: 24px; letter-spacing: -.04em; margin-top: 8px; }
.topbar-actions, .toolbar-actions, .filter-group, .view-actions { display: flex; align-items: center; gap: 10px; }
.button { border: 1px solid transparent; border-radius: 7px; padding: 10px 15px; font-size: 12px; font-weight: 700; transition: .2s ease; }
.button-primary { background: var(--teal); color: white; box-shadow: 0 5px 12px var(--accent-shadow); }
.button-primary:hover { background: var(--teal-dark); transform: translateY(-1px); }
.button-ghost { background: transparent; border-color: var(--line); color: var(--ink); }
.button-ghost:hover { border-color: #b7cbc3; background: #fff; }
.button-danger { color: #b84f44; background: #fff6f5; border: 1px solid #f0d1cd; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 30px; }
.stat-card { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 18px 20px; position: relative; overflow: hidden; }
.stat-card::after { content: ""; position: absolute; right: -14px; bottom: -22px; width: 80px; height: 80px; border-radius: 50%; background: var(--teal-soft); }
.stat-label { color: var(--muted); font-size: 11px; }
.stat-value { font: 700 30px/1 "Manrope", sans-serif; margin-top: 11px; letter-spacing: -.06em; position: relative; z-index: 1; }
.stat-accent { color: var(--teal); }
.toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; }
.search-wrap { flex: 1; position: relative; max-width: 400px; }
.search-icon { position: absolute; left: 13px; top: 8px; color: #8ca29b; font-size: 22px; transform: rotate(-20deg); }
input, select, textarea { border: 1px solid var(--line); color: var(--ink); background: white; border-radius: 7px; outline: none; }
input:focus, select:focus, textarea:focus { border-color: var(--teal); box-shadow: 0 0 0 3px var(--accent-ring); }
.search-wrap input { width: 100%; padding: 11px 14px 11px 39px; font-size: 12px; background: #fff; }
select { padding: 10px 30px 10px 11px; font-size: 11px; min-width: 108px; }
.result-count { color: var(--muted); font-size: 11px; white-space: nowrap; }
.icon-button { width: 33px; height: 33px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--teal); font-size: 18px; }
.table-card { background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; box-shadow: var(--shadow); }
.table-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 810px; }
th { text-align: left; color: #91a099; background: #fbfcfb; font: 500 10px "DM Mono", monospace; letter-spacing: .08em; padding: 13px 18px; border-bottom: 1px solid var(--line); white-space: nowrap; }
td { padding: 17px 18px; border-bottom: 1px solid #eef2ef; font-size: 12px; vertical-align: middle; }
tr:last-child td { border-bottom: 0; }
.asset-cell { display: flex; align-items: center; gap: 11px; min-width: 240px; }
.asset-badge { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: var(--teal-soft); color: var(--teal); font-size: 14px; }
.asset-name, .asset-name-button { font-weight: 700; color: var(--ink); }
.asset-name-button { border: 0; background: transparent; padding: 0; text-align: left; font-size: 12px; }
.asset-name-button:hover { color: var(--teal); text-decoration: underline; }
.asset-id { color: #91a099; font: 10px "DM Mono", monospace; margin-top: 4px; }
.source-pill, .type-pill { display: inline-flex; align-items: center; gap: 5px; border-radius: 20px; padding: 5px 9px; font-size: 10px; white-space: nowrap; }
.entity-link { border: 0; cursor: pointer; }
.entity-link:hover { box-shadow: inset 0 0 0 1px currentColor; }
.source-pill.own { background: #fff0e7; color: #b86432; }
.source-pill.vendor { background: #e7f4f1; color: var(--teal); }
.type-pill { color: #677b73; background: #f0f3f1; }
.muted { color: var(--muted); }
.file-links { display: flex; gap: 6px; }
.file-state { border-radius: 5px; background: #f0f6f3; color: var(--teal); padding: 5px 7px; font-size: 10px; }
.file-state.empty { color: #b5c0bc; background: #f7f8f7; }
.row-action { border: 0; background: transparent; color: #8fa09a; font-size: 19px; padding: 6px; }
.row-action:hover { color: var(--teal); }
.empty-state { padding: 65px 20px; text-align: center; }
.empty-icon { color: var(--teal); font-size: 34px; }
.empty-state h3 { margin-top: 10px; font-size: 15px; }
.empty-state p { margin-top: 6px; color: var(--muted); font-size: 12px; }
.hidden { display: none !important; }
.view { display: none; }.active-view { display: block; }
.login-screen { min-height: 100vh; display: grid; place-items: center; padding: 28px; background: radial-gradient(circle at 18% 20%, var(--teal-soft), transparent 33%), linear-gradient(135deg, var(--paper) 0%, #fff 100%); }
.login-card { width: min(420px, 100%); padding: 36px 38px 28px; background: rgba(255,255,255,.94); border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 30px 80px var(--modal-shadow); }
.login-brand { display: flex; align-items: center; gap: 12px; }
.login-mark { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: var(--sidebar); color: var(--sidebar-text); font-size: 21px; font-weight: 800; }
.login-brand-name { color: var(--ink); font-size: 16px; font-weight: 800; letter-spacing: .01em; }
.login-brand-subtitle { color: var(--teal); font: 500 8px ui-monospace, "SFMono-Regular", Consolas, monospace; letter-spacing: .17em; margin-top: 4px; }
.login-heading { margin: 38px 0 25px; }.login-heading h1 { font-size: 27px; }.login-heading p { color: var(--muted); font-size: 12px; margin-top: 9px; }
.login-form { display: grid; gap: 15px; }.login-form .field input { padding: 12px; }.login-button { width: 100%; padding: 12px; margin-top: 4px; }
.login-error { color: #b84f44; background: #fff3f1; border: 1px solid #f1d3cf; border-radius: 7px; padding: 9px 11px; font-size: 11px; }
.login-footnote { color: #a0aaa6; text-align: center; font: 500 9px "DM Mono", monospace; letter-spacing: .1em; margin-top: 25px; }
.supplier-grid { display: grid; grid-template-columns: repeat(3, minmax(200px, 1fr)); gap: 15px; }
.catalog-toolbar { min-height: 34px; margin-bottom: 15px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }.catalog-count { color: var(--muted); font-size: 11px; }.view-switch { padding: 3px; display: flex; gap: 2px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }.view-switch-button { border: 0; border-radius: 5px; padding: 6px 9px; display: flex; align-items: center; gap: 5px; background: transparent; color: var(--muted); font-size: 10px; }.view-switch-button:hover { color: var(--ink); }.view-switch-button.active { color: var(--teal); background: var(--teal-soft); font-weight: 700; }
.entity-list { display: grid; background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; box-shadow: var(--shadow); }.entity-list-header, .entity-list-row { display: grid; grid-template-columns: minmax(180px, 1.5fr) minmax(170px, 1fr) minmax(110px, .6fr) 60px; gap: 16px; align-items: center; }.entity-list-header { padding: 12px 18px; color: #91a099; background: #fbfcfb; border-bottom: 1px solid var(--line); font: 500 9px "DM Mono", monospace; letter-spacing: .07em; }.entity-list-row { width: 100%; padding: 15px 18px; border: 0; border-bottom: 1px solid #eef2ef; background: #fff; color: var(--ink); text-align: left; font-size: 11px; }.entity-list-row:last-child { border-bottom: 0; }.entity-list-row:hover { background: var(--teal-soft); }.entity-list-primary { min-width: 0; display: grid; gap: 4px; }.entity-list-primary strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }.entity-list-primary small, .entity-list-muted { color: var(--muted); }.entity-list-action { color: var(--teal); text-align: right; white-space: nowrap; }
.direction-grid { display: grid; grid-template-columns: repeat(3, minmax(230px, 1fr)); gap: 15px; }
.direction-card { display: grid; min-height: 190px; align-content: start; background: #fff; border: 1px solid var(--line); border-radius: 11px; padding: 19px; color: var(--ink); text-align: left; transition: .2s ease; }.direction-card:hover { border-color: var(--teal); box-shadow: var(--shadow); transform: translateY(-2px); }.direction-card-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }.direction-card h3 { font-size: 15px; margin-top: 16px; }.direction-objective { color: var(--muted); font-size: 11px; line-height: 1.65; margin-top: 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }.direction-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-top: auto; padding-top: 16px; }.direction-meta span { color: var(--muted); background: var(--paper); border-radius: 20px; padding: 5px 8px; font-size: 9px; }.direction-status { display: inline-flex; border-radius: 20px; padding: 5px 9px; font-size: 9px; font-weight: 700; }.status-探索中 { color: #5a6f80; background: #edf2f6; }.status-推进中 { color: var(--teal); background: var(--teal-soft); }.status-已沉淀 { color: #8a651c; background: #fff2cb; }
.supplier-card, .entity-card { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 18px; }
.entity-card { color: var(--ink); text-align: left; font: inherit; transition: .2s ease; }
.entity-card:hover { border-color: #9bc7bb; box-shadow: var(--shadow); transform: translateY(-2px); }
.entity-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 13px; }
.entity-kind { color: var(--teal); font: 500 9px "DM Mono", monospace; letter-spacing: .12em; }
.entity-open { color: #8aa098; font-size: 10px; }
.level-badge, .role-badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 20px; padding: 4px 8px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.level-S { color: #a84d1f; background: #ffeadc; }.level-A { color: #87661c; background: #fff4ce; }.level-B { color: #4d6f65; background: #eaf1ee; }
.supplier-level-badge, .order-badge { display: inline-flex; align-items: center; border-radius: 20px; padding: 4px 8px; font-size: 9px; font-weight: 700; white-space: nowrap; }.supplier-level-优质 { color: #0d6d5e; background: #e4f4ef; }.supplier-level-普通 { color: #60746d; background: #edf1ef; }.supplier-level-拉黑 { color: #a33e34; background: #fff0ee; }.order-badge.has-order { color: #0d6d5e; background: #e4f4ef; }.order-badge.no-order { color: #697a75; background: #edf1ef; }
.role-超级管理员 { color: #6841a8; background: #f1eafd; }.role-管理员 { color: #8f3f35; background: #fff0ee; }.role-业务管理 { color: #0d6d5e; background: #e4f4ef; }.role-研发 { color: #3d5fa7; background: #eaf0ff; }.role-只读 { color: #697a75; background: #edf1ef; }
.permission-card { display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 20px; margin: -9px 0 20px; }.permission-copy p { color: var(--muted); font-size: 12px; line-height: 1.65; margin-top: 10px; }.role-list { display: grid; gap: 8px; align-content: center; }.role-list span { color: #60746d; font-size: 11px; }.role-list b { color: var(--ink); margin-right: 6px; }
.theme-panel { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 24px; box-shadow: var(--shadow); }.theme-panel > p { color: var(--muted); font-size: 12px; line-height: 1.65; }.theme-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 20px; }
.theme-option { position: relative; display: grid; gap: 7px; padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); text-align: left; transition: .2s ease; }.theme-option:hover { transform: translateY(-2px); box-shadow: var(--shadow); }.theme-option.active { border-color: var(--teal); box-shadow: 0 0 0 2px var(--accent-ring); }.theme-option strong { font-size: 13px; }.theme-option small { color: var(--muted); font-size: 10px; line-height: 1.55; min-height: 31px; }.theme-selected { display: none; color: var(--teal); font-size: 10px; font-weight: 700; }.theme-option.active .theme-selected { display: block; }
.theme-preview { height: 92px; display: grid; grid-template-columns: 28% 1fr; grid-template-rows: 36% 1fr; gap: 7px; padding: 10px; border-radius: 8px; overflow: hidden; }.theme-preview i { grid-row: 1 / -1; border-radius: 5px; }.theme-preview b, .theme-preview em { border-radius: 5px; }.theme-preview-green { background: #f2f8f5; }.theme-preview-green i { background: #143d36; }.theme-preview-green b { background: #137a68; }.theme-preview-green em { background: #dcece7; }.theme-preview-violet { background: #f8f4fc; }.theme-preview-violet i { background: #2f2445; }.theme-preview-violet b { background: #7a4fc0; }.theme-preview-violet em { background: #e9def5; }.theme-preview-blue { background: #f2f7fc; }.theme-preview-blue i { background: #173653; }.theme-preview-blue b { background: #286fc2; }.theme-preview-blue em { background: #d9e8f6; }
.migration-panel { margin-top: 18px; padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }.migration-panel p { max-width: 680px; margin-top: 6px; color: var(--muted); font-size: 11px; line-height: 1.65; }.migration-panel code { color: var(--teal); }.legacy-export-page { min-height: 100vh; padding: 24px; display: grid; place-items: center; }.legacy-export-card { width: min(620px, 100%); padding: 34px; display: grid; gap: 22px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow); }.legacy-export-card h1 { margin-top: 9px; }.legacy-export-card p { margin-top: 12px; color: var(--muted); font-size: 12px; line-height: 1.8; }.legacy-export-status { padding: 13px 15px; border-radius: 8px; background: var(--paper); color: var(--muted); font-size: 11px; line-height: 1.65; }
.supplier-card h3 { font-size: 14px; }.supplier-meta { color: var(--muted); font-size: 11px; margin-top: 9px; }.supplier-count { color: var(--teal); font: 700 24px "Manrope", sans-serif; margin-top: 17px; }
.supplier-directory-card h3, .customer-directory-card h3 { color: var(--ink); font-size: 15px; font-weight: 750; margin-bottom: 14px; }.card-location { color: var(--teal); font-size: 10px; font-weight: 700; }.supplier-card-tags { display: flex; gap: 5px; margin: 9px 0 0; overflow-x: auto; scrollbar-width: none; }.supplier-card-tags::-webkit-scrollbar, .partner-contact-names::-webkit-scrollbar { display: none; }.supplier-card-tags span { flex: 0 0 auto; padding: 4px 7px; border-radius: 20px; background: var(--teal-soft); color: var(--teal); font-size: 8px; }.partner-card-contacts { min-width: 0; display: flex; align-items: center; gap: 10px; padding: 10px 11px; border-radius: 7px; background: var(--paper); }.partner-card-contacts > small { flex: 0 0 auto; color: #91a099; font-size: 9px; }.partner-contact-names { min-width: 0; display: flex; gap: 10px; overflow-x: auto; white-space: nowrap; scrollbar-width: none; color: var(--muted); font-size: 11px; }.partner-contact-names strong { flex: 0 0 auto; color: var(--ink); font-size: 12px; }.supplier-card-footer { display: flex; gap: 14px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }.entity-list-contact-names { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.entity-list-status { display: flex; align-items: center; gap: 7px; }.entity-list-status small { color: var(--muted); font-size: 9px; }.primary-contact-badge { display: inline-flex; margin-left: 7px; padding: 2px 6px; border-radius: 20px; background: var(--teal-soft); color: var(--teal); font-size: 8px; font-style: normal; font-weight: 700; vertical-align: middle; }.modal-footer > #entity-delete-button, .modal-footer > #direction-delete-button, .modal-footer > #user-delete-button { margin-right: auto; }
.modal-backdrop { position: fixed; inset: 0; display: grid; place-items: center; background: var(--modal-overlay); z-index: 10; padding: 20px; }
.modal { background: white; width: min(760px, 100%); max-height: 92vh; overflow-y: auto; border-radius: 13px; padding: 27px 30px 24px; box-shadow: 0 28px 70px var(--modal-shadow); }
.detail-modal { width: min(680px, 100%); }.small-modal { width: min(420px, 100%); }.partner-modal { width: min(620px, 100%); }.partner-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.partner-form-grid .field { align-content: start; }.partner-form-grid .field input, .partner-form-grid .field select { height: 40px; min-height: 40px; box-sizing: border-box; }.partner-form-grid .full { grid-column: 1 / -1; }
.modal-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 25px; }.close-button { border: 0; background: transparent; color: #8ca09a; font-size: 25px; line-height: 1; }.close-button:hover { color: var(--ink); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.field { display: grid; gap: 7px; color: #667a73; font-size: 11px; font-weight: 600; }.field b { color: var(--orange); }.field input, .field select, .field textarea { width: 100%; padding: 10px 11px; font-size: 12px; resize: vertical; }.field.full { grid-column: 1 / -1; }.field small { color: var(--muted); font-size: 9px; font-weight: 500; }.storage-provider-pill { display: inline-flex; width: fit-content; margin-right: 7px; padding: 3px 7px; border-radius: 20px; color: var(--teal); background: var(--teal-soft); font-size: 9px; font-weight: 700; }
.contacts-editor { display: grid; gap: 8px; }.contact-row { display: grid; grid-template-columns: minmax(100px, .8fr) minmax(180px, 1.4fr) 30px; gap: 8px; align-items: center; }.contact-row input { width: 100%; padding: 9px 10px; font-size: 12px; }.contact-remove { width: 30px; height: 30px; border: 1px solid #efd7d3; border-radius: 6px; background: #fff7f5; color: #b95b4e; font-size: 18px; line-height: 1; }.contact-add-button { justify-self: start; padding: 8px 10px; }.contact-empty { color: var(--muted); border: 1px dashed #d6e1dc; border-radius: 7px; padding: 11px; font-size: 11px; font-weight: 400; }
.relation-check-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }.relation-option { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 9px 10px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--ink); font-size: 11px; font-weight: 500; }.relation-option input { width: auto; margin: 0; accent-color: var(--teal); }.relation-empty { color: var(--muted); padding: 10px 0; font-size: 11px; font-weight: 400; }.relation-pills { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }.relation-pill { display: inline-flex; padding: 6px 9px; border: 0; border-radius: 20px; background: var(--teal-soft); color: var(--teal); font-size: 10px; font-weight: 600; }.relation-pill:hover { box-shadow: inset 0 0 0 1px currentColor; }
.markdown-field > small { margin-top: -3px; line-height: 1.55; }.markdown-editor { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #fff; }.markdown-toolbar { display: flex; align-items: center; gap: 3px; padding: 6px; border-bottom: 1px solid var(--line); background: #f8faf9; }.markdown-toolbar button { min-height: 28px; padding: 5px 8px; border: 0; border-radius: 5px; background: transparent; color: #60746d; font-size: 10px; }.markdown-toolbar button:hover { color: var(--teal); background: var(--teal-soft); }.markdown-toolbar .markdown-preview-toggle { margin-left: auto; color: var(--teal); font-weight: 700; }.markdown-editor textarea { min-height: 230px; border: 0; border-radius: 0; padding: 14px; font: 11px/1.75 "DM Mono", ui-monospace, monospace; }.markdown-editor textarea:focus { box-shadow: none; }.markdown-preview { min-height: 230px; padding: 16px 18px; background: #fff; }.markdown-rendered { padding: 4px 0; color: var(--ink); font-size: 12px; line-height: 1.75; }.markdown-rendered h3, .markdown-rendered h4, .markdown-rendered h5, .markdown-preview h3, .markdown-preview h4, .markdown-preview h5 { margin: 18px 0 8px; color: var(--ink); }.markdown-rendered h3:first-child, .markdown-preview h3:first-child { margin-top: 0; }.markdown-rendered p, .markdown-preview p { margin: 8px 0; }.markdown-rendered ul, .markdown-rendered ol, .markdown-preview ul, .markdown-preview ol { margin: 8px 0; padding-left: 22px; }.markdown-rendered li, .markdown-preview li { margin: 4px 0; }.markdown-rendered blockquote, .markdown-preview blockquote { margin: 10px 0; padding: 9px 12px; border-left: 3px solid var(--teal); background: var(--teal-soft); color: #587068; }.markdown-rendered a, .markdown-preview a { color: var(--teal); text-decoration: underline; text-underline-offset: 2px; }.markdown-rendered code, .markdown-preview code { padding: 2px 5px; border-radius: 4px; background: var(--paper); font: 10px "DM Mono", monospace; }
.modal-footer { display: flex; justify-content: flex-end; gap: 9px; border-top: 1px solid var(--line); margin-top: 25px; padding-top: 17px; }
.detail-hero { background: var(--hero-bg); border: 1px solid var(--hero-border); border-radius: 9px; padding: 18px; display: flex; justify-content: space-between; gap: 15px; }.detail-hero h3 { font-size: 18px; }.detail-id { color: var(--muted); font: 10px "DM Mono", monospace; margin-top: 6px; }.detail-description { color: var(--muted); font-size: 12px; line-height: 1.7; margin-top: 10px; }.detail-section { margin-top: 22px; }.detail-section-title { color: #91a099; font: 500 10px "DM Mono", monospace; letter-spacing: .1em; padding-bottom: 9px; border-bottom: 1px solid var(--line); }.detail-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px 24px; margin-top: 14px; }.detail-item label { display: block; color: var(--muted); font-size: 10px; margin-bottom: 5px; }.detail-item span { font-size: 12px; word-break: break-all; }.path-value { display: block; color: var(--muted); line-height: 1.6; margin-top: 5px; }.path-copy, .entity-text-link { padding: 0; border: 0; background: transparent; color: var(--teal); font-size: 11px; font-weight: 700; cursor: pointer; }.path-copy:hover, .entity-text-link:hover { text-decoration: underline; }.linked-assets { display: grid; margin-top: 9px; }.linked-asset { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 12px 2px; border: 0; border-bottom: 1px solid #eef2ef; background: transparent; color: var(--ink); text-align: left; font-size: 11px; }.linked-asset:hover strong { color: var(--teal); }.linked-asset strong, .linked-asset small { display: block; }.linked-asset small { color: var(--muted); font: 9px "DM Mono", monospace; margin-top: 4px; }.detail-empty { color: var(--muted); font-size: 12px; padding: 18px 0 2px; }
.full-detail-item { grid-column: 1 / -1; }.detail-tags { display: flex; flex-wrap: wrap; gap: 6px; }.detail-tags i { padding: 4px 7px; border-radius: 20px; background: var(--teal-soft); color: var(--teal); font-size: 9px; font-style: normal; }
.contact-list { display: grid; margin-top: 8px; }.contact-list-item { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 2px; border-bottom: 1px solid #eef2ef; font-size: 12px; }.contact-list-item strong { color: var(--ink); }.contact-list-item span { color: var(--muted); text-align: right; word-break: break-all; }
.contact-heading { align-items: center; }.contact-inbox-summary { display: flex; align-items: baseline; gap: 7px; margin: -8px 0 16px; color: var(--muted); font-size: 11px; }.contact-inbox-summary strong { color: var(--teal); font: 700 24px "Manrope", sans-serif; }.contact-person { display: grid; gap: 4px; }.contact-person strong { color: var(--ink); font-size: 12px; }.contact-person small { color: var(--muted); font-size: 10px; }.contact-status { display: inline-flex; padding: 4px 8px; border-radius: 20px; background: #edf1ef; color: var(--muted); font-size: 10px; font-weight: 700; white-space: nowrap; }.contact-status.is-new { color: var(--teal); background: var(--teal-soft); }.contact-message { margin-top: 14px; padding: 15px; border-radius: 8px; background: var(--paper); color: var(--ink); font-size: 12px; line-height: 1.8; white-space: pre-wrap; word-break: break-word; }
.confirm-modal { text-align: center; padding-top: 32px; }.confirm-icon { width: 48px; height: 48px; display: grid; place-items: center; margin: 0 auto 16px; border-radius: 14px; color: var(--teal); background: var(--teal-soft); font-size: 24px; }.confirm-modal h2 { margin-top: 0; }.confirm-modal p { color: var(--muted); font-size: 12px; line-height: 1.7; margin-top: 10px; }.confirm-modal .modal-footer { justify-content: center; }
.toast { position: fixed; bottom: 27px; left: 50%; transform: translate(-50%, 20px); opacity: 0; pointer-events: none; background: var(--sidebar); color: white; padding: 11px 16px; border-radius: 7px; font-size: 12px; transition: .25s ease; z-index: 20; }.toast.show { opacity: 1; transform: translate(-50%, 0); }
@media (max-width: 980px) { .sidebar { width: 200px; flex-basis: 200px; }.main-content { padding: 28px 28px 50px; }.toolbar { flex-wrap: wrap; }.search-wrap { flex-basis: 100%; max-width: none; }.stats-grid { grid-template-columns: repeat(2, 1fr); }.filter-group { flex: 1; }.filter-group select { flex: 1; }.theme-grid { grid-template-columns: 1fr; }.direction-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); } }
@media (max-width: 680px) { .login-screen { padding: 15px; }.login-card { padding: 28px 22px 23px; }.app-shell { display: block; }.sidebar { width: 100%; padding: 16px 18px; flex-direction: row; align-items: center; }.brand { padding: 0; }.nav-list { margin-left: auto; display: flex; }.nav-group { display: contents; }.nav-group-label { display: none; }.nav-item { padding: 8px; }.nav-item:not(.active) { display: none; }.nav-item.active { background: transparent; }.sidebar-footer { display: none; }.main-content { padding: 25px 16px 40px; }.topbar { margin-bottom: 25px; }.topbar-actions .button-ghost { display: none; }.topbar-actions { gap: 0; } h1 { font-size: 25px; }.form-grid, .partner-form-grid, .detail-grid, .permission-card, .contact-row, .relation-check-list { grid-template-columns: 1fr; }.field.full, .partner-form-grid .full { grid-column: auto; }.supplier-grid, .direction-grid { grid-template-columns: 1fr; }.entity-list { overflow-x: auto; }.entity-list-header, .entity-list-row { min-width: 620px; }.filter-group { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }.filter-group select:last-child { grid-column: 1 / -1; }.toolbar-actions { margin-left: auto; }.contact-remove { width: 100%; } }