/* ============================================================
   FMSAFEAI Design System v3 — "Safety Color Code"
   산업안전 색채 규격(KS S ISO 3864)을 시스템 언어로 사용한다.
   위험성평가=적(위험) · 현장점검=청(지시) · 공사=황(경고) · 측정=녹(안전)
   ============================================================ */
:root{
  /* Brand (CI 규정 고정) */
  --fms-brand:#e3071b;--fms-brand-dark:#980013;--fms-brand-soft:#fff1f2;
  /* Ink scale — 전부 WCAG AA(4.5:1) 이상 */
  --fms-ink:#15171c;--fms-text:#363a43;--fms-muted:#5b616d;--fms-faint:#8a8f9a;
  --fms-bg:#f3f4f6;--fms-card:#ffffff;--fms-line:#e4e6ea;--fms-line-soft:#eef0f2;
  /* Safety color code */
  --safe-red:#d2091f;--safe-red-soft:#feeef0;
  --safe-blue:#1a5fc4;--safe-blue-soft:#ecf3fe;
  --safe-amber:#9a6400;--safe-amber-soft:#fdf4e3;
  --safe-green:#0e7e58;--safe-green-soft:#e9f8f2;
  --fms-green:var(--safe-green);--fms-amber:var(--safe-amber);--fms-blue:var(--safe-blue);
  /* Surfaces */
  --fms-radius:18px;--fms-radius-sm:13px;
  --fms-shadow:0 1px 2px rgba(21,23,28,.05),0 12px 32px rgba(21,23,28,.07);
  --fms-shadow-lift:0 3px 6px rgba(21,23,28,.07),0 14px 28px rgba(21,23,28,.1),0 30px 60px rgba(21,23,28,.13);
  --fms-side:256px;--fms-top:70px;
  /* Signature */
  --fms-hazard:repeating-linear-gradient(-45deg,var(--fms-brand) 0 11px,#1b1d24 11px 22px);
  --fms-grid-dark:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
}
*{box-sizing:border-box}
/* 셸 조립 전 모듈 원본(모바일) 레이아웃이 잠깐 보이는 현상 차단 — 규칙은 각 페이지 head에 인라인 */
body{transition:opacity .14s ease}
html{scroll-behavior:smooth}
body.fmsafe-integrated{margin:0!important;background:var(--fms-bg)!important;color:var(--fms-ink)!important;
  font-family:'Pretendard Variable',Pretendard,'Noto Sans KR',system-ui,sans-serif!important;
  min-height:100vh;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  font-feature-settings:'tnum' 1}
a{color:inherit}
:is(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--fms-brand);outline-offset:2px;border-radius:6px}
::selection{background:#ffd9dd}

/* ---------- Shell layout: 상단 내비게이션 ---------- */
.fms-shell{min-height:100vh}
/* 모듈 자체 CSS의 요소 선택자(header/footer/nav/main 등)가 셸에 새는 것을 차단 */
.fms-shell .fms-topbar,.fms-shell .fms-footer,.fms-shell .fms-nav,.fms-shell .fms-content,.fms-shell .fms-bottom{
  margin:0!important;padding:0!important;background-image:none;color:inherit;position:static;font-size:inherit}
.fms-topbar{position:fixed!important;left:0;right:0;top:0;z-index:900;background:rgba(255,255,255,.94)!important;
  backdrop-filter:blur(18px);border-bottom:1px solid var(--fms-line);box-shadow:0 1px 3px rgba(21,23,28,.04);
  color:var(--fms-ink)!important;min-height:var(--fms-top)}
.fms-shell .fms-topbar-in{max-width:1400px;margin:0 auto!important;height:var(--fms-top);padding:0 22px!important;display:flex;align-items:center;gap:20px}
.fms-brand{flex:0 0 auto;display:flex;align-items:center}
.fms-brand img{display:block;width:172px;max-height:44px;object-fit:contain;object-position:left center}
.fms-menu{display:none;width:42px;height:42px;border:1px solid var(--fms-line);border-radius:12px;background:#fff;font-size:19px;cursor:pointer}
.fms-shell .fms-nav{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:3px;padding:0!important;position:static}
.fms-nav a{position:relative;height:44px;border-radius:11px;padding:0 13px;display:inline-flex;align-items:center;gap:8px;
  color:#4c515c;text-decoration:none;font-size:14px;font-weight:700;white-space:nowrap;transition:background .16s,color .16s}
.fms-nav a:hover{background:#f4f5f7;color:var(--fms-ink)}
.fms-nav a.active{color:#fff;background:linear-gradient(105deg,var(--fms-brand-dark),var(--fms-brand));box-shadow:0 6px 16px rgba(152,0,19,.24)}
.fms-nav svg,.fms-bottom svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.fms-topbar-right{flex:0 0 auto;display:flex;align-items:center;gap:11px}
.fms-search{width:210px;height:42px;border:1px solid var(--fms-line);background:#f7f8f9;border-radius:12px;
  display:flex;align-items:center;gap:8px;padding:0 13px;color:var(--fms-faint);transition:border-color .15s,background .15s,width .2s}
.fms-search:focus-within{border-color:#c9cdd4;background:#fff;width:250px}
.fms-search input{border:0;outline:0;background:transparent;width:100%;font-size:13.5px;color:var(--fms-text);font-family:inherit}
.fms-date{font-size:12.5px;font-weight:600;color:var(--fms-muted);white-space:nowrap;border:1px solid var(--fms-line);border-radius:999px;padding:7px 13px;background:#fff}
.fms-shell .fms-content{width:auto!important;min-width:0;padding:calc(var(--fms-top) + 22px) 22px 48px!important;min-height:calc(100vh - 200px);position:static}
.fms-page-wrap{max-width:1400px;margin:0 auto}
.fms-page-hero{position:relative;overflow:hidden;margin:2px 0 18px;padding:26px 30px;border-radius:22px;
  border:1px solid #f0dfe1;background:linear-gradient(122deg,#fff 0%,#fffafa 46%,#fff2f3 100%);
  box-shadow:var(--fms-shadow);display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:20px}
.fms-page-hero:before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(152,0,19,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(152,0,19,.045) 1px,transparent 1px);
  background-size:30px 30px;mask-image:radial-gradient(110% 130% at 88% 0%,#000 20%,transparent 72%)}
.fms-page-hero:after{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--fms-hazard)}
.fms-hero-icon,.fms-hero-text,.fms-page-hero .fms-mode-badge{position:relative;z-index:1}
.fms-hero-icon{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;
  background:#fff;border:1px solid #f0d9dc;color:var(--fms-brand);box-shadow:0 6px 16px rgba(152,0,19,.1)}
.fms-hero-icon svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fms-hero-text h1{font-size:30px;font-weight:800;letter-spacing:-.045em;margin:0 0 7px}
.fms-hero-text p{margin:0;color:var(--fms-muted);font-size:13.5px;line-height:1.6;word-break:keep-all}
.fms-mode-badge{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;border:1px solid #ecdcde;background:rgba(255,255,255,.85);
  color:var(--fms-muted);font-size:12px;font-weight:700;border-radius:999px;padding:9px 14px;white-space:nowrap}
.fms-mode-badge:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--safe-green)}
.fms-mode-badge.warn{border-color:#f0d5b0;background:#fdf6e9;color:#7a5a11}
.fms-mode-badge.warn:before{background:#d99000}
.fms-module-slot{min-width:0}
.fms-bottom{display:none}
/* ---------- 푸터 ---------- */
.fms-shell .fms-footer{border-top:1px solid var(--fms-line);background:#fff!important;position:static}
.fms-shell .fms-footer-in{max-width:1400px;margin:0 auto!important;padding:26px 22px!important;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.fms-footer-logo img{display:block;width:150px;max-height:38px;object-fit:contain;object-position:left center;opacity:.9}
.fms-footer-txt p{margin:0;color:var(--fms-muted);font-size:12.5px;line-height:1.7;word-break:keep-all}
.fms-footer-txt small{display:block;margin-top:5px;color:var(--fms-faint);font-size:11.5px;letter-spacing:.01em}

/* ---------- Core components ---------- */
.fms-card{background:var(--fms-card);border:1px solid var(--fms-line);border-radius:var(--fms-radius);box-shadow:var(--fms-shadow)}
.fms-button{min-height:46px;border-radius:12px;border:1px solid var(--fms-line);background:#fff;padding:0 17px;
  font-weight:800;font-size:14.5px;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  text-decoration:none;color:var(--fms-text);cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s}
.fms-button:hover{background:#fafafb;transform:translateY(-2px);box-shadow:0 10px 22px rgba(21,23,28,.12)}
.fms-button:active{transform:translateY(0) scale(.98);box-shadow:0 3px 8px rgba(21,23,28,.1)}
.fms-button.primary{border:0;color:#fff;background:linear-gradient(105deg,var(--fms-brand-dark),var(--fms-brand));box-shadow:0 8px 20px rgba(152,0,19,.22)}
.fms-button.primary:hover{background:linear-gradient(105deg,#7e0010,#cf0518);box-shadow:0 6px 14px rgba(152,0,19,.28),0 16px 34px rgba(152,0,19,.32);transform:translateY(-2px)}
.fms-button.danger{border-color:#f0cbd0;color:var(--fms-brand-dark);background:#fff7f8}
.fms-sample{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;background:#fdf4e3;color:#77530a;font-size:11px;font-weight:800}

/* ---------- Module normalization (내장 앱 4종 테마 정합) ---------- */
body.fmsafe-integrated #fmsafe-module-root{min-width:0}
body.fmsafe-integrated[data-fms-module="risk"] #fmsafe-module-root>.app{max-width:none!important;margin:0!important;min-height:0!important;background:transparent!important}
body.fmsafe-integrated[data-fms-module="risk"] #fmsafe-module-root>.app>header{display:none!important}
body.fmsafe-integrated[data-fms-module="risk"] #fmsafe-module-root>.app>main{padding:0!important;max-width:none;margin:0}
body.fmsafe-integrated[data-fms-module="risk"]{--slate900:#15171c;--slate700:#4c515c;--slate200:#e4e6ea;--slate100:#f1f2f4;--slate50:#f3f4f6;
  --orange:var(--fms-brand);--orange-dark:var(--fms-brand-dark);--red:#c80019;--green:var(--safe-green);--amber:var(--safe-amber)}
body.fmsafe-integrated[data-fms-module="risk"] .card{border-color:var(--fms-line)!important;border-radius:16px!important;box-shadow:var(--fms-shadow)!important}
body.fmsafe-integrated[data-fms-module="risk"] .btn-primary{background:linear-gradient(105deg,var(--fms-brand-dark),var(--fms-brand))!important}
body.fmsafe-integrated[data-fms-module="risk"] .menu-btn{border-radius:16px!important;box-shadow:var(--fms-shadow)!important;transition:transform .15s,box-shadow .15s}
body.fmsafe-integrated[data-fms-module="risk"] .menu-btn:hover{transform:translateY(-1px);box-shadow:var(--fms-shadow-lift)}
body.fmsafe-integrated[data-fms-module="risk"] .menu-btn.special{border:1px solid #f0c6cb!important;background:linear-gradient(150deg,#fff6f7,#fff 58%)!important}
body.fmsafe-integrated[data-fms-module="risk"] .menu-btn .ico{font-size:24px;width:46px;height:46px;flex:0 0 auto;display:grid;place-items:center;background:#f3f4f6;border-radius:13px}
body.fmsafe-integrated[data-fms-module="risk"] .menu-btn.special .ico{background:#ffe9ec}
body.fmsafe-integrated[data-fms-module="risk"] .menu-btn .ico svg{width:23px;height:23px;fill:none;stroke:#4c515c;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.fmsafe-integrated[data-fms-module="risk"] .menu-btn.special .ico svg{stroke:var(--fms-brand)}

body.fmsafe-integrated[data-fms-module="inspection"]{--red:var(--fms-brand);--rd:var(--fms-brand-dark);--blue:var(--fms-brand);
  --bg:#f3f4f6;--card:#fff;--ink:#15171c;--ink2:#41454e;--ink3:#5f6570;--sep:rgba(30,31,35,.1)}
body.fmsafe-integrated[data-fms-module="inspection"] #fmsafe-module-root>.ph{max-width:none!important;margin:0!important;min-height:0!important;background:transparent!important;padding-bottom:0!important}
body.fmsafe-integrated[data-fms-module="inspection"] .nv{border-radius:18px 18px 0 0;border:1px solid var(--fms-line);border-bottom:0;padding-top:18px}
body.fmsafe-integrated[data-fms-module="inspection"] .wp{padding:16px 0}
body.fmsafe-integrated[data-fms-module="inspection"] .grp,body.fmsafe-integrated[data-fms-module="inspection"] .api,body.fmsafe-integrated[data-fms-module="inspection"] .mt{border:1px solid var(--fms-line);box-shadow:var(--fms-shadow)}
body.fmsafe-integrated[data-fms-module="inspection"] .nv .tp img{height:30px!important;max-width:210px;object-fit:contain;object-position:left}

body.fmsafe-integrated[data-fms-module="construction"] #portalSidebar,body.fmsafe-integrated[data-fms-module="construction"] .global-top{display:none!important}
body.fmsafe-integrated[data-fms-module="construction"] .portal,body.fmsafe-integrated[data-fms-module="construction"] .workspace{display:block!important;min-height:0!important}
body.fmsafe-integrated[data-fms-module="construction"] .page{padding:0!important;margin:0!important}
body.fmsafe-integrated[data-fms-module="construction"] .shell{max-width:none!important;margin:0!important}
body.fmsafe-integrated[data-fms-module="construction"] .top{position:static!important;top:auto!important;max-width:none!important;border:1px solid var(--fms-line)!important;border-radius:18px!important;margin:0 0 12px!important;box-shadow:none!important}
body.fmsafe-integrated[data-fms-module="construction"]{--brand:var(--fms-brand)!important;--brand-d:var(--fms-brand-dark)!important;
  --accent:var(--fms-brand)!important;--accent-d:var(--fms-brand-dark)!important;--bg:#f3f4f6!important;--ink:#15171c!important}
body.fmsafe-integrated[data-fms-module="construction"] .hero{border-radius:24px!important;border-color:var(--fms-line)!important;box-shadow:var(--fms-shadow)!important}
body.fmsafe-integrated[data-fms-module="construction"] .btn:not(.ghost){background:linear-gradient(105deg,var(--fms-brand-dark),var(--fms-brand))!important}
body.fmsafe-integrated[data-fms-module="construction"] .btn.ghost{background:#fff!important;color:var(--fms-text)!important;border:1px solid var(--fms-line)!important;box-shadow:none!important}
body.fmsafe-integrated[data-fms-module="construction"] .btn.ghost:hover{background:#fafafb!important}
/* 공사안전: 폭은 다른 모듈과 동일하게 두고, 내부 배치로 여백을 채운다 */
body.fmsafe-integrated[data-fms-module="construction"] .cta .in{max-width:none!important}
body.fmsafe-integrated[data-fms-module="construction"] .fldgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;margin-top:10px}
body.fmsafe-integrated[data-fms-module="construction"] .fld{display:grid;gap:0;min-width:0}
body.fmsafe-integrated[data-fms-module="construction"] .cta-nav{display:flex;justify-content:flex-end;gap:8px}
body.fmsafe-integrated[data-fms-module="construction"] .cta-nav .btn{flex:0 0 auto;width:auto!important;min-width:150px;padding:0 24px}
body.fmsafe-integrated[data-fms-module="construction"] .cta-nav .btn:last-child{min-width:220px}
/* 콘텐츠 폭을 다른 모듈(위험성평가)과 동일하게 */
body.fmsafe-integrated[data-fms-module="construction"] .wrap{max-width:none!important}
@media(max-width:700px){
  body.fmsafe-integrated[data-fms-module="construction"] .fldgrid{grid-template-columns:1fr}
  body.fmsafe-integrated[data-fms-module="construction"] .cta-nav .btn{flex:1 1 auto;width:100%!important;min-width:0}
}


body.fmsafe-integrated[data-fms-module="measurement"] #fmsafe-module-root>.app-shell{min-height:0!important;background:transparent!important}
body.fmsafe-integrated[data-fms-module="measurement"] #fmsafe-module-root>.app-shell>.topbar,body.fmsafe-integrated[data-fms-module="measurement"] #fmsafe-module-root>.app-shell>.bottom-nav{display:none!important}
body.fmsafe-integrated[data-fms-module="measurement"] #appMain{max-width:none!important;margin:0!important;padding:0!important}
body.fmsafe-integrated[data-fms-module="measurement"]{--brand:#e3071b;--brand-dark:#980013;--accent:#e3071b;--page:#f3f4f6;--surface:#fff;--line:#e4e6ea;--ink:#15171c;--muted:#5b616d}
body.fmsafe-integrated[data-fms-module="measurement"] .hero-panel{background:linear-gradient(120deg,#191b21,#38242c)!important}
body.fmsafe-integrated[data-fms-module="measurement"] .button.primary{background:linear-gradient(105deg,var(--fms-brand-dark),var(--fms-brand))!important;border-color:transparent!important}

/* ---------- Responsive ---------- */
@media(max-width:1220px){
  .fms-nav a{padding:0 10px;font-size:13.5px}
  .fms-search{width:170px}
  .fms-date{display:none}
}
@media(max-width:980px){
  :root{--fms-top:62px}
  .fms-menu{display:flex;align-items:center;justify-content:center;order:-1}
  .fms-shell .fms-topbar-in{gap:12px;padding:0 13px!important}
  .fms-brand img{width:150px}
  .fms-topbar-right{display:none}
  /* 모바일: 상단 내비를 드롭다운 패널로 */
  .fms-shell .fms-nav{position:absolute!important;left:0;right:0;top:var(--fms-top);flex-direction:column;align-items:stretch;gap:2px;
    background:#fff;border-bottom:1px solid var(--fms-line);box-shadow:0 18px 40px rgba(21,23,28,.14);
    padding:9px!important;display:none}
  body.fms-nav-open .fms-shell .fms-nav{display:flex}
  .fms-nav a{height:50px;border-radius:12px;font-size:15px;padding:0 14px}
  .fms-shell .fms-content{padding:calc(var(--fms-top) + 12px) 12px 24px!important}
  .fms-shell .fms-footer-in{padding:20px 14px!important;gap:14px}
  .fms-footer{padding-bottom:78px}
  .fms-footer-logo img{width:132px}
  .fms-footer-txt p{font-size:12px}
  .fms-page-hero{grid-template-columns:52px minmax(0,1fr);padding:20px;border-radius:18px;gap:15px}
  .fms-hero-icon{width:52px;height:52px;border-radius:15px}
  .fms-hero-icon svg{width:27px;height:27px}
  .fms-hero-text h1{font-size:23px;margin-bottom:5px}
  .fms-hero-text p{font-size:12.5px}
  .fms-page-hero .fms-mode-badge{grid-column:1/-1;justify-self:start;font-size:11px;padding:7px 11px}
  .fms-bottom{position:fixed;z-index:910;bottom:0;left:0;right:0;height:70px;background:rgba(255,255,255,.97);
    backdrop-filter:blur(15px);border-top:1px solid var(--fms-line);display:grid;grid-template-columns:repeat(5,1fr);
    padding-bottom:env(safe-area-inset-bottom)}
  .fms-bottom a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-decoration:none;
    color:#6c717b;font-size:10.5px;font-weight:700}
  .fms-bottom a.active{color:var(--fms-brand);font-weight:800}
  .fms-bottom svg{width:21px;height:21px}
  body.fmsafe-integrated[data-fms-module="inspection"] .wp{padding:12px 0}
  body.fmsafe-integrated[data-fms-module="inspection"] .nv{border-radius:15px}
  body.fmsafe-integrated[data-fms-module="construction"] .page{padding:0!important}
  body.fmsafe-integrated[data-fms-module="construction"] .fms-page-hero{display:none}
  body.fmsafe-integrated[data-fms-module="construction"] .fms-content{padding-top:calc(var(--fms-top) + 10px)}
  body.fmsafe-integrated[data-fms-module="construction"] .top{position:sticky!important;top:calc(var(--fms-top) + 6px)!important;z-index:40}
  body.fmsafe-integrated[data-fms-module="construction"] .flow{display:flex!important;overflow-x:auto;gap:2px;padding:8px 10px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  body.fmsafe-integrated[data-fms-module="construction"] .flow::-webkit-scrollbar{display:none}
  body.fmsafe-integrated[data-fms-module="construction"] .flow span{flex:0 0 auto;white-space:nowrap;padding:0 11px;font-size:12px}
}
@media(max-width:520px){
  .fms-content{padding-left:10px;padding-right:10px}
  body.fmsafe-integrated[data-fms-module="risk"] #fmsafe-module-root>.app>main{padding:0!important}
  body.fmsafe-integrated[data-fms-module="inspection"] .cat{grid-template-columns:1fr 1fr}
}
@media print{
  .fms-topbar,.fms-bottom,.fms-page-hero,.fms-footer{display:none!important}
  .fms-content{padding:0!important}
  .fms-page-wrap{max-width:none!important}
  body.fmsafe-integrated{background:#fff!important}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}