/* P8 design-c 2026-10-21 — ERP. Loaded last. Tokens: ERP/DESIGN_TOKENS.md (refero "Column": navy ledger on near-white).
   Radius 0 (tables) / 4 (controls, panels) + full only for chips. Accent = Indigo Navy, only on the primary action,
   current location and key figures. */
body.erp{
  --p8-canvas:#f6f6f8;      /* Column Cloud Canvas */
  --p8-surface:#ffffff;     /* Pure White */
  --p8-line:#e3e4e8;        /* Silver Lining */
  --p8-line-strong:#cbcccf; /* Mist */
  --p8-ink:#011821;         /* Midnight Ink: headings, figures */
  --p8-text:#3b3e47;        /* Slate Ink: body + secondary (Steel fails AA on white) */
  --p8-quiet:#7c7f88;       /* Steel: placeholders, disabled, ≥18px captions only */
  --p8-accent:#111a4a;      /* Indigo Navy */
  --p8-accent-2:#1e4199;    /* Cobalt Edge: hover, links, focus */
  --p8-success:#167e6c;     /* Seafoam 700 */
  --p8-warn:#ec652b;        /* Signal Orange: marks only, never small text */
  --p8-danger:#c22f33;      /* semantic red (AA on white) */
  --p8-r-ctl:8px; --p8-r-box:12px; --p8-r-lg:20px;
  --rv-act:var(--p8-accent); --rv-act-press:#0a1033; --rv-link:var(--p8-accent-2); /* §4-1 chrome accent */
  --ink:var(--p8-ink); --muted:var(--p8-text); --line:var(--p8-line); --surface:#fff; --bg:var(--p8-canvas);
  --accent:var(--p8-accent); --soft:#eef0f6; --success:var(--p8-success); --danger:var(--p8-danger); --radius:4px;
  background:var(--p8-canvas); color:var(--p8-text);
}
body.erp h1,body.erp h2,body.erp h3{color:var(--p8-ink)}
body.erp a.text-link{color:var(--p8-accent-2);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
body.erp :focus-visible{outline:2px solid var(--p8-accent-2);outline-offset:2px}

/* ---------- Buttons: primary / secondary / text; hover · focus · active · disabled · loading ---------- */
body.erp .btn{min-height:40px;padding:0 16px;border:1px solid var(--p8-line-strong);border-radius:var(--p8-r-ctl);background:var(--p8-surface);color:var(--p8-ink);font-size:14px;font-weight:600;letter-spacing:0;box-shadow:none;transition:background-color .15s,border-color .15s,color .15s}
body.erp .btn:hover:not(:disabled){background:var(--p8-canvas);border-color:var(--p8-ink)}
body.erp .btn:active:not(:disabled){background:var(--p8-line);transform:none}
body.erp .btn.primary{background:var(--p8-accent);border-color:var(--p8-accent);color:#fff}
body.erp .btn.primary:hover:not(:disabled){background:var(--p8-accent-2);border-color:var(--p8-accent-2);filter:none}
body.erp .btn.primary:active:not(:disabled){background:var(--p8-ink);border-color:var(--p8-ink)}
body.erp .btn.ghost{background:transparent;border-color:transparent;color:var(--p8-text)}
body.erp .btn.ghost:hover:not(:disabled){background:var(--p8-line);border-color:transparent;color:var(--p8-ink)}
body.erp .btn.small{min-height:40px;padding:0 12px;font-size:13px}
body.erp .btn.danger{color:var(--p8-danger);border-color:var(--p8-line-strong)}
body.erp .btn.danger:hover:not(:disabled){border-color:var(--p8-danger);background:#fff}
body.erp .btn:disabled,body.erp .btn[aria-disabled=true]{opacity:1;background:var(--p8-canvas);border-color:var(--p8-line);color:var(--p8-quiet);cursor:not-allowed}
body.erp .btn.primary:disabled,body.erp .btn.primary[aria-disabled=true]{background:var(--p8-line-strong);border-color:var(--p8-line-strong);color:#fff}
body.erp .btn.is-loading,body.erp .btn[aria-busy=true]{position:relative;color:transparent!important;pointer-events:none}
body.erp .btn.is-loading::after,body.erp .btn[aria-busy=true]::after{content:'';position:absolute;inset:calc(50% - 8px) auto auto calc(50% - 8px);width:16px;height:16px;border:2px solid currentColor;border-color:var(--p8-quiet) var(--p8-quiet) transparent transparent;border-radius:50%;animation:p8spin .7s linear infinite}
body.erp .btn.primary.is-loading::after,body.erp .btn.primary[aria-busy=true]::after{border-color:#fff #fff transparent transparent}
@keyframes p8spin{to{transform:rotate(360deg)}}

/* ---------- Forms + inline errors ---------- */
body.erp input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),body.erp select,body.erp textarea{border-radius:var(--p8-r-ctl);border-color:var(--p8-line-strong)}
body.erp input:hover:not(:disabled),body.erp select:hover:not(:disabled),body.erp textarea:hover:not(:disabled){border-color:var(--p8-quiet)}
body.erp input:focus,body.erp select:focus,body.erp textarea:focus{border-color:var(--p8-accent-2);box-shadow:0 0 0 1px var(--p8-accent-2);outline:none}
body.erp input::placeholder,body.erp textarea::placeholder{color:var(--p8-quiet)}
body.erp [aria-invalid=true]{border-color:var(--p8-danger)!important;box-shadow:0 0 0 1px var(--p8-danger)!important}
body.erp .p8-field-error{display:flex;gap:6px;margin:6px 0 0;color:var(--p8-danger);font-size:13px;font-weight:600;line-height:1.5}
body.erp .p8-field-error::before,body.erp .form-error:not([hidden]):not(:empty)::before{content:'오류';flex:none;padding:0 6px;border:1px solid currentColor;border-radius:2px;font-size:12px;line-height:18px;height:20px;font-weight:700}
body.erp .form-error:not([hidden]):not(:empty){display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border:1px solid #f0c8c9;border-left:3px solid var(--p8-danger);border-radius:var(--p8-r-box);background:#fff;color:var(--p8-danger);font-size:14px;font-weight:600}

/* ---------- Public pages: wide, high contrast, left-aligned ---------- */
body.erp .public-header{background:#fff;border-bottom:1px solid var(--p8-line);backdrop-filter:none}
body.erp .public-header nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--p8-text);font-size:15px;font-weight:400;border-radius:0}
body.erp .public-header nav a.active{color:var(--p8-ink);font-weight:700;box-shadow:inset 0 -2px 0 var(--p8-accent);background:none}
body.erp .public-header nav a.active::after,body.erp .public-header nav a.active::before{display:none}
/* One primary per screen: the header repeats the hero action, so it steps down to secondary. */
body.erp .public-header .btn.primary{background:#fff;border-color:var(--p8-accent);color:var(--p8-accent)}
body.erp .public-header .btn.primary:hover{background:var(--p8-canvas)}
body.erp .public-header .button-row>a:not(.btn){display:inline-flex;align-items:center;min-height:44px;color:var(--p8-text);font-weight:400}
body.erp .hero-wrap{background:var(--p8-surface);border-bottom:1px solid var(--p8-line)}
body.erp .hero{min-height:0;padding-top:72px;padding-bottom:72px;gap:56px}
body.erp .hero h1,body.erp.erp .hero h1{font-size:clamp(32px,3.2vw,44px);font-weight:700;line-height:1.25;letter-spacing:-.03em;margin:16px 0 20px;color:var(--p8-ink)}
body.erp .hero h1 em,body.erp .hero h1 span{color:var(--p8-ink)}
body.erp .hero p{font-size:17px;line-height:1.7;color:var(--p8-text);max-width:34em}
body.erp .hero .button-row .btn{min-height:48px;padding:0 22px;font-size:15px}
body.erp .eyebrow{color:var(--p8-accent-2);letter-spacing:.08em;font-size:13px;font-weight:700}
body.erp .hero-stats{border-top:1px solid var(--p8-line);padding-top:20px;margin-top:32px}
body.erp .hero-stats strong,body.erp .hero-stats b{color:var(--p8-ink);font-weight:700}
body.erp .hero-preview>*{border-radius:var(--p8-r-box)!important;box-shadow:0 1px 2px rgba(1,24,33,.06),0 12px 32px -12px rgba(17,26,74,.22)!important;border:1px solid var(--p8-line)}
body.erp .monitor-strip{gap:0;border:1px solid var(--p8-line);border-radius:var(--p8-r-box);background:#fff;overflow:hidden;margin-top:32px}
body.erp .monitor-chip{border:0;border-right:1px solid var(--p8-line);border-radius:0;background:transparent;padding:16px}
body.erp .monitor-chip:last-child{border-right:0}
body.erp .public-section{padding-top:80px;padding-bottom:80px}
body.erp .public-section:nth-of-type(even){background:var(--p8-surface)}
body.erp .public-copy h2{font-size:clamp(24px,2.2vw,30px);font-weight:700;line-height:1.35;letter-spacing:-.02em}
body.erp .public-copy p{font-size:16px;line-height:1.75;color:var(--p8-text)}
body.erp .feature-card{border-radius:var(--p8-r-box);border:1px solid var(--p8-line);box-shadow:none;padding:20px}
body.erp .feature-card h3{font-size:17px;font-weight:700}
body.erp .feature-card p{font-size:14px;color:var(--p8-text)}
body.erp .cta-banner{background:var(--p8-accent);color:#fff;border-radius:var(--p8-r-box);padding:40px}
body.erp .cta-banner h2,body.erp .cta-banner p{color:#fff}
body.erp .cta-banner p{opacity:.86}
body.erp .cta-banner .btn.primary{background:#fff;border-color:#fff;color:var(--p8-accent)}
body.erp .cta-banner .btn.primary:hover{background:var(--p8-canvas);border-color:var(--p8-canvas)}
body.erp .public-footer{background:var(--p8-canvas);border-top:1px solid var(--p8-line)}
body.erp .public-footer a{display:inline-flex;align-items:center;min-height:44px}

/* ---------- Work screens: dense, aligned, light sidebar ---------- */
body.erp .topbar{background:#fff;border-bottom:1px solid var(--p8-line)}
body.erp .sidebar{background:#fff;border-right:1px solid var(--p8-line)}
body.erp .sidebar .brand,body.erp.erp .sidebar .brand{color:var(--p8-ink)}
body.erp .sidebar .brand small{color:var(--p8-text)}
body.erp .sidebar .nav-link,body.erp.erp .sidebar .nav-link{color:var(--p8-text);border-radius:var(--p8-r-ctl);min-height:40px;font-size:14px}
body.erp .sidebar .nav-link:hover{background:var(--p8-canvas);color:var(--p8-ink)}
body.erp .sidebar .nav-link.active{color:var(--p8-accent);background:var(--soft);font-weight:700}
body.erp .nav-link.active:before{background:var(--p8-accent);border-radius:0;width:3px}
body.erp .sidebar summary,body.erp.erp .sidebar summary{color:var(--p8-ink);font-weight:600;font-size:14px;min-height:40px;border-radius:var(--p8-r-ctl)}
body.erp .sidebar summary:hover{background:var(--p8-canvas)}
body.erp .sidebar details[open] summary,body.erp.erp .sidebar details[open] summary{background:transparent;color:var(--p8-ink);box-shadow:inset 0 -1px 0 var(--p8-line);border-radius:0}
body.erp .sidebar .subnav a,body.erp.erp .sidebar .subnav a{color:var(--p8-text);font-size:14px;min-height:36px;border-radius:var(--p8-r-ctl)}
body.erp .sidebar .subnav a:hover{background:var(--p8-canvas);color:var(--p8-ink)}
body.erp .sidebar .subnav a.active,body.erp.erp .sidebar .subnav a.active{background:var(--soft);color:var(--p8-accent);font-weight:700}
body.erp .erp-nav-view-switch{border-radius:var(--p8-r-ctl);background:var(--p8-canvas)}
body.erp .erp-nav-view{border-radius:2px;color:var(--p8-text)}
body.erp .erp-nav-view.active{background:#fff;color:var(--p8-ink);box-shadow:0 0 0 1px var(--p8-line-strong)}
body.erp .workspace>header h1{font-size:24px;font-weight:700;letter-spacing:-.02em}
body.erp .workspace>header p{font-size:14px;color:var(--p8-text)}
body.erp .panel{border-radius:var(--p8-r-box);border-color:var(--p8-line);box-shadow:none}
body.erp .panel h2{font-size:17px;font-weight:700}
body.erp .kpi{border-radius:var(--p8-r-box);border-color:var(--p8-line);padding:16px;box-shadow:none}
body.erp .kpi .value{font-size:26px;font-weight:700;color:var(--p8-ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
body.erp .data-table{font-variant-numeric:tabular-nums}
body.erp .data-table th,body.erp.erp .data-table th{background:var(--p8-canvas);color:var(--p8-ink);font-size:13px;font-weight:700;padding:8px 12px;border-right:0;border-bottom:1px solid var(--p8-line-strong)}
body.erp .data-table td{padding:8px 12px;border-bottom:1px solid var(--p8-line);font-size:14px;line-height:1.5}
body.erp .data-table td small{color:var(--p8-text)}
body.erp .data-table tbody tr:hover td{background:#fafafb}
body.erp .badge{border-radius:999px;background:var(--p8-canvas);color:var(--p8-ink);border:1px solid var(--p8-line-strong);font-weight:600}
body.erp .badge.green{color:var(--p8-success);border-color:#a9d8cd;background:#fff}
body.erp .badge.red{color:var(--p8-danger);border-color:#f0c8c9;background:#fff}
body.erp .badge.amber{color:#8a3d12;border-color:var(--p8-warn);background:#fff}
body.erp .tabs button,body.erp .tabs a{border-radius:0}
body.erp .modal,body.erp .modal-card,body.erp [role=dialog]{border-radius:var(--p8-r-box)}
/* First-run guide: numbered steps, one next action. */
body.erp .erp-first-run{border-left:3px solid var(--p8-accent);border-radius:var(--p8-r-box)}
body.erp .erp-first-run h2{font-size:17px}
body.erp .erp-steps li,body.erp .erp-steps a{border-radius:var(--p8-r-box)!important;box-shadow:none!important}
body.erp .lf-empty-row td strong{color:var(--p8-ink)}
body.erp .lf-empty-row td span{color:var(--p8-text)}

/* ---------- Charts: navy = sales, Fog = purchases; no gradients ---------- */
body.erp .bar-chart{background:repeating-linear-gradient(to top,transparent,transparent 43px,var(--p8-line) 44px)}
body.erp .bar-chart i{background:var(--p8-accent);border-radius:2px 2px 0 0}
body.erp .bar-chart i:nth-child(2){background:#a9acb6} /* Column Fog */
body.erp .donut{background:conic-gradient(#111a4a 0 42%,#1e4199 42% 70%,#167e6c 70% 88%,#cbcccf 88% 100%)}
body.erp .erp-mini-production{border-radius:var(--p8-r-box);border-color:var(--p8-line)}
body.erp .erp-mini-production>aside{background:var(--p8-accent);color:#cbcccf}
body.erp .erp-mini-production>aside>span.active{background:#1e4199;border-radius:2px}
body.erp .erp-mini-kpis>div{border-radius:2px;border-color:var(--p8-line)}
body.erp .erp-mini-kpis small{color:var(--p8-success)}
body.erp .erp-mini-chart-title i{background:var(--p8-accent);border-radius:0}
body.erp .erp-mini-chart-title i+i{background:#a9acb6}
body.erp .erp-mini-bar .sales{background:var(--p8-accent)}
body.erp .erp-mini-bar .purchase{background:#a9acb6}
body.erp .erp-mini-donut{background:conic-gradient(#111a4a 0 42%,#1e4199 42% 76%,#167e6c 76% 100%)}
body.erp .hero-stats b{font-size:19px;white-space:nowrap}
body.erp .hero-stats div{padding-right:24px}

/* ---------- Touch: 44px targets on phones/tablets ---------- */
@media (max-width:768px),(pointer:coarse){
  body.erp .btn,body.erp .btn.small,body.erp .sidebar .nav-link,body.erp .sidebar summary,body.erp .sidebar .subnav a,body.erp.erp .sidebar .subnav a{min-height:44px}
  body.erp .btn.icon-only{min-width:44px}
  body.erp .public-footer a,body.erp .rv-biz a{min-height:44px;display:inline-flex;align-items:center}
}
@media (max-width:768px){
  body.erp .hero{padding-top:40px;padding-bottom:40px;gap:32px}
  body.erp .monitor-strip{flex-wrap:wrap}
  body.erp .monitor-chip{flex:1 1 45%;border-bottom:1px solid var(--p8-line)}
  body.erp .cta-banner{padding:24px 20px}
  body.erp .public-section{padding-top:48px;padding-bottom:48px}
}
@media (prefers-reduced-motion:reduce){body.erp *{transition:none!important;animation:none!important}}

/* Touch targets for links and icon controls on phones/tablets. */
@media (max-width:768px),(pointer:coarse){
  body.erp a.brand,body.erp .team,body.erp .topbar-icon,body.erp .source-notification-button,body.erp .source-guide-toggle,body.erp .text-link,body.erp .public-header .btn,body.erp form a,body.erp .auth-links a{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center}
  body.erp .text-link,body.erp form a{justify-content:flex-start}
  body.erp .btn.menu,body.erp .mobile-menu{min-height:44px}
  body.erp input:not([type=checkbox]):not([type=radio]),body.erp select{min-height:44px!important}
}
/* B43 header actions were 36px; the button scale is 40 (desktop) / 44 (touch). */
body.erp .workspace>header .button-row .btn,body.erp .workspace>header .button-row .btn.primary{min-height:40px}
@media (max-width:768px),(pointer:coarse){body.erp .btn{min-height:44px!important}}
/* Dashboard first run: the first step is the one next action. */
body.erp .erp-steps li:first-child a,body.erp .erp-steps>a:first-child{border-color:var(--p8-accent)!important;box-shadow:inset 3px 0 0 var(--p8-accent)!important}

/* ---------- P9 landing (erp-p9.js): ledger-dense, aligned ---------- */
body.erp .erp-facts{display:flex;margin:36px 0 0;padding:0}
body.erp .erp-facts div{padding:0 24px;border-left:1px solid var(--p8-line-strong)}
body.erp .erp-facts div:first-child{padding-left:0;border-left:0}
body.erp .erp-facts dt{color:var(--p8-text);font-size:13px}
body.erp .erp-facts dd{margin:4px 0 0;color:var(--p8-ink);font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}
body.erp .erp-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:end;margin-bottom:32px}
body.erp .erp-head h2{margin:12px 0 0}
body.erp .erp-head p{margin:0;color:var(--p8-text);font-size:16px;line-height:1.75}
body.erp .erp-table .data-table td,body.erp .erp-table .data-table th{white-space:nowrap}
body.erp .erp-table .data-table td{font-variant-numeric:tabular-nums}
body.erp .erp-band{background:#fff;border-top:1px solid var(--p8-line);border-bottom:1px solid var(--p8-line)}
body.erp .erp-steps{margin:0;padding:0;list-style:none;border-top:1px solid var(--p8-line-strong)}
body.erp .erp-steps li{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:16px;align-items:center;padding:20px 0;border-bottom:1px solid var(--p8-line)}
body.erp .erp-step-no{color:var(--p8-accent);font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
body.erp .erp-steps h3{margin:0 0 4px;font-size:17px;font-weight:700}
body.erp .erp-steps p{margin:0;color:var(--p8-text);font-size:15px}
body.erp .erp-sample{margin:12px 0 0;color:var(--p8-text);font-size:13px;text-align:right}
@media (min-width:1101px){body.erp .public-split{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px}}
@media (max-width:1000px){body.erp .erp-head{grid-template-columns:1fr;gap:16px;margin-bottom:24px}}
@media (max-width:768px){
  body.erp .erp-facts{display:block;border-top:1px solid var(--p8-line-strong)}
  body.erp .erp-facts div,body.erp .erp-facts div:first-child{display:flex;justify-content:space-between;align-items:baseline;padding:10px 0;border-left:0;border-bottom:1px solid var(--p8-line)}
  body.erp .erp-facts dd{margin:0;font-size:18px}
  body.erp .erp-table{overflow-x:auto}
  body.erp .erp-steps li{grid-template-columns:40px minmax(0,1fr);gap:12px}
  body.erp .erp-steps li>.badge{grid-column:2;justify-self:start}
  body.erp .hero .button-row .btn{flex:1 1 auto}
  body.erp .pricing-toggle button,body.erp .legal-layout nav a{min-height:44px;display:inline-flex;align-items:center}
}
body.erp .btn.lg{min-height:48px;padding:0 22px;font-size:15px}
body.erp .public-split .erp-steps{display:block}
body.erp .hero h1 em{font-style:normal;color:var(--p8-accent-2)}
body.erp .erp-table .data-table td:last-child{white-space:normal;min-width:260px}
body.erp .erp-head h2{font-size:clamp(24px,2.4vw,32px);font-weight:700;line-height:1.3;letter-spacing:-.03em}
body.erp .erp-uses{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;margin:0;border-top:1px solid var(--p8-line-strong)}
body.erp .erp-uses div{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px;padding:16px 0;border-bottom:1px solid var(--p8-line)}
body.erp .erp-uses dt{font-weight:700;color:var(--p8-ink)}
body.erp .erp-uses dd{margin:0;color:var(--p8-text)}
@media (max-width:1000px){body.erp .erp-uses{grid-template-columns:1fr}}
@media (max-width:768px){body.erp .erp-uses div{grid-template-columns:1fr;gap:4px}}
/* An error region shows only when it has a message: no empty box, no "오류" badge without text. */
.form-error:empty,.field-error:empty,.p8-field-error:empty,[id$=-error]:empty{display:none!important}