:root {
  color-scheme: light;
  font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  color: #211b2d;
  background: #edf0f3;
  font-synthesis: none;
  --ink: #211b2d;
  --muted: #746d80;
  --line: rgba(58, 43, 78, .12);
  --panel: rgba(247, 248, 250, .9);
  --coral: #ee765d;
  --violet: #7659d7;
  --blue: #3295cf;
  --amber: #d99531;
  --mint: #28a980;
  --pink: #d85f8d;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; min-height: 100vh; overflow-x: hidden; background: radial-gradient(circle at 82% 8%, rgba(118,89,215,.055), transparent 28%), radial-gradient(circle at 8% 48%, rgba(238,118,93,.05), transparent 30%), linear-gradient(180deg, #f3f4f6 0%, #e9ecf0 58%, #eef0f3 100%); }
button, input { font: inherit; }
button { color: inherit; }
a { color: inherit; }

.ambient { position: fixed; z-index: -3; width: 54vw; height: 54vw; border-radius: 50%; filter: blur(110px); opacity: .13; pointer-events: none; }
.ambient-a { top: -27vw; right: -16vw; background: #9b6cff; }
.ambient-b { top: 46vh; left: -30vw; background: #ff765d; }
.noise { position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .032; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }

.app-shell { width: min(1480px, calc(100% - 56px)); margin: 0 auto; padding: 26px 0 34px; }
.suite-nav { width: max-content; display: flex; align-items: center; gap: 4px; margin: 0 0 14px; padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: rgba(248,249,251,.94); box-shadow: 0 8px 24px rgba(55,39,78,.055); }
.suite-nav a { min-width: 132px; padding: 10px 18px; border-radius: 9px; color: #716978; font-size: 13px; font-weight: 700; text-align: center; text-decoration: none; white-space: nowrap; transition: color .2s ease, background .2s ease, box-shadow .2s ease; }
.suite-nav a:hover { color: #30283b; background: rgba(118,89,215,.07); }
.suite-nav a.active { color: #fff; background: #2a2237; box-shadow: 0 6px 18px rgba(42,34,55,.17); }
.topbar { position: relative; display: grid; grid-template-columns: minmax(205px, 1fr) auto; align-items: center; gap: 10px 14px; min-height: 64px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 13px; text-decoration: none; }
.brand-mark { position: relative; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; background: rgba(255,255,255,.04); }
.brand-mark i { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 12px var(--coral); animation: brandOrbit 4.5s linear infinite; }
.brand-mark i:nth-child(2) { background: var(--violet); animation-duration: 6.5s; animation-direction: reverse; }
.brand-mark b { font-family: "DM Mono", monospace; font-size: 15px; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 14px; letter-spacing: .04em; }
.brand small { margin-top: 3px; color: #757083; font: 500 8px/1 "DM Mono", monospace; letter-spacing: .19em; }
.top-actions { min-width: 0; display: flex; align-items: center; justify-self: end; gap: 8px; }
.top-actions > * { flex: 0 0 auto; }
.primary-nav { position: static; grid-column: 1 / -1; grid-row: 2; width: 100%; display: inline-flex; align-items: center; justify-self: center; gap: 4px; margin-top: 8px; padding: 4px; border: 1px solid var(--line); border-radius: 999px; background: rgba(248,249,251,.92); box-shadow: 0 8px 24px rgba(55,39,78,.055); transform: none; }
.primary-nav button { min-width: 92px; height: 30px; flex: 1 1 0; padding: 0 15px; border: 0; border-radius: 999px; background: transparent; color: #777080; font-size: 11px; cursor: pointer; transition: .2s ease; }
.primary-nav button.openclaw-nav { min-width: 150px; flex-grow: 1.35; }
.primary-nav button.task-export-nav { flex-grow: 1.65; }
.primary-nav button.service-order-nav { flex-grow: 1.1; }
.primary-nav button:hover { color: #30283b; background: rgba(118,89,215,.06); }
.primary-nav button.active { color: #fff; background: #2a2237; box-shadow: 0 6px 18px rgba(42,34,55,.17); }
.signal-chip, #clock { height: 36px; display: inline-flex; align-items: center; border: 1px solid var(--line); background: rgba(255,255,255,.025); }
.signal-chip { gap: 8px; padding: 0 13px; border-radius: 999px; color: #b9b3c5; font-size: 11px; white-space: nowrap; }
.signal-chip b { font-weight: 500; }
.signal-chip span { width: 6px; height: 6px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 12px var(--amber); animation: blink 1.8s ease-in-out infinite; }
#clock { min-width: 92px; justify-content: center; border-radius: 10px; color: #807a8e; font: 500 11px "DM Mono", monospace; }
.roster-trigger { height: 36px; display: inline-flex; align-items: center; gap: 9px; padding: 0 7px 0 13px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.035); color: #b4aebf; font-size: 11px; cursor: pointer; transition: .25s ease; }
.roster-trigger:hover { border-color: rgba(157,130,255,.35); background: rgba(157,130,255,.08); }
.roster-trigger b { min-width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: rgba(157,130,255,.14); color: #bbaaff; font: 500 9px "DM Mono", monospace; }
.import-trigger b { background: rgba(112,226,188,.11); color: var(--mint); }
.quality-import-trigger b { background: rgba(50,149,207,.11); color: var(--blue); }
.icon-button { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.025); cursor: pointer; transition: .25s ease; }
.icon-button:hover { background: rgba(255,255,255,.09); transform: rotate(5deg); }
.icon-button svg { width: 15px; fill: none; stroke: currentColor; stroke-width: 1.6; }

.hero { min-height: 430px; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; padding: 52px 3vw 42px; border-bottom: 1px solid var(--line); overflow: hidden; }
.kicker { display: inline-flex; align-items: center; gap: 9px; color: #7d778a; font: 500 10px "DM Mono", monospace; letter-spacing: .16em; }
.kicker i { width: 23px; height: 1px; background: var(--coral); box-shadow: 0 0 10px var(--coral); }
h1 { margin: 22px 0 18px; font-size: clamp(48px, 6vw, 92px); line-height: .99; letter-spacing: -.075em; font-weight: 800; }
h1 em { color: transparent; font-style: normal; -webkit-text-stroke: 1px rgba(245,242,251,.78); }
.hero-copy > p { max-width: 560px; color: #8e889b; font-size: 14px; line-height: 1.9; }
.range-switch { display: inline-flex; margin-top: 28px; padding: 4px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.025); }
.range-switch button { min-width: 70px; padding: 8px 13px; border: 0; border-radius: 999px; background: transparent; color: #777183; font-size: 11px; cursor: pointer; transition: .2s ease; }
.range-switch button.active { color: #17121e; background: #f0ebf5; box-shadow: 0 5px 20px rgba(255,255,255,.12); }

.orbital-stage { position: relative; width: min(410px, 42vw); aspect-ratio: 1; margin: auto; display: grid; place-items: center; }
.orbital-stage::before { content: ""; position: absolute; inset: 18%; border-radius: 50%; background: radial-gradient(circle, rgba(157,130,255,.2), transparent 66%); filter: blur(12px); }
.orbit { position: absolute; inset: 8%; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; transform: rotate(-18deg) scaleY(.58); animation: orbitalPulse 5s ease-in-out infinite; }
.orbit-two { inset: 19%; transform: rotate(37deg) scaleY(.62); border-color: rgba(255,143,112,.28); animation-delay: -2.2s; }
.orbit-three { inset: 29%; transform: rotate(-55deg) scaleY(.72); border-style: dashed; border-color: rgba(112,226,188,.22); }
.orbit i { position: absolute; top: 48%; left: -4px; width: 8px; height: 8px; border-radius: 50%; background: var(--violet); box-shadow: 0 0 16px var(--violet); }
.orbit-two i { left: auto; right: -4px; background: var(--coral); box-shadow: 0 0 16px var(--coral); }
.signal-core { position: relative; z-index: 2; width: 128px; aspect-ratio: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; background: radial-gradient(circle at 35% 25%, rgba(255,255,255,.14), rgba(20,15,32,.88) 52%, rgba(9,7,15,.96)); box-shadow: 0 0 70px rgba(157,130,255,.16), inset 0 0 34px rgba(255,255,255,.06); }
.signal-core span, .signal-core small { color: #746e80; font: 500 7px "DM Mono", monospace; letter-spacing: .17em; }
.signal-core strong { margin: 4px 0; font: 500 36px "DM Mono", monospace; }
.orbit-label { position: absolute; color: #5e596b; font: 500 7px "DM Mono", monospace; letter-spacing: .13em; }
.label-a { top: 19%; right: 10%; }.label-b { bottom: 20%; right: 7%; }.label-c { bottom: 13%; left: 10%; }

.metrics-heading { min-height: 46px; margin: 14px 0 10px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.metrics-heading h2 { margin: 0; color: #292333; font-size: 24px; line-height: 1.25; font-weight: 720; letter-spacing: -.02em; }
.metrics-heading-actions { display: flex; align-items: center; gap: 12px; }
.history-month { display: inline-flex; align-items: center; gap: 8px; color: #756d82; font-size: 13px; white-space: nowrap; }
.history-month input { border: 1px solid #d9d5e3; border-radius: 10px; padding: 8px 10px; color: #30283a; background: #fff; font: inherit; }
.metrics { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; margin: 0 0 14px; }
.metric-card { position: relative; min-height: 132px; padding: 22px 18px; display: flex; flex-direction: column; justify-content: center; gap: 10px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: rgba(18,15,29,.78); transition: none; cursor: pointer; }
.metric-card:focus-visible, .performance-row:focus-visible { outline: 3px solid rgba(118,89,215,.28); outline-offset: 2px; }
.metric-card p { margin: 0; color: #a39daa; font-size: 11px; }
.metric-card strong { font: 500 clamp(32px,3vw,46px)/1 "DM Mono", monospace; letter-spacing: -.07em; }
.metric-card strong small { margin-left: 2px; color: #696374; font-size: 13px; }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(330px, .75fr); gap: 14px; }
.panel { border: 1px solid var(--line); border-radius: 22px; background: var(--panel); backdrop-filter: blur(18px); overflow: hidden; }
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 24px 26px 18px; }
.panel-number { display: block; margin-bottom: 12px; color: #5e5869; font: 500 8px "DM Mono", monospace; letter-spacing: .13em; }
.panel h2 { margin: 0; font-size: 18px; letter-spacing: -.03em; }
.panel h2 sup { color: var(--coral); font: 500 10px "DM Mono", monospace; }
.panel-head p { margin: 6px 0 0; color: #716b7d; font-size: 11px; }
.legend { display: flex; gap: 14px; padding-top: 26px; color: #8d8798; font-size: 9px; }
.legend span::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 8px var(--coral); }
.legend .closed::before { background: var(--violet); box-shadow: 0 0 8px var(--violet); }
.chart-placeholder { position: relative; min-height: 330px; padding: 0 18px 12px; }
.chart-placeholder svg { width: 100%; height: auto; overflow: visible; }
.grid-lines path { fill: none; stroke: rgba(255,255,255,.05); stroke-width: 1; }
.chart-line { fill: none; stroke-width: 2; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: .38; animation: drawLine 2.2s .7s ease forwards; }
.line-a { stroke: url(#lineA); }.line-b { stroke: url(#lineB); }
.area { opacity: .55; }
.axis-labels { fill: #514c5b; font: 9px "DM Mono", monospace; }
.placeholder-veil { position: absolute; inset: 26% 24% 24%; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.08); border-radius: 999px; background: rgba(11,9,20,.73); backdrop-filter: blur(12px); box-shadow: 0 18px 50px rgba(0,0,0,.25); }
.placeholder-veil span { color: var(--amber); animation: slowSpin 5s linear infinite; }
.placeholder-veil strong { margin-top: 8px; font-size: 12px; }.placeholder-veil small { margin-top: 4px; color: #615b6b; font: 7px "DM Mono", monospace; letter-spacing: .14em; }
.tiny-chip { margin-top: 24px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 999px; color: #777181; font: 500 8px "DM Mono", monospace; }
.ranking-list { list-style: none; margin: 0; padding: 0 19px 20px; }
.ranking-list li { display: grid; grid-template-columns: 28px 38px 1fr auto; align-items: center; gap: 10px; min-height: 58px; padding: 8px; border-top: 1px solid rgba(255,255,255,.055); }
.ranking-list .rank { color: #5c5665; font: 500 9px "DM Mono", monospace; }
.ranking-list .avatar { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: #5f5968; border: 1px dashed rgba(255,255,255,.16); font: 500 11px "DM Mono", monospace; }
.person strong, .person small { display: block; }.person strong { color: #a29cab; font-size: 11px; font-weight: 500; }.person small { margin-top: 4px; color: #514c5a; font: 7px "DM Mono", monospace; }
.ranking-list b { color: #736d7b; font: 500 15px "DM Mono", monospace; }
.ranking-list .rank-one { border-radius: 12px; background: linear-gradient(90deg, rgba(255,198,109,.06), transparent); }
.rank-one .rank { color: var(--amber)!important; }.rank-one .avatar { border-color: rgba(255,198,109,.3)!important; color: var(--amber)!important; }
.followup-panel { grid-column: 1 / -1; }
.text-button { margin-top: 23px; padding: 0; border: 0; background: transparent; color: #665f70; font-size: 10px; }
.table-head { display: grid; grid-template-columns: 1.35fr .8fr 1fr .8fr .55fr; gap: 18px; padding: 11px 28px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: #5e5868; font: 500 8px "DM Mono", monospace; letter-spacing: .08em; }
.empty-state { min-height: 180px; display: flex; align-items: center; justify-content: center; gap: 24px; padding: 32px; }
.empty-state strong { font-size: 13px; }.empty-state p { margin: 5px 0 0; color: #6e6878; font-size: 11px; }
.empty-code { margin-left: 60px; color: #4f4958; font: 500 8px "DM Mono", monospace; letter-spacing: .12em; }
.empty-planet { position: relative; width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid rgba(255,143,112,.24); border-radius: 50%; background: radial-gradient(circle at 35% 30%, rgba(255,143,112,.24), transparent 62%); }
.empty-planet span { width: 20px; height: 20px; border: 1px solid rgba(255,143,112,.42); border-radius: 50%; }
.empty-planet i { position: absolute; inset: 22px -10px; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; transform: rotate(-18deg); }

.performance-panel { margin: 14px 0; }
.performance-benchmarks { min-height: 58px; display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 10px 28px; border-bottom: 1px solid var(--line); }
.performance-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding: 27px 28px 22px; }
.performance-head h2 { margin: 0; font-size: 22px; letter-spacing: -.04em; }
.performance-head p { margin: 7px 0 0; color: #81798b; font-size: 11px; }
.target-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 13px; border: 1px solid rgba(238,118,93,.22); border-radius: 999px; background: rgba(238,118,93,.07); color: #b64f3b; font-size: 10px; }
.target-chip span { width: 7px; height: 7px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 9px rgba(238,118,93,.48); }
.target-chip b { font-weight: 700; }
.target-chip.met { border-color: rgba(40,169,128,.22); background: rgba(40,169,128,.07); color: #177d60; }
.target-chip.met span { background: var(--mint); box-shadow: 0 0 9px rgba(40,169,128,.5); }
.target-chip.missed span { background: var(--coral); box-shadow: 0 0 9px rgba(238,118,93,.5); }
.performance-actions { min-width: 210px; display: flex; flex-direction: column; align-items: flex-end; gap: 9px; }
.share-button { min-width: 152px; height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid rgba(118,89,215,.2); border-radius: 11px; background: rgba(118,89,215,.08); color: #6048b4; font-size: 11px; font-weight: 700; cursor: pointer; transition: .2s ease; }
.share-button span { font: 600 15px/1 "DM Mono", monospace; }
.share-button:hover { transform: translateY(-1px); border-color: rgba(118,89,215,.38); background: rgba(118,89,215,.13); box-shadow: 0 8px 22px rgba(85,62,127,.1); }
.share-button:disabled { cursor: wait; opacity: .62; transform: none; box-shadow: none; }
.share-button.success { border-color: rgba(40,169,128,.28); background: rgba(40,169,128,.1); color: #177d60; }
.share-feedback { min-height: 13px; color: #777080; font-size: 9px; }
.share-feedback.error { color: #c94f3a; }
.performance-scroll { overflow-x: auto; scrollbar-color: #d3d5da transparent; }
.performance-table-head, .performance-row { min-width: 1100px; display: grid; grid-template-columns: minmax(190px,1.3fr) repeat(4,minmax(86px,.58fr)) repeat(3,minmax(108px,.72fr)); align-items: center; column-gap: 14px; }
.performance-table-head { min-height: 40px; padding: 0 28px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(222,225,230,.42); color: #5f5769; font: 700 10px "DM Mono", monospace; letter-spacing: .035em; }
.performance-table-head span:not(:first-child) { text-align: right; }
.performance-list { padding: 0 14px 12px; }
.performance-row { position: relative; min-height: 56px; padding: 6px 14px; border-bottom: 1px solid rgba(65,48,88,.075); border-radius: 11px; transition: transform .2s ease, background .2s ease; }
.performance-row[data-person-name] { cursor: pointer; }
.performance-row:hover { z-index: 1; transform: translateY(-1px); background: rgba(255,255,255,.55); }
.performance-person { display: grid; grid-template-columns: 28px 32px 1fr; align-items: center; gap: 9px; min-width: 0; }
.performance-rank { color: #9b93a1; font: 500 9px "DM Mono", monospace; }
.performance-avatar { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(118,89,215,.16); border-radius: 50%; background: rgba(118,89,215,.07); color: #654bc0; font-size: 10px; font-weight: 700; }
.performance-person strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.performance-person strong { color: #352e40; font-size: 12px; }
.performance-value { text-align: right; color: #4f4759; font: 500 14px "DM Mono", monospace; }
.performance-value.rate { color: #786f82; }
.performance-value.quality-rate { color: #326f9f; font-weight: 650; }
.performance-value.primary-rate { justify-self: end; min-width: 76px; padding: 7px 9px; border-radius: 9px; color: #147a5c; background: rgba(40,169,128,.09); font-weight: 700; }
.performance-row.below-target { margin: 3px 0; border-color: rgba(238,118,93,.14); background: rgba(238,118,93,.075); box-shadow: inset 3px 0 0 var(--coral); }
.performance-row.below-target:hover { background: rgba(238,118,93,.105); }
.performance-row.below-target .performance-value.primary-rate { color: #c34732; background: rgba(238,118,93,.13); }
.performance-loading { min-height: 130px; display: grid; place-items: center; color: #847c8d; font-size: 11px; }
.monitor-view { min-height: 430px; margin: 14px 0; padding: 28px; }
.monitor-placeholder { min-height: 330px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.monitor-placeholder > span { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid rgba(118,89,215,.18); border-radius: 50%; background: rgba(118,89,215,.07); color: var(--violet); font-size: 20px; }
.monitor-placeholder h2 { margin: 16px 0 0; font-size: 22px; }
.monitor-placeholder p { margin: 8px 0 0; color: #81798b; font-size: 11px; }

.followup-view { margin: 14px 0; }
.followup-hero { min-height: 108px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 28px; }
.followup-hero h2, .followup-details h3, .followup-people h3 { margin: 0; color: #292333; font-size: 24px; letter-spacing: -.035em; }
.followup-hero p { margin: 7px 0 0; color: #7b7485; font-size: 14px; }
.followup-hero-actions { display: flex; align-items: center; gap: 12px; }
.followup-snapshot { color: #777080; font-size: 13px; white-space: nowrap; }
.followup-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin: 12px 0; }
.followup-card { min-height: 124px; padding: 19px 22px; display: grid; grid-template-columns: 1fr auto; align-items: center; text-align: left; border: 1px solid var(--line); border-radius: 17px; color: #312a3c; background: rgba(248,249,251,.93); cursor: pointer; transition: border-color .2s, box-shadow .2s; }
.followup-card span { font-size: 15px; font-weight: 700; }
.followup-card strong { grid-row: 1 / 3; grid-column: 2; font-size: 42px; font-variant-numeric: tabular-nums; }
.followup-card small { color: #857d8d; font-size: 12px; }
.followup-card.active { border-color: rgba(118,89,215,.4); box-shadow: inset 4px 0 0 #7659d7, 0 12px 28px rgba(57,42,77,.07); }
.followup-card.critical strong { color: #c34732; }
.followup-layout { display: grid; grid-template-columns: minmax(360px,.72fr) minmax(0,1.8fr); gap: 12px; }
.followup-people, .followup-details { min-height: 520px; }
.followup-people > header, .followup-detail-head { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 24px; }
.followup-people h3, .followup-details h3 { font-size: 20px; }
.followup-people > header > b { padding: 7px 10px; border-radius: 999px; color: #624ab7; background: rgba(118,89,215,.09); font-size: 13px; }
.followup-people-head, .followup-person-row { display: grid; grid-template-columns: minmax(96px,1.3fr) repeat(4,minmax(54px,.6fr)); align-items: center; gap: 8px; }
.followup-people-head { min-height: 42px; padding: 0 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: #756d80; background: rgba(222,225,230,.42); font-size: 12px; font-weight: 700; }
.followup-people-head span:not(:first-child), .followup-person-row span, .followup-person-row b { text-align: right; }
.followup-people-list { padding: 4px 12px 12px; }
.followup-person-row { width: 100%; min-height: 48px; padding: 0 8px; border: 0; border-bottom: 1px solid rgba(65,48,88,.07); color: #4f4759; background: transparent; font-size: 13px; cursor: pointer; }
.followup-person-row:hover { border-radius: 9px; background: rgba(118,89,215,.06); }
.followup-person-row strong { color: #30283b; text-align: left; }
.followup-person-row .critical { color: #c34732; font-weight: 700; }
.followup-person-row b { color: #30283b; }
.followup-detail-head { border-bottom: 1px solid var(--line); }
.followup-search { width: min(280px,42%); display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 9px; color: #7b7485; font-size: 12px; }
.followup-search input { min-width: 0; height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; outline: none; color: #332b3d; background: #eceef2; font-size: 13px; }
.followup-search input:focus { border-color: rgba(118,89,215,.42); box-shadow: 0 0 0 3px rgba(118,89,215,.08); }
.followup-detail-meta { min-height: 42px; display: flex; align-items: center; justify-content: space-between; padding: 0 22px; color: #777080; font-size: 12px; }
.followup-detail-meta b { color: #352e40; font-size: 13px; }
.followup-detail-scroll { overflow-x: auto; }
.followup-detail-table-head, .followup-detail-row { min-width: 960px; display: grid; grid-template-columns: 1.2fr .72fr 1.05fr .75fr .8fr .8fr .62fr; align-items: center; gap: 12px; }
.followup-detail-table-head { min-height: 42px; padding: 0 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: #675f72; background: rgba(222,225,230,.42); font-size: 12px; font-weight: 700; }
.followup-detail-row { min-height: 52px; padding: 0 20px; border-bottom: 1px solid rgba(65,48,88,.07); color: #554d60; font-size: 13px; }
.followup-detail-row strong { overflow: hidden; color: #30283b; text-overflow: ellipsis; white-space: nowrap; }
.followup-detail-row time { color: #756d80; font-variant-numeric: tabular-nums; }
.followup-detail-row b { color: #c34732; }
.followup-detail-row em { width: max-content; padding: 5px 8px; border-radius: 999px; color: #8b6525; background: rgba(217,149,49,.1); font-style: normal; font-size: 12px; }
.followup-empty { min-height: 120px; display: grid; place-items: center; margin: 0; color: #847c8d; font-size: 14px; }
.followup-empty.error { color: #c34732; }
.followup-more { width: calc(100% - 40px); height: 40px; margin: 12px 20px 18px; border: 1px solid rgba(118,89,215,.2); border-radius: 10px; color: #6048b4; background: rgba(118,89,215,.07); font-size: 13px; font-weight: 700; cursor: pointer; }

.task-export-view { margin: 14px 0; }
.task-export-hero { min-height: 118px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 25px 28px; }
.task-export-hero h2, .task-export-table h3 { margin: 0; color: #292333; font-size: 24px; letter-spacing: -.035em; }
.task-export-hero p { margin: 7px 0 0; color: #7b7485; font-size: 14px; }
.task-export-meta { display: flex; min-width: 190px; flex-direction: column; align-items: flex-end; }
.task-export-meta strong { color: #2b2337; font-size: 40px; line-height: 1; font-variant-numeric: tabular-nums; }
.task-export-meta span { margin-top: 8px; color: #7b7485; font-size: 12px; white-space: nowrap; }
.task-export-meta small { margin-top: 5px; color: #168665; font-size: 11px; white-space: nowrap; }
.task-export-meta small.stale { color: #c34732; }
.task-export-meta button { min-height: 34px; margin-top: 9px; padding: 0 13px; border: 1px solid rgba(118,89,215,.22); border-radius: 9px; color: #6248c2; background: rgba(118,89,215,.07); font-size: 12px; font-weight: 750; cursor: pointer; }
.task-export-meta button:disabled { opacity: .55; cursor: wait; }
.task-copy-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin: 12px 0; }
.task-copy-card { min-height: 172px; padding: 20px 22px; }
.task-copy-card > span { color: #9b93a3; font-size: 10px; letter-spacing: .12em; }
.task-copy-card h3 { margin: 8px 0 4px; color: #30283b; font-size: 19px; }
.task-copy-card p { min-height: 22px; margin: 0 0 16px; color: #7b7485; font-size: 12px; }
.task-copy-card button { width: 100%; height: 42px; border: 1px solid rgba(118,89,215,.22); border-radius: 11px; color: #5e47b0; background: rgba(118,89,215,.07); font-size: 13px; font-weight: 700; cursor: pointer; }
.task-copy-card.featured { border-color: rgba(118,89,215,.28); box-shadow: inset 0 3px 0 #7659d7, 0 14px 38px rgba(58,49,69,.065); }
.task-copy-card.featured button { color: #fff; background: #2a2237; }
.task-copy-card button:disabled { opacity: .5; cursor: wait; }
.task-copy-card small { display: block; min-height: 18px; margin-top: 7px; color: #168665; text-align: center; font-size: 11px; }
.task-copy-card small.error { color: #c34732; }
.task-duplicate-copy { margin: 0 0 12px; padding: 20px 22px; border-color: rgba(211,145,50,.2); background: rgba(250,249,247,.95); }
.task-duplicate-copy > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.task-duplicate-copy h3 { margin: 5px 0 0; color: #30283b; font-size: 20px; }
.task-duplicate-copy > header > strong { padding: 7px 10px; border-radius: 999px; color: #9b6421; background: rgba(217,149,49,.1); font-size: 12px; white-space: nowrap; }
.task-duplicate-header-actions { display: flex; align-items: center; gap: 9px; }
.task-duplicate-header-actions strong { padding: 7px 10px; border-radius: 999px; color: #9b6421; background: rgba(217,149,49,.1); font-size: 12px; white-space: nowrap; }
.task-duplicate-header-actions button { min-height: 34px; padding: 0 12px; border: 1px solid rgba(211,145,50,.28); border-radius: 9px; color: #8d5b1f; background: #fff; font-size: 12px; font-weight: 750; cursor: pointer; }
.task-duplicate-guide { margin: 10px 0 15px; color: #716978; font-size: 13px; line-height: 1.7; }
.task-duplicate-groups { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.task-duplicate-groups article { padding: 15px; border: 1px solid rgba(211,145,50,.18); border-radius: 13px; background: rgba(255,255,255,.74); }
.task-duplicate-groups article.empty { opacity: .55; }
.task-duplicate-groups article > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.task-duplicate-groups h4 { margin: 0; color: #30283b; font-size: 17px; }
.task-duplicate-groups [data-duplicate-count] { color: #a16a28; font-size: 12px; font-weight: 750; }
.task-duplicate-groups p { margin: 7px 0 12px; color: #817986; font-size: 12px; }
.task-duplicate-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.task-duplicate-actions button { min-height: 38px; border: 1px solid rgba(211,145,50,.25); border-radius: 10px; color: #8d5b1f; background: rgba(217,149,49,.08); font-size: 12px; font-weight: 700; cursor: pointer; }
.task-duplicate-actions button:disabled { opacity: .5; cursor: wait; }
.task-duplicate-groups small { display: block; min-height: 18px; margin-top: 7px; color: #168665; text-align: center; font-size: 11px; }
.task-duplicate-groups small.error { color: #c34732; }
.task-duplicate-empty { grid-column: 1/-1; margin: 0; padding: 18px; border: 1px dashed rgba(211,145,50,.24); border-radius: 12px; color: #817986; text-align: center; font-size: 13px; }
.duplicate-follower-form { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto; align-items: end; gap: 12px; padding: 20px 28px 14px; }
.duplicate-follower-form label { display: grid; gap: 7px; color: #655e70; font-size: 12px; font-weight: 700; }
.duplicate-follower-form input { min-width: 0; height: 44px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; outline: none; color: #332b3d; background: #eceef2; font-size: 14px; }
.duplicate-follower-form input:focus { border-color: rgba(118,89,215,.42); box-shadow: 0 0 0 3px rgba(118,89,215,.08); }
.duplicate-follower-form .save-person { min-height: 44px; white-space: nowrap; }
.duplicate-follower-settings-list { display: grid; gap: 8px; margin: 0 28px 12px; }
.duplicate-follower-settings-list article { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 14px; border: 1px solid rgba(65,48,88,.08); border-radius: 10px; background: rgba(247,247,249,.82); }
.duplicate-follower-settings-list strong { color: #30283b; font-size: 15px; }
.duplicate-follower-settings-list span { color: #817986; font-size: 12px; }
.duplicate-follower-settings-list button { min-height: 32px; padding: 0 11px; border: 1px solid rgba(195,71,50,.18); border-radius: 8px; color: #b54835; background: rgba(195,71,50,.05); font-size: 12px; cursor: pointer; }
.duplicate-follower-dialog .person-feedback { margin: 0 28px 12px; }
.task-export-table > header { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.task-export-table h3 { font-size: 20px; }
.task-export-table label { width: min(290px,42%); display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 9px; color: #7b7485; font-size: 12px; }
.task-export-table input { min-width: 0; height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; outline: none; color: #332b3d; background: #eceef2; font-size: 13px; }
.task-export-table input:focus { border-color: rgba(118,89,215,.42); box-shadow: 0 0 0 3px rgba(118,89,215,.08); }
.task-export-scroll { overflow-x: auto; }
.task-export-head, .task-export-row { min-width: 1100px; display: grid; grid-template-columns: 1.15fr .62fr 2.5fr 1.05fr .7fr; align-items: center; gap: 14px; }
.task-export-head { min-height: 44px; padding: 0 20px; color: #675f72; background: rgba(222,225,230,.42); font-size: 12px; font-weight: 700; }
.task-export-row { min-height: 58px; padding: 7px 20px; border-bottom: 1px solid rgba(65,48,88,.07); color: #554d60; font-size: 13px; }
.task-export-row strong { overflow: hidden; color: #30283b; text-overflow: ellipsis; white-space: nowrap; }
.task-export-row em { width: max-content; padding: 5px 8px; border-radius: 999px; color: #8b6525; background: rgba(217,149,49,.1); font-style: normal; font-size: 12px; }
.task-export-row .activity { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.45; }
.task-export-row time { color: #756d80; font-variant-numeric: tabular-nums; }
.task-export-row b { color: #4e3b97; }
.task-export-row.duplicate-follower { background: rgba(217,149,49,.055); }
.task-follower-cell { display: flex; align-items: center; gap: 7px; }
.task-follower-cell small { padding: 3px 6px; border-radius: 999px; color: #9b6421; background: rgba(217,149,49,.12); font-size: 9px; white-space: nowrap; }
.task-export-empty { min-height: 150px; display: grid; place-items: center; margin: 0; color: #847c8d; font-size: 14px; }
.task-export-empty.error { color: #c34732; }

.service-order-view { margin: 14px 0; }
.service-order-hero { min-height: 122px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 24px 26px; }
.service-order-hero h2 { margin: 0; color: #292333; font-size: 24px; letter-spacing: -.04em; }
.service-order-hero p { max-width: 780px; margin: 7px 0 0; color: #7b7485; font-size: 14px; line-height: 1.65; }
.service-order-toolbar { display: flex; align-items: flex-end; justify-content: flex-end; flex-wrap: wrap; gap: 8px; flex: 0 0 auto; }
.service-order-toolbar label { display: grid; gap: 7px; color: #7b7485; font-size: 12px; font-weight: 650; }
.service-order-toolbar input { width: 156px; height: 44px; padding: 0 11px; border: 1px solid var(--line); border-radius: 10px; outline: none; color: #332b3d; background: #eceef2; font-size: 13px; }
.service-order-toolbar input[readonly] { cursor: default; }
.service-order-toolbar input:focus { border-color: rgba(118,89,215,.42); box-shadow: 0 0 0 3px rgba(118,89,215,.08); }
.service-order-toolbar .schedule-button { min-width: 112px; }
.service-order-action-feedback { min-height: 18px; flex: 1 0 100%; color: #7b7485; font-size: 12px; font-weight: 650; line-height: 1.45; text-align: right; }
.service-order-action-feedback.success { color: #15816a; }
.service-order-action-feedback.warning { color: #9a681d; }
.service-order-action-feedback.error { color: #c34732; }

.service-order-rules { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin: 10px 0; }
.service-order-rules article { min-height: 82px; display: flex; align-items: flex-start; justify-content: center; flex-direction: column; gap: 5px; padding: 15px 18px; border: 1px solid var(--line); border-radius: 15px; background: rgba(248,249,251,.93); box-shadow: 0 10px 28px rgba(58,49,69,.05); }
.service-order-rules span { color: #786f82; font-size: 12px; }
.service-order-rules strong { color: #2f2938; font-size: 15px; }
.service-order-rules article::before { content: ""; width: 26px; height: 3px; margin-bottom: 3px; border-radius: 99px; background: var(--mint); }
.service-order-rules article:nth-child(2)::before { background: var(--amber); }
.service-order-rules article.cutoff { border-color: rgba(238,118,93,.22); background: rgba(255,247,245,.94); }
.service-order-rules article.cutoff::before { background: var(--coral); }
.service-order-rules article.cutoff strong { color: #b54835; }
.service-order-rules article.allocation { border-color: rgba(118,89,215,.2); background: rgba(247,244,255,.94); }
.service-order-rules article.allocation::before { background: #7659d7; }
.service-order-rules article.allocation strong { color: #544092; }
.service-order-rules article.allocation small { color: #85769a; font-size: 10px; line-height: 1.45; }

.service-order-board { margin-top: 10px; }
.service-order-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.service-order-table { width: 100%; min-width: 1020px; border-spacing: 0; border-collapse: separate; table-layout: fixed; color: #202633; background: #fff; }
.service-order-table .service-order-group-column { width: 104px; }
.service-order-table caption { caption-side: top; padding: 11px 18px 12px; border-bottom: 1px solid rgba(25,37,57,.58); color: #fff; background: #355f9d; font-size: 26px; font-weight: 750; line-height: 1.15; text-align: center; }
.service-order-table caption time { margin-left: 8px; font-variant-numeric: tabular-nums; }
.service-order-table th, .service-order-table td { height: 54px; padding: 7px 8px; border-right: 1px solid rgba(25,37,57,.52); border-bottom: 1px solid rgba(25,37,57,.52); text-align: center; vertical-align: middle; }
.service-order-table tr > :first-child { border-left: 1px solid rgba(25,37,57,.52); }
.service-order-table th { font-weight: 700; }
.service-order-table th > span, .service-order-table th > small { display: block; }
.service-order-table th > small { margin-top: 4px; color: #7d8390; font-size: 10px; font-weight: 600; }
.service-order-time-row > th:not(:first-child), .service-order-complaint-time-row > th:not(:first-child) { color: #161b25; background: #b5c9e5; font-size: 15px; line-height: 1.2; }
.service-order-time-row > th:first-child, .service-order-complaint-time-row > th:first-child { position: sticky; z-index: 2; left: 0; background: #f8f9fb; font-size: 15px; }
.service-order-time-row > th:first-child, .service-order-complaint-time-row > th:first-child, .service-order-shift-row th { pointer-events: none; }
.service-order-table th.no-outbound { color: #8d3a2d; background: #c5d2e5; }
.service-order-table th.no-outbound small { display: block; margin-top: 4px; color: #b54835; font-size: 10px; }
.service-order-assignee-row td { height: 48px; padding: 0; color: #fa493d; background: #fff35b; }
.service-order-assignee-row td.after-cutoff { background: #ffed6e; }
.service-order-person { width: 100%; height: 47px; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 1px; padding: 3px 7px; border: 0; color: inherit; background: transparent; cursor: pointer; }
.service-order-person strong { overflow: hidden; max-width: 100%; font-size: 16px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.service-order-person small { max-width: 100%; overflow: hidden; color: #8f6720; font-size: 9px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.service-order-person:hover, .service-order-person:focus-visible { outline: none; box-shadow: inset 0 0 0 3px rgba(118,89,215,.25); }
.service-order-edit-select { width: 100%; height: 47px; padding: 0 24px 0 8px; border: 0; outline: none; color: #db3f32; background: transparent; font-size: 15px; font-weight: 750; text-align: center; text-align-last: center; cursor: pointer; }
.service-order-edit-select:focus-visible { box-shadow: inset 0 0 0 3px rgba(118,89,215,.32); }
.service-order-assignee-row td.manually-adjusted { box-shadow: inset 0 -4px 0 rgba(118,89,215,.72); }
.service-order-person.unassigned strong { font-size: 13px; }
.service-order-assignee-row td.unassigned { color: #9a7024; background: #fff5b5; }
.service-order-assignee-row td.error { color: #b54835; background: #fff0ec; }
.service-order-loading { color: #958a56; font-size: 12px; font-weight: 650; }
.service-order-complaint-row td { height: 48px; padding: 0; background: #fff35b; }
.service-order-complaint-row input { width: 100%; height: 47px; padding: 0 10px; border: 0; outline: none; color: #24202a; background: transparent; font-size: 16px; font-weight: 750; text-align: center; }
.service-order-complaint-row input::placeholder { color: #9a8d42; font-size: 12px; font-weight: 600; }
.service-order-complaint-row input:focus { box-shadow: inset 0 0 0 3px rgba(118,89,215,.26); }
.service-order-shift-row th { position: sticky; z-index: 2; left: 0; color: #706879; background: #f8f9fb; font-size: 12px; }
.service-order-shift-row td { height: 34px; padding: 5px 7px; color: #ff4b40; background: #fff35b; font-size: 13px; font-weight: 750; }
.service-order-board-foot { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 11px 17px; color: #766e80; background: #f3f4f6; font-size: 12px; }
.service-order-board-foot b { display: inline-flex; align-items: center; gap: 8px; color: #a84433; font-size: 12px; font-weight: 700; text-align: right; }
.service-order-board-foot i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--coral); box-shadow: 0 0 9px rgba(238,118,93,.45); }

.service-order-insights { display: grid; grid-template-columns: 1.15fr .85fr; gap: 10px; margin-top: 10px; }
.service-order-insights > section { min-height: 174px; }
.service-order-insights header { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 20px 12px; border-bottom: 1px solid var(--line); }
.service-order-insights h3 { margin: 0; color: #2f2938; font-size: 18px; }
.service-order-insights header > b { min-width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: #a84433; background: rgba(238,118,93,.1); font-size: 13px; }
.service-order-insights .panel-number { margin-bottom: 5px; }
#serviceOrderReasons, #serviceOrderWarnings { padding: 11px 20px 17px; }
#serviceOrderReasons p, #serviceOrderWarnings p { margin: 0; color: #7c7486; font-size: 13px; line-height: 1.65; }
.service-order-policy-note { display: grid; gap: 5px; margin-bottom: 9px; padding: 10px 12px; border: 1px solid rgba(118,89,215,.13); border-radius: 10px; color: #5d4a88; background: rgba(118,89,215,.055); font-size: 11px; line-height: 1.5; }
.service-order-policy-note span { position: relative; padding-left: 13px; }
.service-order-policy-note span::before { content: ""; position: absolute; left: 0; top: .58em; width: 5px; height: 5px; border-radius: 50%; background: #7659d7; }
.service-order-reason-list, .service-order-warning-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.service-order-reason-list li { display: grid; grid-template-columns: minmax(150px,.7fr) minmax(0,1.6fr) auto; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid rgba(65,48,88,.07); }
.service-order-reason-list li:last-child, .service-order-warning-list li:last-child { border-bottom: 0; }
.service-order-reason-list strong { color: #3a3245; font-size: 13px; }
.service-order-reason-list span { color: #766e80; font-size: 12px; line-height: 1.55; }
.service-order-reason-list button { min-width: 76px; height: 32px; padding: 0 10px; border: 1px solid rgba(118,89,215,.18); border-radius: 9px; color: #6048b4; background: rgba(118,89,215,.06); font-size: 11px; font-weight: 700; cursor: pointer; }
.service-order-reason-list button:hover { border-color: rgba(118,89,215,.35); background: rgba(118,89,215,.12); }
.service-order-warning-list li { position: relative; padding: 7px 0 7px 17px; border-bottom: 1px solid rgba(65,48,88,.07); color: #8d4b3e; font-size: 12px; line-height: 1.55; }
.service-order-warning-list li::before { content: "!"; position: absolute; left: 0; top: 7px; color: var(--coral); font-weight: 800; }
.service-order-alerts.clear header > b { color: #16775d; background: rgba(40,169,128,.11); }

.roster-dialog.service-order-detail-dialog { width: min(1080px, calc(100% - 28px)); }
.service-order-detail-dialog .dialog-shell { height: min(860px, calc(100vh - 28px)); }
.service-order-detail-head { padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.service-order-detail-body { min-height: 0; padding: 18px 24px 22px; overflow-y: auto; scrollbar-color: #d8d0e1 transparent; }
.service-order-detail-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.service-order-detail-summary article { min-width: 0; min-height: 105px; display: flex; justify-content: center; flex-direction: column; padding: 13px 15px; border: 1px solid rgba(65,48,88,.09); border-radius: 13px; background: rgba(255,255,255,.7); }
.service-order-detail-summary article::before { content: ""; width: 24px; height: 3px; margin-bottom: 8px; border-radius: 99px; background: #7659d7; }
.service-order-detail-summary article.capacity::before { background: #3295cf; }
.service-order-detail-summary article.efficiency::before { background: #28a980; }
.service-order-detail-summary article.fairness::before { background: #d99531; }
.service-order-detail-summary article.priority::before { background: #9a879f; }
.service-order-detail-summary article.schedule::before { background: #ee765d; }
.service-order-detail-summary span { color: #7b7385; font-size: 11px; }
.service-order-detail-summary strong { margin-top: 4px; overflow-wrap: anywhere; color: #2d2636; font-size: 18px; line-height: 1.25; }
.service-order-detail-summary small { margin-top: 5px; color: #8d8595; font-size: 10px; line-height: 1.4; }
.service-order-detail-context { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-top: 10px; }
.service-order-detail-context > article { min-width: 0; padding: 13px 15px; border: 1px solid rgba(65,48,88,.085); border-radius: 13px; background: #eceef2; }
.service-order-detail-context > article.schedule { grid-column: 1 / -1; }
.service-order-detail-context > article > span { display: block; color: #8a8292; font-size: 10px; font-weight: 700; }
.service-order-detail-context > article > strong { display: block; margin-top: 4px; color: #494151; font-size: 13px; line-height: 1.5; }
.service-order-detail-context > article > small { display: block; margin-top: 4px; color: #8a8292; font-size: 10px; }
.service-order-detail-context > article.inventory { box-shadow: inset 3px 0 0 #28a980; }
.service-order-detail-context > article.inventory.pressure-medium { box-shadow: inset 3px 0 0 #d99531; }
.service-order-detail-context > article.inventory.pressure-high, .service-order-detail-context > article.inventory.pressure-critical { background: rgba(238,118,93,.075); box-shadow: inset 3px 0 0 #d75e49; }
.service-order-detail-context > article.newcomer-support { background: rgba(118,89,215,.055); box-shadow: inset 3px 0 0 #7659d7; }
.service-order-schedule-strip { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; margin-top: 8px; }
.service-order-schedule-strip > span { min-width: 0; display: flex; align-items: center; gap: 7px; padding: 8px 9px; border-radius: 9px; color: #5e5669; background: rgba(40,169,128,.08); font-size: 11px; line-height: 1.35; }
.service-order-schedule-strip > span.missing { color: #a34a3b; background: rgba(238,118,93,.09); }
.service-order-schedule-strip b { flex: 0 0 auto; color: #16775d; }
.service-order-schedule-strip .missing b { color: #b54835; }
.service-order-candidate-section { margin-top: 11px; overflow: hidden; border: 1px solid rgba(65,48,88,.09); border-radius: 15px; background: rgba(255,255,255,.66); }
.service-order-candidate-section > header { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 13px 16px; border-bottom: 1px solid var(--line); }
.service-order-candidate-section h3 { margin: 0; color: #332b3d; font-size: 16px; }
.service-order-candidate-section .panel-number { margin-bottom: 3px; }
.service-order-candidate-section > header > span { flex: 0 0 auto; color: #7b7385; font-size: 11px; }
.service-order-candidate-list { display: grid; gap: 7px; padding: 9px; }
.service-order-candidate { overflow: hidden; border: 1px solid rgba(65,48,88,.08); border-radius: 12px; background: #f4f5f7; }
.service-order-candidate.selected { border-color: rgba(40,169,128,.3); background: rgba(40,169,128,.055); box-shadow: inset 3px 0 0 #28a980; }
.service-order-candidate.excluded { border-color: rgba(238,118,93,.17); background: rgba(238,118,93,.045); }
.service-order-candidate > header { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; align-items: center; gap: 10px; min-height: 56px; padding: 8px 11px; }
.service-order-candidate-rank { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: #665d72; background: #e4e2e8; font-size: 11px; font-weight: 800; }
.service-order-candidate.selected .service-order-candidate-rank { color: #fff; background: #28a980; }
.service-order-candidate.excluded .service-order-candidate-rank { color: #fff; background: #d75e49; }
.service-order-candidate > header div { min-width: 0; }
.service-order-candidate > header strong, .service-order-candidate > header small { display: block; }
.service-order-candidate > header strong { color: #332b3d; font-size: 14px; }
.service-order-candidate > header small { margin-top: 3px; overflow: hidden; color: #7d7587; font-size: 11px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.service-order-candidate-tier { padding: 5px 8px; border-radius: 999px; color: #655d70; background: #e6e4e9; font-size: 10px; font-weight: 750; white-space: nowrap; }
.service-order-candidate-tier.fallback { color: #986317; background: rgba(217,149,49,.13); }
.service-order-candidate-tier.secondary_fallback { color: #6048b4; background: rgba(118,89,215,.1); }
.service-order-candidate-tier.newcomer { color: #2679aa; background: rgba(50,149,207,.12); }
.service-order-candidate-metrics { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 1px; border-top: 1px solid rgba(65,48,88,.07); background: rgba(65,48,88,.07); }
.service-order-candidate-metrics > span { min-width: 0; display: grid; gap: 3px; padding: 9px 11px; background: #f9fafb; }
.service-order-candidate.selected .service-order-candidate-metrics > span { background: #f5fbf9; }
.service-order-candidate-metrics small { color: #8a8292; font-size: 9px; }
.service-order-candidate-metrics b { overflow-wrap: anywhere; color: #4a4253; font-size: 12px; }
.service-order-candidate-inventory { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 1px; border-top: 1px solid rgba(65,48,88,.07); background: rgba(65,48,88,.07); }
.service-order-candidate-inventory > span { min-width: 0; display: grid; gap: 3px; padding: 9px 11px; background: #f6faf8; }
.service-order-candidate-inventory small { color: #7b847f; font-size: 9px; }
.service-order-candidate-inventory b { overflow-wrap: anywhere; color: #236b56; font-size: 12px; }
.service-order-candidate-inventory.pressure-unknown > span { background: #f7f7f9; }
.service-order-candidate-inventory.pressure-unknown b { color: #746d7d; }
.service-order-candidate-inventory.pressure-medium > span { background: #fbf8f1; }
.service-order-candidate-inventory.pressure-medium b { color: #95651e; }
.service-order-candidate-inventory.pressure-high > span, .service-order-candidate-inventory.pressure-critical > span { background: #fff6f3; }
.service-order-candidate-inventory.pressure-high b, .service-order-candidate-inventory.pressure-critical b { color: #b54835; }
.service-order-candidate.newcomer-hard-excluded { border-color: rgba(50,149,207,.22); background: rgba(50,149,207,.045); box-shadow: inset 3px 0 0 #3295cf; }
.service-order-candidate details { border-top: 1px solid rgba(65,48,88,.07); }
.service-order-candidate summary { padding: 8px 12px; color: #6048b4; font-size: 11px; font-weight: 700; cursor: pointer; }
.service-order-candidate-detail { padding: 2px 12px 12px; }
.service-order-candidate-detail p { margin: 6px 0; color: #706879; font-size: 11px; line-height: 1.55; }
.service-order-candidate-detail p.service-order-fallback-reason { padding: 8px 10px; border-radius: 8px; color: #5a458c; background: rgba(118,89,215,.065); }
.service-order-candidate-detail ul { display: grid; gap: 4px; margin: 9px 0 0; padding: 0 0 0 18px; color: #706879; font-size: 11px; line-height: 1.55; }
.service-order-exclusion-reason { margin: 0; padding: 0 12px 12px 55px; color: #9d4c3e; font-size: 11px; line-height: 1.55; }
.service-order-detail-empty { margin: 0; padding: 24px; color: #81798a; text-align: center; font-size: 13px; }

.schedule-view { margin: 14px 0; }
.schedule-hero { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 24px 26px; }
.schedule-hero h2 { margin: 0; font-size: 24px; letter-spacing: -.04em; }
.schedule-hero p { margin: 7px 0 0; color: #7b7485; font-size: 11px; }
.schedule-toolbar { display: flex; align-items: flex-end; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.schedule-toolbar label { display: grid; gap: 5px; color: #7b7485; font: 600 8px "DM Mono", monospace; letter-spacing: .05em; }
.schedule-toolbar input { width: 145px; height: 38px; padding: 0 11px; border: 1px solid var(--line); border-radius: 10px; outline: none; color: #332b3d; background: #eceef2; }
.schedule-button { height: 38px; display: inline-flex; align-items: center; justify-content: center; padding: 0 14px; border-radius: 10px; text-decoration: none; font-size: 10px; font-weight: 700; cursor: pointer; }
.schedule-button.secondary { border: 1px solid rgba(118,89,215,.18); color: #6048b4; background: rgba(118,89,215,.07); }
.schedule-button.primary { border: 0; color: #fff; background: #2a2237; }
.schedule-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin: 10px 0; }
.schedule-summary article { min-height: 104px; display: grid; grid-template-columns: 1fr auto; align-content: space-between; gap: 7px; padding: 17px 18px; border: 1px solid var(--line); border-radius: 15px; background: rgba(248,249,251,.93); }
.schedule-summary span { color: #706879; font-size: 11px; }
.schedule-summary strong { grid-row: 1 / 3; grid-column: 2; align-self: center; color: #2a2335; font: 500 34px "DM Mono", monospace; }
.schedule-summary small { color: #aaa2b0; font: 600 8px "DM Mono", monospace; letter-spacing: .1em; }
.schedule-panel { max-height: min(650px, 70vh); overflow: auto; }
.schedule-matrix-head, .schedule-matrix-row { min-width: calc(116px + var(--days) * 44px); display: grid; grid-template-columns: 116px repeat(var(--days), 44px); align-items: center; }
.schedule-matrix-head { position: sticky; z-index: 4; top: 0; min-height: 46px; border-bottom: 1px solid var(--line); color: #625a6e; background: #e9ebef; font-size: 11px; font-weight: 700; }
.schedule-matrix-head strong, .schedule-matrix-row > strong { position: sticky; z-index: 3; left: 0; height: 100%; display: flex; align-items: center; padding-left: 17px; border-right: 1px solid rgba(65,48,88,.1); background: #f4f5f7; }
.schedule-matrix-head strong { z-index: 5; background: #e9ebef; }
.schedule-matrix-head span { text-align: center; }
.schedule-list { padding-bottom: 10px; }
.schedule-matrix-row { min-height: 48px; border-bottom: 1px solid rgba(65,48,88,.07); }
.schedule-matrix-row > strong { color: #30283b; font-size: 13px; }
.schedule-cell { width: 34px; height: 32px; justify-self: center; border: 0; border-radius: 9px; color: #655d70; background: #eceef2; font-size: 11px; font-weight: 700; cursor: pointer; }
.schedule-cell.work { color: #16775d; background: rgba(40,169,128,.12); }
.schedule-cell.rest { color: #b54835; background: rgba(238,118,93,.12); }
.schedule-cell.leave { color: #a56d16; background: rgba(217,149,49,.14); }
.schedule-cell.training { color: #2a76a6; background: rgba(50,149,207,.13); }
.schedule-cell.departed { color: #77717e; background: #dddfe4; }
.schedule-cell.empty { color: #aaa4ae; background: transparent; cursor: default; }
.schedule-cell:not(:disabled):hover { outline: 2px solid rgba(118,89,215,.22); }
.schedule-empty { min-height: 210px; display: grid; place-items: center; color: #8b8392; font-size: 11px; }
.schedule-dialog { width: min(760px, calc(100% - 28px)); }
.kpi-dialog { width: min(900px, calc(100% - 28px)); }
.kpi-dialog-body { padding: 0 34px 28px; overflow-y: auto; }
.kpi-score-summary { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 22px; padding: 22px 24px; border: 1px solid rgba(118,89,215,.16); border-radius: 18px; background: linear-gradient(135deg, rgba(118,89,215,.1), rgba(50,149,207,.055)); }
.kpi-score-summary div { display: flex; align-items: baseline; gap: 13px; }
.kpi-score-summary span { color: #6f6879; font-size: 14px; }
.kpi-score-summary strong { color: #2a2237; font-size: 42px; line-height: 1; font-variant-numeric: tabular-nums; }
.kpi-score-summary strong small { margin-left: 3px; color: #81798a; font-size: 16px; }
.kpi-score-summary p { margin: 0; color: #625a6e; font-size: 14px; line-height: 1.65; }
.kpi-focus-note { margin-top: 14px; padding: 12px 15px; border-radius: 12px; color: #6d5c27; background: rgba(217,149,49,.11); font-size: 13px; }
.kpi-plan-grid { display: grid; gap: 12px; margin-top: 14px; }
.kpi-plan-card { padding: 19px 21px; border: 1px solid rgba(65,48,88,.1); border-radius: 16px; background: rgba(255,255,255,.76); }
.kpi-plan-card.focused { border-color: rgba(118,89,215,.38); box-shadow: inset 4px 0 0 #7659d7; }
.kpi-plan-card header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.kpi-plan-card header div { display: flex; align-items: baseline; gap: 13px; }
.kpi-plan-card header span { color: #625a6e; font-size: 14px; font-weight: 650; }
.kpi-plan-card header strong { color: #292333; font-size: 27px; font-variant-numeric: tabular-nums; }
.kpi-plan-card header b { flex: 0 0 auto; padding: 7px 10px; border-radius: 999px; color: #665b74; background: #ece9f2; font-size: 12px; font-weight: 650; }
.kpi-plan-card p { margin: 11px 0 0; color: #6f6879; font-size: 14px; line-height: 1.75; }
.person-feedback.warning { color: #9b681d; }
.schedule-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; padding: 4px 30px 28px; }
.schedule-form label { display: grid; gap: 7px; color: #716979; font: 600 8px "DM Mono", monospace; letter-spacing: .06em; }
.schedule-form label.wide, .schedule-form .wide { grid-column: 1 / -1; }
.schedule-form input, .schedule-form select { width: 100%; height: 42px; padding: 0 12px; outline: none; border: 1px solid var(--line); border-radius: 10px; color: #2a2335; background: #eceef2; }
.schedule-form input:focus, .schedule-form select:focus { border-color: rgba(118,89,215,.45); box-shadow: 0 0 0 3px rgba(118,89,215,.08); }
.schedule-form .admin-token-input { margin-bottom: 0; }
.schedule-form-actions { display: flex; justify-content: flex-end; gap: 8px; }
.schedule-form-actions button { min-width: 110px; height: 42px; border-radius: 10px; cursor: pointer; }
.template-link { display: block; margin-top: 12px; color: #6048b4; font-size: 10px; text-align: center; text-decoration: none; }

.page-footer { display: flex; justify-content: space-between; gap: 16px; padding: 24px 4px 0; color: #4f4958; font: 500 8px "DM Mono", monospace; letter-spacing: .12em; }
.reveal { opacity: 0; transform: translateY(20px); animation: reveal .75s var(--delay) cubic-bezier(.2,.75,.2,1) forwards; }
.focus-mode .topbar, .focus-mode .hero-copy, .focus-mode .page-footer { opacity: .18!important; transition: opacity .4s; }

.hidden { display: none!important; }
.roster-dialog { width: min(720px, calc(100% - 28px)); max-height: min(820px, calc(100vh - 28px)); padding: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 24px; color: var(--ink); background: #100d1a; box-shadow: 0 40px 140px rgba(0,0,0,.72); }
.roster-dialog::backdrop { background: rgba(5,4,10,.74); backdrop-filter: blur(14px); }
.dialog-shell { max-height: min(820px, calc(100vh - 28px)); display: flex; flex-direction: column; }
.dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 28px 30px 20px; }
.dialog-head h2 { margin: 0; font-size: 24px; letter-spacing: -.04em; }.dialog-head p { margin: 7px 0 0; color: #756f80; font-size: 11px; }
.dialog-close { width: 34px; height: 34px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.03); color: #8e8798; font-size: 20px; cursor: pointer; }
.roster-health { display: flex; align-items: center; gap: 9px; min-height: 40px; margin: 0 30px; padding: 0 13px; border: 1px solid rgba(112,226,188,.15); border-radius: 11px; background: rgba(112,226,188,.045); color: #8c8796; font-size: 10px; }
.roster-health span { width: 7px; height: 7px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 10px var(--amber); }.roster-health.ok span { background: var(--mint); box-shadow: 0 0 10px var(--mint); }.roster-health.warn span { background: var(--coral); box-shadow: 0 0 10px var(--coral); }.roster-health strong { color: #bbb5c5; font-weight: 600; }
.person-form { padding: 22px 30px 19px; border-bottom: 1px solid var(--line); }
.person-form label { display: block; margin-bottom: 9px; color: #736d7d; font: 500 8px "DM Mono", monospace; letter-spacing: .13em; }
.admin-token-input { width: 100%; height: 42px; margin-bottom: 17px; padding: 0 13px; outline: none; border: 1px solid var(--line); border-radius: 11px; color: #f5f2fb; background: rgba(255,255,255,.035); }
.admin-token-input:focus { border-color: rgba(157,130,255,.5); box-shadow: 0 0 0 3px rgba(157,130,255,.08); }
.person-input-row { display: flex; gap: 8px; }
.person-input-row input { min-width: 0; flex: 1; height: 42px; padding: 0 13px; outline: none; border: 1px solid var(--line); border-radius: 11px; color: #f5f2fb; background: rgba(255,255,255,.035); }
.person-input-row input:focus { border-color: rgba(157,130,255,.5); box-shadow: 0 0 0 3px rgba(157,130,255,.08); }
.person-input-row button { height: 42px; padding: 0 15px; border-radius: 11px; cursor: pointer; font-size: 11px; }
.save-person { border: 0; background: #eee8f5; color: #17121f; font-weight: 700; }.save-person.warning { background: var(--coral); color: #1b0c09; }
.cancel-edit { border: 1px solid var(--line); background: rgba(255,255,255,.03); color: #8d8797; }
.person-feedback { min-height: 18px; padding-top: 7px; color: #716b7b; font-size: 10px; }.person-feedback.error { color: #ff9b82; }.person-feedback.success { color: var(--mint); }
.roster-list-head { display: flex; justify-content: space-between; gap: 14px; padding: 17px 30px 10px; color: #a8a2b0; font-size: 11px; }.roster-list-head small { color: #5d5766; font-size: 9px; }
.roster-list { min-height: 150px; margin: 0; padding: 0 22px 18px; overflow-y: auto; list-style: none; scrollbar-color: #312a41 transparent; }
.roster-list li { display: grid; grid-template-columns: 36px minmax(0,1fr) auto; align-items: center; gap: 10px; min-height: 62px; padding: 8px; border-top: 1px solid rgba(65,48,88,.075); border-radius: 10px; }
.roster-list li.reception-disabled { margin: 3px 0; border-top-color: rgba(238,118,93,.18); background: rgba(238,118,93,.075); box-shadow: inset 3px 0 0 #d75e49; }
.roster-list li.reception-newcomer:not(.reception-disabled) { margin: 3px 0; border-top-color: rgba(50,149,207,.18); background: rgba(50,149,207,.055); box-shadow: inset 3px 0 0 #3295cf; }
.roster-list li.reception-scheduled:not(.reception-disabled), .roster-list li.reception-disabled.reception-scheduled { border-top-color: rgba(217,149,49,.2); background: rgba(217,149,49,.075); box-shadow: inset 3px 0 0 #d99531; }
.person-no { color: #57515f; font: 500 8px "DM Mono", monospace; }
.person-roster-main { min-width: 0; display: grid; gap: 5px; }
.person-name-line, .person-roster-meta { min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.person-name { overflow: hidden; max-width: 100%; font-size: 12px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.verify-badge { display: inline-flex; align-items: center; gap: 5px; color: #70cbae; font-size: 9px; }.verify-badge::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }.verify-badge.missing { color: #ff9479; }
.reception-tier-badge, .reception-state-badge, .reception-schedule-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 23px; padding: 3px 8px; border-radius: 999px; font-size: 10px; font-weight: 750; line-height: 1.2; white-space: nowrap; }
.reception-tier-badge { color: #6048b4; background: rgba(118,89,215,.1); }
.reception-tier-badge.fallback { color: #986317; background: rgba(217,149,49,.13); }
.reception-tier-badge.secondary_fallback { color: #655d70; background: #e6e4e9; }
.reception-tier-badge.newcomer { color: #2679aa; background: rgba(50,149,207,.12); }
.reception-state-badge { color: #b54835; background: rgba(238,118,93,.14); box-shadow: inset 0 0 0 1px rgba(238,118,93,.18); }
.reception-state-badge.participating { color: #16775d; background: rgba(40,169,128,.1); box-shadow: inset 0 0 0 1px rgba(40,169,128,.15); }
.reception-schedule-badge { color: #946116; background: rgba(217,149,49,.14); box-shadow: inset 0 0 0 1px rgba(217,149,49,.2); }
.row-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 4px; }
.row-actions button { padding: 6px 8px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #746e7d; font-size: 9px; cursor: pointer; }
.row-actions button:hover { color: #dcd6e4; background: rgba(255,255,255,.05); }
.row-actions button:disabled { opacity: .55; cursor: wait; }
.row-actions .reception-settings-button { min-width: 76px; border-color: rgba(118,89,215,.17); color: #6048b4; background: rgba(118,89,215,.075); font-weight: 700; }
.row-actions .reception-settings-button:hover { border-color: rgba(118,89,215,.3); color: #4f38a8; background: rgba(118,89,215,.13); }
.row-actions .delete:hover { color: #ff927a; }
.reception-settings-dialog { width: min(760px, calc(100% - 28px)); }
.reception-settings-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; padding: 4px 30px 26px; overflow-y: auto; }
.reception-settings-form .wide { grid-column: 1 / -1; }
.reception-settings-form > label { min-width: 0; display: grid; gap: 8px; color: #716979; font-size: 12px; font-weight: 650; }
.reception-settings-form input, .reception-settings-form select { min-width: 0; width: 100%; height: 44px; padding: 0 12px; outline: none; border: 1px solid var(--line); border-radius: 10px; color: #2a2335; background: #eceef2; font-size: 13px; }
.reception-settings-form input:focus, .reception-settings-form select:focus { border-color: rgba(118,89,215,.45); background: #f8f9fb; box-shadow: 0 0 0 3px rgba(118,89,215,.08); }
.reception-settings-form .admin-token-input { margin: 0; }
.reception-settings-person { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 15px; border: 1px solid rgba(118,89,215,.15); border-radius: 12px; background: rgba(118,89,215,.055); }
.reception-settings-person strong { flex: 0 0 auto; color: #2b2335; font-size: 15px; }
.reception-settings-person span { min-width: 0; color: #6f6879; font-size: 12px; text-align: right; }
.reception-date-control { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 6px; }
.reception-date-control button { min-width: 44px; height: 44px; padding: 0 9px; border: 1px solid rgba(65,48,88,.1); border-radius: 9px; color: #625a6e; background: #f8f9fb; font-size: 12px; cursor: pointer; }
.reception-date-control button:hover { border-color: rgba(118,89,215,.28); color: #6048b4; background: rgba(118,89,215,.08); }
.reception-settings-preview { min-height: 48px; display: flex; align-items: center; padding: 11px 14px; border: 1px solid rgba(40,169,128,.17); border-radius: 11px; color: #16775d; background: rgba(40,169,128,.07); font-size: 13px; line-height: 1.55; }
.reception-settings-preview.invalid { border-color: rgba(238,118,93,.22); color: #b54835; background: rgba(238,118,93,.08); }
.reception-settings-form .schedule-form-actions { margin-top: -2px; }
.dialog-foot { display: flex; align-items: center; gap: 15px; padding: 13px 30px 16px; border-top: 1px solid var(--line); }.dialog-foot span { color: var(--violet); font: 500 7px "DM Mono", monospace; letter-spacing: .13em; }.dialog-foot p { margin: 0; color: #5b5564; font-size: 9px; }
.import-current { display: flex; align-items: center; gap: 12px; margin: 0 30px; padding: 14px; border: 1px solid rgba(103,189,246,.15); border-radius: 12px; background: rgba(103,189,246,.045); }
.import-current > span { width: 8px; height: 8px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 12px var(--blue); }
.import-current strong,.import-current small { display: block; }.import-current strong { font-size: 11px; }.import-current small { margin-top: 4px; color: #6d6777; font-size: 9px; }
.import-form { padding: 22px 30px 24px; }.import-form > label:not(.file-drop) { display: block; margin-bottom: 9px; color: #736d7d; font: 500 8px "DM Mono", monospace; letter-spacing: .13em; }
.file-drop { min-height: 165px; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: 4px; padding: 22px; border: 1px dashed rgba(157,130,255,.3); border-radius: 16px; background: rgba(157,130,255,.035); cursor: pointer; transition: .25s ease; text-align: center; }
.file-drop:hover,.file-drop.dragging { border-color: rgba(157,130,255,.7); background: rgba(157,130,255,.075); }.file-drop input { display: none; }
.file-icon { width: 40px; height: 40px; display: grid; place-items: center; margin-bottom: 12px; border-radius: 50%; color: var(--violet); background: rgba(157,130,255,.1); font-size: 20px; }
.file-drop strong { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }.file-drop small { margin-top: 6px; color: #696273; font-size: 9px; }
.start-import { width: 100%; height: 44px; margin-top: 13px; border: 0; border-radius: 11px; background: #eee8f5; color: #17121f; font-weight: 700; cursor: pointer; }.start-import:disabled { opacity: .45; cursor: wait; }
.import-progress { height: 4px; margin-top: 14px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.06); }.import-progress i { display: block; width: 35%; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--violet),var(--coral)); animation: importMove 1.2s ease-in-out infinite; }
.import-feedback { text-align: center; }

/* Light signal room */
.ambient { opacity: .1; filter: blur(130px); }
.ambient-a { background: #9f83ef; }
.ambient-b { background: #ff9c83; }
.noise { opacity: .018; mix-blend-mode: multiply; }
.brand-mark { border-color: rgba(67,49,91,.16); background: rgba(255,255,255,.82); box-shadow: 0 8px 25px rgba(67,49,91,.08); }
.brand small { color: #8c8497; }
.signal-chip, #clock, .roster-trigger, .icon-button { border-color: var(--line); background: rgba(255,255,255,.72); box-shadow: 0 7px 22px rgba(55,39,78,.045); }
.signal-chip, .roster-trigger { color: #625a6e; }
#clock { color: #7d7588; }
.roster-trigger:hover { border-color: rgba(118,89,215,.28); background: rgba(118,89,215,.07); }
.roster-trigger b { background: rgba(118,89,215,.1); color: #6e50ca; }
.import-trigger b { background: rgba(40,169,128,.1); color: #168665; }
.icon-button:hover { background: #fff; box-shadow: 0 10px 28px rgba(55,39,78,.1); }
.kicker { color: #837b8e; }
h1 { color: #211b2d; text-shadow: 0 12px 38px rgba(74,54,97,.07); }
h1 em { -webkit-text-stroke-color: rgba(53,39,72,.63); }
.hero-copy > p { color: #746d80; }
.range-switch { background: rgba(255,255,255,.76); box-shadow: 0 8px 24px rgba(55,39,78,.05); }
.range-switch button { color: #7a7286; }
.range-switch button.active { color: #fff; background: #2a2237; box-shadow: 0 8px 24px rgba(42,34,55,.2); }
.orbital-stage::before { background: radial-gradient(circle, rgba(118,89,215,.15), transparent 68%); }
.orbit { border-color: rgba(72,54,96,.16); }
.orbit-two { border-color: rgba(238,118,93,.32); }
.orbit-three { border-color: rgba(40,169,128,.29); }
.signal-core { border-color: rgba(72,54,96,.15); background: radial-gradient(circle at 34% 24%, #fff, #f5f0fb 54%, #e9e2f3); box-shadow: 0 24px 70px rgba(87,61,123,.16), inset 0 0 28px rgba(255,255,255,.82); }
.signal-core span, .signal-core small { color: #81788d; }
.orbit-label { color: #88808f; }
.metric-card { border-color: rgba(65,48,88,.1); background: rgba(255,255,255,.88); box-shadow: 0 14px 38px rgba(65,48,88,.065); }
.metric-card p { color: #716a7c; }
.metric-card strong { color: #261f32; }
.metric-card strong small { color: #81798a; }
.panel { border-color: rgba(65,48,88,.1); background: rgba(255,255,255,.82); box-shadow: 0 16px 48px rgba(65,48,88,.055); }
.panel-number { color: #a098a8; }
.panel h2 { color: #2a2335; }
.panel-head p { color: #81798b; }
.legend { color: #756d80; }
.grid-lines path { stroke: rgba(66,49,88,.075); }
.axis-labels { fill: #9b94a2; }
.placeholder-veil { border-color: rgba(65,48,88,.1); background: rgba(255,255,255,.83); box-shadow: 0 18px 50px rgba(65,48,88,.11); }
.placeholder-veil small { color: #91899a; }
.tiny-chip { color: #756e7e; background: rgba(255,255,255,.58); }
.ranking-list li, .roster-list li { border-color: rgba(65,48,88,.075); }
.ranking-list .rank { color: #9e96a5; }
.ranking-list .avatar { color: #746c7c; border-color: rgba(65,48,88,.2); background: #faf8fc; }
.person strong { color: #3f374a; }
.person small { color: #9a92a1; }
.ranking-list b { color: #4e4658; }
.ranking-list .rank-one { background: linear-gradient(90deg, rgba(217,149,49,.1), transparent); }
.text-button { color: #81798b; }
.table-head { color: #8d8595; }
.empty-state p { color: #807889; }
.empty-code, .page-footer { color: #918999; }
.empty-planet i { border-color: rgba(65,48,88,.18); }
.roster-dialog { border-color: rgba(65,48,88,.12); color: var(--ink); background: #fff; box-shadow: 0 34px 110px rgba(45,31,62,.22); }
.roster-dialog::backdrop { background: rgba(46,37,59,.28); backdrop-filter: blur(10px); }
.dialog-head p { color: #7b7385; }
.dialog-close { background: #f8f5fb; color: #716979; }
.roster-health { border-color: rgba(40,169,128,.18); background: rgba(40,169,128,.055); color: #696171; }
.roster-health strong { color: #494152; }
.person-form label, .import-form > label:not(.file-drop) { color: #716979; }
.admin-token-input, .person-input-row input { color: #211b2d; background: #faf8fc; }
.admin-token-input:focus, .person-input-row input:focus { background: #fff; border-color: rgba(118,89,215,.45); box-shadow: 0 0 0 3px rgba(118,89,215,.08); }
.save-person, .start-import { color: #fff; background: #2a2237; }
.cancel-edit { color: #6f6779; background: #f8f5fa; }
.person-feedback { color: #777080; }
.person-feedback.error { color: #d65843; }
.person-feedback.success { color: #168665; }
.roster-list-head { color: #504858; }
.roster-list-head small { color: #8c8494; }
.roster-list { scrollbar-color: #d8d0e1 transparent; }
.person-no { color: #9a92a0; }
.verify-badge { color: #188765; }
.verify-badge.missing { color: #d75e49; }
.row-actions button { color: #776f80; }
.row-actions button:hover { color: #30283b; background: #f4f0f7; }
.row-actions .delete:hover { color: #d6533e; }
.dialog-foot p { color: #8a8291; }
.import-current { border-color: rgba(50,149,207,.18); background: rgba(50,149,207,.055); }
.import-current small { color: #777080; }
.file-drop { border-color: rgba(118,89,215,.3); background: rgba(118,89,215,.035); }
.file-drop:hover, .file-drop.dragging { border-color: rgba(118,89,215,.62); background: rgba(118,89,215,.075); }
.file-icon { background: rgba(118,89,215,.1); }
.file-drop small { color: #81798a; }
.import-progress { background: rgba(65,48,88,.08); }

/* Soft gray surface tuning */
.ambient { opacity: .065; }
.brand-mark, .signal-chip, #clock, .roster-trigger, .icon-button { background: rgba(248,249,251,.9); }
.icon-button:hover { background: #fdfdfe; }
.range-switch { background: rgba(246,247,249,.92); }
.signal-core { background: radial-gradient(circle at 34% 24%, #fafafd, #f1f1f5 56%, #e5e4eb); box-shadow: 0 22px 64px rgba(71,58,88,.13), inset 0 0 28px rgba(255,255,255,.7); }
.metric-card { background: rgba(248,249,251,.93); box-shadow: 0 12px 32px rgba(58,49,69,.07); }
.panel { background: rgba(246,247,249,.94); box-shadow: 0 14px 38px rgba(58,49,69,.065); }
.placeholder-veil { background: rgba(242,243,246,.92); }
.tiny-chip { background: rgba(239,241,244,.85); }
.ranking-list .avatar { background: #eff1f4; }
.roster-dialog { background: #f5f6f8; }
.dialog-close, .cancel-edit { background: #eceef2; }
.admin-token-input, .person-input-row input { background: #eceef2; }
.admin-token-input:focus, .person-input-row input:focus { background: #f8f9fb; }
.row-actions button:hover { background: #e9ebef; }
.file-drop { background: rgba(235,233,244,.72); }
.file-drop:hover, .file-drop.dragging { background: rgba(225,221,241,.8); }
@keyframes importMove { from { transform: translateX(-110%); } to { transform: translateX(300%); } }

@keyframes reveal { to { opacity: 1; transform: translateY(0); } }
@keyframes blink { 50% { opacity: .35; transform: scale(.72); } }
@keyframes brandOrbit { from { transform: rotate(0) translateX(18px) rotate(0); } to { transform: rotate(360deg) translateX(18px) rotate(-360deg); } }
@keyframes orbitalPulse { 50% { transform: rotate(-12deg) scaleY(.62) scale(1.035); border-color: rgba(73,54,98,.26); } }
@keyframes drawLine { to { stroke-dashoffset: 0; } }
@keyframes slowSpin { to { transform: rotate(360deg); } }

@media (max-width: 1500px) {
  .topbar { grid-template-columns: minmax(180px, 1fr) auto; row-gap: 10px; }
  .primary-nav { grid-column: 1 / -1; grid-row: 2; width: 100%; margin-top: 8px; }
  .primary-nav button { flex: 1; min-width: 0; }
  .primary-nav button.task-export-nav { flex: 1.65; min-width: 170px; }
}

@media (max-width: 1180px) {
  .metrics { grid-template-columns: repeat(3, 1fr); }
  .metric-card { min-height: 156px; }
  .topbar { grid-template-columns: 1fr auto; }
  .primary-nav { grid-column: 1 / -1; grid-row: 2; width: 100%; margin-top: 12px; }
  .primary-nav button { flex: 1; }
  .schedule-hero { align-items: flex-start; flex-direction: column; }
  .schedule-toolbar { width: 100%; justify-content: flex-start; }
  .task-copy-grid { grid-template-columns: 1fr; }
  .task-duplicate-groups { grid-template-columns: 1fr; }
  .duplicate-follower-form { grid-template-columns: 1fr; }
  .service-order-hero { align-items: flex-start; flex-direction: column; }
  .service-order-toolbar { width: 100%; justify-content: flex-start; }
}
@media (max-width: 860px) {
  .app-shell { width: min(100% - 28px, 1480px); }
  .primary-nav { justify-content: flex-start; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; scroll-snap-type: x proximity; }
  .primary-nav::-webkit-scrollbar { display: none; }
  .primary-nav button { scroll-snap-align: start; }
  .signal-chip { display: none; }
  .hero { min-height: auto; grid-template-columns: 1fr; padding: 48px 0 30px; }
  .orbital-stage { width: min(370px, 85vw); margin-top: 26px; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .followup-panel { grid-column: auto; }
  .chart-placeholder { min-height: auto; }
  .service-order-insights { grid-template-columns: 1fr; }
  .service-order-rules { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .app-shell { width: min(100% - 20px, 1480px); padding-top: 14px; }
  .suite-nav { width: 100%; margin-bottom: 10px; }
  .suite-nav a { min-width: 0; flex: 1 1 50%; padding-inline: 10px; font-size: 12px; }
  .brand small, #clock, .roster-trigger span, .signal-chip { display: none; }
  .roster-trigger { width: 36px; padding: 0; justify-content: center; }
  .topbar { min-height: 54px; }
  h1 { font-size: clamp(44px, 14vw, 70px); }
  .hero-copy > p { font-size: 12px; }
  .metrics { grid-template-columns: repeat(2, 1fr); }
  .metric-card { min-height: 148px; padding: 13px; }
  .metric-card strong { font-size: 34px; }
  .panel-head { padding: 20px; }
  .legend { display: none; }
  .placeholder-veil { inset: 27% 17%; }
  .table-head { display: none; }
  .empty-state { min-height: 220px; flex-direction: column; text-align: center; gap: 15px; }
  .empty-code { margin-left: 0; }
  .page-footer span:last-child { display: none; }
  .dialog-head, .person-form { padding-left: 20px; padding-right: 20px; }.roster-health { margin-left: 20px; margin-right: 20px; }.roster-list-head { padding-left: 20px; padding-right: 20px; }.roster-list { padding-left: 12px; padding-right: 12px; }
  .import-current { margin-left: 20px; margin-right: 20px; }.import-form { padding-left: 20px; padding-right: 20px; }
  .person-input-row { flex-wrap: wrap; }.person-input-row input { flex-basis: 100%; }.person-input-row button { flex: 1; }
  .roster-list li { grid-template-columns: 25px minmax(0,1fr); align-items: start; gap: 7px 9px; padding: 10px 8px; }
  .roster-list .person-roster-main { align-self: center; }
  .roster-list .row-actions { grid-column: 2; width: 100%; justify-content: flex-start; }
  .roster-list .row-actions button { min-width: 0; flex: 1 1 62px; }
  .roster-list .row-actions .reception-settings-button { min-width: 90px; flex-grow: 1.35; }
  .reception-settings-form { grid-template-columns: 1fr; gap: 13px; padding: 3px 18px 22px; }
  .reception-settings-form .wide { grid-column: auto; }
  .reception-settings-person { align-items: flex-start; flex-direction: column; gap: 4px; }
  .reception-settings-person span { text-align: left; }
  .reception-date-control { grid-template-columns: minmax(0,1fr) 46px 46px; }
  .reception-settings-form .schedule-form-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .reception-settings-form .schedule-form-actions button { min-width: 0; width: 100%; }
  .verify-badge { display: none; }
  .metrics-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
  .metrics-heading-actions { width: 100%; }
  .metrics-heading-actions .share-button { flex: 1; }
  .performance-benchmarks { align-items: stretch; flex-direction: column; padding: 12px 18px; }
  .performance-benchmarks .target-chip { justify-content: center; }
  .performance-head { padding: 22px 18px 18px; flex-direction: column; gap: 13px; }
  .performance-head h2 { font-size: 19px; }
  .performance-scroll { overflow: visible; }
  .performance-table-head { display: none; }
  .performance-list { padding: 0 10px 12px; }
  .performance-row { min-width: 0; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px 16px; margin: 6px 0; padding: 16px; border: 1px solid rgba(65,48,88,.08); }
  .performance-person { grid-column: 1 / -1; padding-bottom: 8px; border-bottom: 1px solid rgba(65,48,88,.07); }
  .performance-value { display: flex; align-items: center; justify-content: space-between; text-align: right; font-size: 13px; }
  .performance-value::before { content: attr(data-label); color: #8a8292; font: 500 8px "DM Mono", monospace; }
  .performance-value.primary-rate { justify-self: stretch; min-width: 0; }
  .performance-actions { width: 100%; min-width: 0; align-items: stretch; }
  .target-chip, .share-button { align-self: stretch; justify-content: center; }
  .share-feedback { text-align: center; }
  .schedule-summary { grid-template-columns: repeat(2,1fr); }
  .schedule-toolbar { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .schedule-toolbar label, .schedule-toolbar input, .schedule-button { width: 100%; }
  .followup-hero { align-items: flex-start; flex-direction: column; padding: 20px; }
  .followup-hero-actions { width: 100%; align-items: stretch; flex-direction: column; }
  .followup-snapshot { white-space: normal; }
  .followup-summary { grid-template-columns: 1fr; }
  .followup-card { min-height: 98px; }
  .followup-layout { grid-template-columns: 1fr; }
  .followup-detail-head { align-items: flex-start; flex-direction: column; }
  .followup-search { width: 100%; }
  .task-export-hero, .task-export-table > header { align-items: flex-start; flex-direction: column; padding: 20px; }
  .task-export-meta { align-items: flex-start; }
  .task-export-table label { width: 100%; }
  .task-duplicate-copy > header { align-items: flex-start; flex-direction: column; }
  .task-duplicate-header-actions { width: 100%; justify-content: space-between; flex-wrap: wrap; }
  .service-order-hero { padding: 20px; }
  .service-order-toolbar { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .service-order-toolbar label, .service-order-toolbar input, .service-order-toolbar .schedule-button { width: 100%; }
  .service-order-action-feedback { grid-column: 1 / -1; text-align: left; }
  .service-order-rules { grid-template-columns: 1fr; }
  .service-order-board-foot { align-items: flex-start; flex-direction: column; }
  .service-order-board-foot b { text-align: left; }
  .service-order-reason-list li { grid-template-columns: 1fr; gap: 6px; }
  .service-order-reason-list button { width: 100%; }
  .service-order-detail-dialog .dialog-head { padding-bottom: 16px; }
  .service-order-detail-body { padding: 13px 12px 17px; }
  .service-order-detail-summary { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
  .service-order-detail-summary article { min-height: 112px; padding: 11px; }
  .service-order-detail-summary strong { font-size: 15px; }
  .service-order-detail-context { grid-template-columns: 1fr; gap: 7px; }
  .service-order-detail-context > article.schedule { grid-column: auto; }
  .service-order-schedule-strip { grid-template-columns: 1fr; }
  .service-order-candidate-section > header { align-items: flex-start; flex-direction: column; gap: 4px; }
  .service-order-candidate > header { grid-template-columns: 30px minmax(0,1fr) auto; gap: 7px; padding-inline: 8px; }
  .service-order-candidate > header small { white-space: normal; }
  .service-order-candidate-tier { max-width: 80px; overflow: hidden; text-overflow: ellipsis; }
  .service-order-candidate-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .service-order-candidate-inventory { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .service-order-exclusion-reason { padding-left: 45px; }
  .schedule-form { grid-template-columns: 1fr; padding: 4px 20px 22px; }
  .schedule-form label.wide, .schedule-form .wide { grid-column: auto; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto!important; animation-duration: .01ms!important; animation-iteration-count: 1!important; transition-duration: .01ms!important; }
}

/* Readability system — minimum 12px supporting text, 14px operational text */
body, button, input, select, textarea { font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif; }
body { font-size: 15px; line-height: 1.55; font-weight: 440; }
.brand-mark b, .brand small, #clock, .roster-trigger b, .kicker, .signal-core span, .signal-core small,
.signal-core strong, .orbit-label, .metric-card strong,
.panel-number, .panel h2 sup, .axis-labels, .placeholder-veil small, .tiny-chip, .ranking-list .rank,
.ranking-list .avatar, .person small, .ranking-list b, .table-head, .empty-code, .performance-table-head,
.performance-rank, .performance-value, .schedule-toolbar label, .schedule-summary strong, .schedule-summary small,
.schedule-table-head, .schedule-date, .schedule-time, .schedule-form label, .page-footer, .person-form label,
.person-no, .dialog-foot span, .import-form > label:not(.file-drop), .performance-value::before {
  font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  font-variant-numeric: tabular-nums;
}
.brand strong { font-size: 21px; line-height: 1.2; letter-spacing: .035em; }
.brand small { margin-top: 5px; font-size: 11px; line-height: 1.25; letter-spacing: .13em; }
.primary-nav button { min-width: 96px; height: 36px; padding: 0 14px; font-size: 13px; font-weight: 650; white-space: nowrap; }
.primary-nav button.openclaw-nav { min-width: 160px; flex-grow: 1.35; }
.primary-nav button.task-export-nav { min-width: 180px; flex-grow: 1.65; padding-inline: 12px; font-size: 12px; }
.primary-nav button.service-order-nav { min-width: 110px; flex-grow: 1.1; }
.signal-chip, .roster-trigger { height: 40px; font-size: 13px; }
#clock { height: 40px; min-width: 100px; font-size: 13px; }
.icon-button { width: 40px; height: 40px; }
.roster-trigger b { min-width: 25px; height: 25px; font-size: 11px; }
.metric-card { min-height: 132px; padding: 22px 18px; }
.metric-card p { margin-bottom: 7px; font-size: 14px; font-weight: 560; }
.metric-card strong { font-size: clamp(38px,3vw,50px); letter-spacing: -.045em; }
.metric-card strong small { font-size: 15px; }
.panel-number { margin-bottom: 10px; font-size: 11px; letter-spacing: .1em; }
.panel h2, .performance-head h2, .schedule-hero h2 { font-size: 25px; }
.panel-head p, .performance-head p, .schedule-hero p, .monitor-placeholder p { font-size: 14px; line-height: 1.65; }
.target-chip { min-height: 38px; padding: 0 15px; font-size: 13px; }
.share-button { min-width: 164px; height: 42px; font-size: 14px; }
.share-feedback { min-height: 18px; font-size: 12px; }
.performance-table-head { min-height: 46px; font-size: 12px; letter-spacing: .025em; }
.performance-row { min-height: 64px; padding: 8px 14px; }
.performance-person { grid-template-columns: 30px 38px 1fr; gap: 10px; }
.performance-rank { font-size: 11px; }
.performance-avatar { width: 36px; height: 36px; font-size: 13px; }
.performance-person strong { font-size: 15px; }
.performance-value { font-size: 15px; }
.performance-value.primary-rate { min-width: 86px; padding: 8px 10px; }
.performance-loading, .schedule-empty { font-size: 14px; }
.monitor-placeholder h2 { font-size: 25px; }
.schedule-toolbar label { gap: 7px; font-size: 12px; }
.schedule-toolbar input, .schedule-button { height: 44px; font-size: 13px; }
.schedule-summary span { font-size: 14px; }
.schedule-summary strong { font-size: 38px; }
.schedule-summary small { font-size: 10px; }
.schedule-table-head { min-height: 48px; font-size: 12px; }
.schedule-row { min-height: 66px; font-size: 14px; }
.schedule-row strong { font-size: 15px; }
.schedule-date, .schedule-time { font-size: 13px; }
.schedule-status { min-width: 68px; font-size: 12px; }
.schedule-row-actions button { padding: 8px 11px; font-size: 12px; }
.page-footer { font-size: 10px; }
.roster-dialog { width: min(820px, calc(100% - 28px)); }
.dialog-head { padding: 32px 34px 23px; }
.dialog-head h2 { font-size: 27px; }
.dialog-head p { margin-top: 9px; font-size: 14px; line-height: 1.6; }
.dialog-close { width: 40px; height: 40px; font-size: 22px; }
.roster-health { min-height: 46px; margin: 0 34px; padding: 0 15px; font-size: 13px; }
.person-form, .import-form { padding-left: 34px; padding-right: 34px; }
.person-form label, .import-form > label:not(.file-drop), .schedule-form label { margin-bottom: 8px; font-size: 12px; letter-spacing: .04em; }
.admin-token-input, .person-input-row input, .schedule-form input, .schedule-form select { height: 48px; font-size: 14px; }
.person-input-row button, .schedule-form-actions button { height: 48px; font-size: 14px; }
.person-feedback { min-height: 22px; padding-top: 9px; font-size: 12px; line-height: 1.5; }
.roster-list-head { padding-left: 34px; padding-right: 34px; font-size: 14px; }
.roster-list-head small { font-size: 12px; }
.roster-list li { min-height: 62px; }
.person-no { font-size: 11px; }
.person-name { font-size: 15px; }
.verify-badge, .row-actions button { font-size: 12px; }
.dialog-foot { padding-left: 34px; padding-right: 34px; }
.dialog-foot span { font-size: 10px; }
.dialog-foot p { font-size: 12px; line-height: 1.5; }
.import-current { margin-left: 34px; margin-right: 34px; }
.import-current strong { font-size: 14px; }
.import-current small { font-size: 12px; }
.file-drop { min-height: 182px; }
.file-drop strong { font-size: 15px; }
.file-drop small, .template-link { font-size: 12px; }
.start-import { height: 48px; font-size: 14px; }
.schedule-form { gap: 17px; padding: 6px 34px 32px; }

@media (max-width: 620px) {
  body { font-size: 14px; }
  .primary-nav { justify-content: flex-start; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; scroll-snap-type: x proximity; }
  .primary-nav::-webkit-scrollbar { display: none; }
  .primary-nav button { min-width: 92px; height: 38px; flex: 0 0 92px; padding: 0 9px; font-size: 12px; scroll-snap-align: start; }
  .primary-nav button.openclaw-nav { min-width: 160px; flex-basis: 160px; }
  .primary-nav button.task-export-nav { min-width: 180px; flex-basis: 180px; padding-inline: 8px; font-size: 11px; }
  .primary-nav button.service-order-nav { min-width: 110px; flex-basis: 110px; }
  .metrics-heading { margin-top: 16px; }
  .metrics-heading h2 { font-size: 20px; }
  .metric-card { min-height: 118px; padding: 16px; }
  .metric-card p { font-size: 13px; }
  .metric-card strong { font-size: 36px; }
  .performance-head h2, .schedule-hero h2 { font-size: 23px; }
  .performance-row { min-height: 0; }
  .performance-value, .performance-value::before { font-size: 12px; }
  .dialog-head { padding: 25px 22px 19px; }
  .dialog-head h2 { font-size: 24px; }
  .dialog-head p { font-size: 13px; }
  .person-form, .import-form, .schedule-form { padding-left: 22px; padding-right: 22px; }
  .roster-health, .import-current { margin-left: 22px; margin-right: 22px; }
  .kpi-dialog-body { padding: 0 18px 22px; }
  .kpi-score-summary { grid-template-columns: 1fr; gap: 10px; padding: 18px; }
  .kpi-score-summary strong { font-size: 36px; }
  .kpi-plan-card { padding: 17px; }
  .kpi-plan-card header { align-items: flex-start; flex-direction: column; gap: 8px; }
  .kpi-plan-card header strong { font-size: 24px; }
}

/* openclaw lobster monitor: deterministic risk center */
.monitor-view { min-height: 0; margin: 14px 0; padding: 0; overflow: visible; }
.lobster-hero { min-height: 136px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 25px 28px; }
.lobster-identity { min-width: 0; display: flex; align-items: center; gap: 18px; }
.lobster-mark { width: 62px; height: 62px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgba(238,118,93,.24); border-radius: 19px; background: linear-gradient(145deg, rgba(238,118,93,.14), rgba(118,89,215,.06)); box-shadow: 0 14px 34px rgba(135,73,66,.1); font-size: 30px; }
.lobster-hero h2, .lobster-panel-head h3 { margin: 0; color: #292333; letter-spacing: -.035em; }
.lobster-hero h2 { font-size: 27px; }
.lobster-hero p { max-width: 760px; margin: 8px 0 0; color: #736c7d; font-size: 14px; line-height: 1.65; }
.lobster-hero-actions { flex: 0 0 auto; display: flex; align-items: flex-end; flex-direction: column; gap: 9px; }
.lobster-engine-state { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 12px; border: 1px solid rgba(40,169,128,.2); border-radius: 999px; color: #177d60; background: rgba(40,169,128,.08); font-size: 12px; font-weight: 750; }
.lobster-engine-state i { width: 7px; height: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 10px rgba(40,169,128,.55); }
.lobster-engine-state.loading { border-color: rgba(217,149,49,.28); color: #936018; background: rgba(217,149,49,.09); }
.lobster-engine-state.loading i { background: var(--amber); box-shadow: 0 0 10px rgba(217,149,49,.48); }
.lobster-engine-state.offline { border-color: rgba(238,118,93,.3); color: #a94331; background: rgba(238,118,93,.1); }
.lobster-engine-state.offline i { background: var(--coral); box-shadow: 0 0 10px rgba(238,118,93,.48); }
.lobster-hero-actions small { color: #777080; font-size: 12px; }
.lobster-freshness { min-height: 48px; margin: 11px 0; padding: 10px 16px; display: flex; align-items: center; gap: 10px; border: 1px solid rgba(40,169,128,.18); border-radius: 13px; color: #246d59; background: rgba(40,169,128,.065); }
.lobster-freshness > span { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--mint); }
.lobster-freshness strong { font-size: 13px; }
.lobster-freshness small { color: #6c7f77; font-size: 12px; }
.lobster-freshness.stale { border-color: rgba(217,149,49,.24); color: #9b671b; background: rgba(217,149,49,.07); }
.lobster-freshness.stale > span { background: var(--amber); }
.lobster-freshness.expired, .lobster-freshness.missing { border-color: rgba(238,118,93,.25); color: #b44a37; background: rgba(238,118,93,.075); }
.lobster-freshness.expired > span, .lobster-freshness.missing > span { background: var(--coral); }
.lobster-freshness.expired small, .lobster-freshness.missing small { color: #9a6c63; }
.lobster-boundary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin: 0 0 12px; }
.lobster-boundary article { min-height: 86px; padding: 14px 16px; border: 1px solid rgba(40,169,128,.18); border-radius: 15px; background: linear-gradient(145deg,rgba(40,169,128,.07),rgba(118,89,215,.035)); }
.lobster-boundary span, .lobster-boundary strong, .lobster-boundary small { display: block; }
.lobster-boundary span { color: #73707c; font-size: 11px; font-weight: 750; letter-spacing: .08em; }
.lobster-boundary strong { margin-top: 7px; color: #256d5a; font-size: 14px; }
.lobster-boundary small { margin-top: 5px; color: #746d7c; font-size: 12px; line-height: 1.45; }

.lobster-summary { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 10px; margin: 0 0 12px; }
.lobster-summary article { min-height: 116px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 17px; background: rgba(248,249,251,.92); box-shadow: 0 12px 30px rgba(50,39,67,.04); }
.lobster-summary span, .lobster-summary small { display: block; }
.lobster-summary span { color: #655d70; font-size: 13px; font-weight: 700; }
.lobster-summary strong { display: block; margin: 9px 0 5px; color: #2d2638; font: 700 36px/1 "DM Mono", monospace; }
.lobster-summary small { color: #696170; font-size: 12px; line-height: 1.45; }
.lobster-summary article.active { box-shadow: inset 4px 0 0 var(--violet), 0 12px 30px rgba(50,39,67,.04); }
.lobster-summary article.p0 { box-shadow: inset 4px 0 0 var(--coral), 0 12px 30px rgba(50,39,67,.04); }
.lobster-summary article.p0 strong { color: #c54833; }
.lobster-summary article.p1 { box-shadow: inset 4px 0 0 var(--amber), 0 12px 30px rgba(50,39,67,.04); }
.lobster-summary article.p1 strong { color: #aa711c; }
.lobster-summary article.p2 { box-shadow: inset 4px 0 0 var(--blue), 0 12px 30px rgba(50,39,67,.04); }
.lobster-summary article.people { box-shadow: inset 4px 0 0 var(--mint), 0 12px 30px rgba(50,39,67,.04); }

.lobster-process { margin-bottom: 12px; }
.lobster-panel-head { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 22px; border-bottom: 1px solid var(--line); }
.lobster-panel-head .panel-number { margin-bottom: 7px; }
.lobster-panel-head h3 { font-size: 20px; }
.lobster-panel-head > b, .lobster-panel-head > span { flex: 0 0 auto; padding: 7px 10px; border-radius: 999px; color: #654db8; background: rgba(118,89,215,.08); font-size: 12px; font-weight: 700; }
.lobster-stage-list { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 0; padding: 14px 18px 18px; }
.lobster-stage-list article { min-width: 0; display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 10px; padding: 8px 12px; border-right: 1px solid var(--line); }
.lobster-stage-list article:last-child { border-right: 0; }
.lobster-stage-list article > span { color: #6d6575; font: 600 12px "DM Mono", monospace; }
.lobster-stage-list strong, .lobster-stage-list small { display: block; }
.lobster-stage-list strong { overflow: hidden; color: #393142; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.lobster-stage-list small { margin-top: 4px; color: #837b8b; font-size: 12px; }
.lobster-stage-list i { position: relative; height: 5px; display: block; margin-top: 8px; overflow: hidden; border-radius: 99px; background: rgba(65,48,88,.08); }
.lobster-stage-list i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--stage-ratio); border-radius: inherit; background: linear-gradient(90deg,var(--violet),var(--coral)); }
.lobster-insight-layout { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 0 0 12px; }
.lobster-insight { min-width: 0; }
.lobster-insight .lobster-panel-head { min-height: 72px; padding: 15px 18px; }
.lobster-insight-list { min-height: 175px; max-height: 260px; padding: 7px 14px 13px; overflow: auto; }
.lobster-insight-list article { padding: 10px 4px; border-bottom: 1px solid rgba(65,48,88,.075); }
.lobster-insight-list article:last-child { border-bottom: 0; }
.lobster-insight-list article > div { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.lobster-insight-list strong { min-width: 0; color: #362e40; font-size: 13px; }
.lobster-insight-list b { flex: 0 0 auto; color: #b34a37; font-size: 12px; }
.lobster-insight-list small { display: block; margin-top: 5px; color: #736b7c; font-size: 12px; line-height: 1.5; }
.lobster-method-state { min-height: 175px; padding: 22px; }
.lobster-method-state > strong { display: block; color: #2f2739; font: 700 28px/1.1 "DM Mono",monospace; }
.lobster-method-state > strong small { color: #726a7a; font: 600 12px/1.4 var(--sans); }
.lobster-method-state > p { margin: 15px 0 11px; color: #675f70; font-size: 12px; line-height: 1.65; }
.lobster-method-state > span { display: inline-flex; padding: 6px 9px; border-radius: 999px; color: #177d60; background: rgba(40,169,128,.09); font-size: 11px; font-weight: 700; }

.lobster-layout { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(355px,.7fr); gap: 12px; }
.lobster-side { display: grid; align-content: start; gap: 12px; }
.lobster-toolbar { display: grid; grid-template-columns: 120px 140px 120px minmax(190px,1fr); gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.lobster-toolbar label { min-width: 0; display: grid; gap: 5px; color: #655d70; font-size: 12px; font-weight: 700; }
.lobster-toolbar select, .lobster-toolbar input { width: 100%; height: 40px; padding: 0 11px; border: 1px solid var(--line); border-radius: 10px; outline: none; color: #332b3d; background: #eceef2; font-size: 13px; }
.lobster-toolbar select:focus-visible, .lobster-toolbar input:focus-visible { border-color: rgba(118,89,215,.72); box-shadow: 0 0 0 3px rgba(118,89,215,.16); }
.lobster-risk-list { min-height: 480px; max-height: 690px; padding: 7px 12px 12px; overflow: auto; }
.lobster-risk-row { width: 100%; min-height: 86px; display: grid; grid-template-columns: 8px minmax(0,1fr) auto; gap: 13px; align-items: center; padding: 11px 10px; border: 0; border-bottom: 1px solid rgba(65,48,88,.075); border-radius: 11px; text-align: left; background: transparent; cursor: pointer; transition: background .18s ease, transform .18s ease; }
.lobster-risk-row:hover { background: rgba(118,89,215,.055); transform: translateY(-1px); }
.lobster-risk-row > i { width: 8px; height: 44px; border-radius: 99px; background: var(--blue); }
.lobster-risk-row[data-priority="P0"] > i { background: var(--coral); box-shadow: 0 0 12px rgba(238,118,93,.22); }
.lobster-risk-row[data-priority="P1"] > i { background: var(--amber); }
.lobster-risk-row.handled { opacity: .62; }
.lobster-risk-copy { min-width: 0; }
.lobster-risk-copy > div { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.lobster-risk-copy strong { color: #30283b; font-size: 14px; }
.lobster-risk-copy em { padding: 4px 7px; border-radius: 999px; color: #a33f2d; background: rgba(238,118,93,.1); font-size: 12px; font-style: normal; font-weight: 700; }
.lobster-risk-copy em.signal-count { color: #6755a4; background: rgba(118,89,215,.08); }
.lobster-risk-copy span, .lobster-risk-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lobster-risk-copy span { margin-top: 6px; color: #655e70; font-size: 12px; }
.lobster-risk-copy small { margin-top: 5px; color: #6f6877; font-size: 12px; }
.lobster-risk-row > b { padding: 7px 9px; border-radius: 9px; color: #5b43ab; background: rgba(118,89,215,.08); font-size: 12px; white-space: nowrap; }
.lobster-empty { min-height: 86px; margin: 0; display: grid; place-items: center; color: #625a6b; font-size: 13px; text-align: center; }
.lobster-empty.error { color: #bd4c38; }

.lobster-people-head, .lobster-person-row { display: grid; grid-template-columns: minmax(88px,1fr) 52px 66px 52px; gap: 7px; align-items: center; }
.lobster-people-head { min-height: 38px; padding: 0 14px; color: #675f70; background: rgba(222,225,230,.34); font-size: 12px; font-weight: 700; }
.lobster-people-head span:not(:first-child) { text-align: right; }
.lobster-people-list { max-height: 430px; padding: 5px 10px 10px; overflow: auto; }
.lobster-person-row { position: relative; width: 100%; min-height: 48px; padding: 7px 5px; border: 0; border-bottom: 1px solid rgba(65,48,88,.07); background: transparent; text-align: left; cursor: pointer; }
.lobster-person-row:hover { background: rgba(118,89,215,.05); }
.lobster-person-row strong { overflow: hidden; color: #342c3d; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.lobster-person-row span { color: #6d6577; font: 600 12px "DM Mono", monospace; text-align: right; }
.lobster-person-row span.critical { color: #c94b36; }
.lobster-person-row b { position: absolute; top: 3px; right: 2px; min-width: 20px; height: 20px; display: grid; place-items: center; border-radius: 99px; color: #fff; background: var(--coral); font-size: 12px; }
.lobster-learning-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 14px 16px 10px; }
.lobster-learning-stats article { min-height: 76px; padding: 12px; border: 1px solid rgba(65,48,88,.08); border-radius: 12px; background: rgba(255,255,255,.55); }
.lobster-learning-stats span, .lobster-learning-stats strong { display: block; }
.lobster-learning-stats span { color: #675f70; font-size: 12px; }
.lobster-learning-stats strong { margin-top: 8px; color: #322a3b; font-size: 20px; }
.lobster-guardrail { margin: 0; padding: 5px 16px 18px; color: #81798b; font-size: 12px; line-height: 1.6; }
.lobster-ledger { margin-top: 12px; }
.lobster-ledger-list { padding: 4px 18px 16px; }
.lobster-ledger-list article { min-height: 54px; display: grid; grid-template-columns: 120px minmax(0,1fr) 88px 38px; gap: 12px; align-items: center; border-bottom: 1px solid rgba(65,48,88,.075); }
.lobster-ledger-list time { color: #675f70; font: 600 12px "DM Mono", monospace; }
.lobster-ledger-list strong, .lobster-ledger-list small { display: block; }
.lobster-ledger-list strong { color: #3c3446; font-size: 13px; }
.lobster-ledger-list small { margin-top: 3px; overflow: hidden; color: #6d6575; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.lobster-ledger-list b { padding: 6px 8px; border-radius: 999px; color: #5b43ad; background: rgba(118,89,215,.08); font-size: 12px; text-align: center; }
.lobster-ledger-list b[data-action="resolved"] { color: #177d60; background: rgba(40,169,128,.09); }
.lobster-ledger-list b[data-action="false_positive"] { color: #a46b17; background: rgba(217,149,49,.1); }
.lobster-ledger-list > article > span { color: #6b6473; font: 700 12px "DM Mono", monospace; text-align: right; }

.lobster-evidence-dialog { width: min(680px,calc(100% - 22px)); height: calc(100dvh - 24px); max-height: calc(100dvh - 24px); margin: 12px 12px 12px auto; border-radius: 24px; }
.lobster-evidence-dialog .dialog-shell { height: 100%; max-height: none; overflow-y: auto; }
.lobster-evidence-body { flex: 0 0 auto; padding: 0 28px 22px; overflow: visible; }
.lobster-evidence-summary { padding: 17px 18px; border: 1px solid rgba(238,118,93,.16); border-radius: 15px; background: rgba(238,118,93,.065); }
.lobster-evidence-summary > span { display: inline-flex; padding: 5px 8px; border-radius: 99px; color: #a8402e; background: rgba(238,118,93,.1); font-size: 12px; font-weight: 800; }
.lobster-evidence-summary h3 { margin: 10px 0 0; color: #332b3d; font-size: 18px; }
.lobster-evidence-summary p { margin: 7px 0 0; color: #6e6678; font-size: 13px; line-height: 1.65; }
.lobster-evidence-section { margin-top: 12px; padding: 16px; border: 1px solid rgba(65,48,88,.09); border-radius: 14px; background: rgba(255,255,255,.63); }
.lobster-evidence-section header .panel-number { margin-bottom: 6px; }
.lobster-evidence-section header h3 { margin: 0; color: #372f40; font-size: 16px; }
.lobster-signal-list { display: grid; gap: 8px; margin-top: 12px; }
.lobster-signal-list article { padding: 12px; border-radius: 11px; background: #f0f1f4; }
.lobster-signal-list article > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.lobster-signal-list strong { color: #403748; font-size: 13px; }
.lobster-signal-list b { color: #c14935; font-size: 11px; }
.lobster-signal-list p { margin: 7px 0 0; color: #6f6878; font-size: 12px; }
.lobster-signal-list small { display: block; margin-top: 5px; color: #6f6877; font-size: 12px; line-height: 1.5; }
.lobster-evidence-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 12px; }
.lobster-evidence-grid article { min-height: 66px; padding: 11px; border-radius: 10px; background: #f0f1f4; }
.lobster-evidence-grid span, .lobster-evidence-grid strong { display: block; }
.lobster-evidence-grid span { color: #6d6575; font-size: 12px; }
.lobster-evidence-grid strong { margin-top: 7px; overflow-wrap: anywhere; color: #403748; font-size: 12px; }
.lobster-evidence-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.lobster-evidence-meta span { padding: 5px 7px; border-radius: 8px; color: #696170; background: rgba(65,48,88,.055); font: 600 12px "DM Mono", monospace; }
.lobster-process-timeline { position: relative; display: grid; gap: 0; margin-top: 11px; }
.lobster-process-timeline article { display: grid; grid-template-columns: 126px minmax(0,1fr); gap: 12px; padding: 11px 0; border-bottom: 1px solid rgba(65,48,88,.075); }
.lobster-process-timeline time { color: #655c70; font: 600 11px/1.5 "DM Mono",monospace; }
.lobster-process-timeline strong { color: #352d3f; font-size: 13px; }
.lobster-process-timeline p { margin: 5px 0 0; color: #696171; font-size: 12px; line-height: 1.55; }
.lobster-process-timeline small { display: block; margin-top: 5px; color: #b54a36; font-size: 11px; }
.lobster-method-note { margin: 10px 0 0; color: #6b6374; font-size: 12px; line-height: 1.55; }
.lobster-method-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.lobster-method-tags span { padding: 5px 8px; border-radius: 999px; color: #5d49aa; background: rgba(118,89,215,.08); font-size: 11px; font-weight: 700; }
.lobster-reference-list { display: grid; gap: 8px; margin-top: 12px; }
.lobster-reference-list article { padding: 12px; border: 1px solid rgba(65,48,88,.08); border-radius: 11px; background: #f0f1f4; }
.lobster-reference-list article > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.lobster-reference-list strong { color: #393143; font-size: 12px; }
.lobster-reference-list b { color: #177d60; font-size: 11px; }
.lobster-reference-list small, .lobster-reference-list p { color: #6e6678; font-size: 11px; line-height: 1.5; }
.lobster-reference-list p { margin: 5px 0 0; }
.lobster-boundary-note { display: block; margin-top: 10px; color: #81798a; font-size: 11px; line-height: 1.55; }
.lobster-profile-list { display: grid; gap: 7px; margin-top: 12px; }
.lobster-profile-list article { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 4px 10px; padding: 10px; border-radius: 10px; background: #f0f1f4; }
.lobster-profile-list strong { color: #3e3547; font-size: 12px; }
.lobster-profile-list b { color: #bd4935; font-size: 12px; }
.lobster-profile-list small { grid-column: 1 / -1; color: #716979; font-size: 11px; }
.lobster-shadow-box { margin: 0 28px 20px; padding: 18px; border: 1px solid rgba(82,116,206,.2); border-radius: 16px; background: linear-gradient(145deg,rgba(240,245,255,.96),rgba(246,243,255,.92)); }
.lobster-shadow-box > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.lobster-shadow-box h3 { margin: 3px 0 0; color: #302943; font-size: 17px; }
.lobster-shadow-box header p { max-width: 470px; margin: 7px 0 0; color: #665f73; font-size: 12px; line-height: 1.6; }
.lobster-shadow-readonly { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 999px; color: #315c9d; background: rgba(68,119,202,.09); font-size: 12px; font-weight: 800; }
.lobster-shadow-readonly i { width: 7px; height: 7px; border-radius: 50%; background: #3b78d0; box-shadow: 0 0 0 4px rgba(59,120,208,.1); }
.lobster-shadow-controls { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 9px; align-items: end; margin-top: 14px; }
.lobster-shadow-controls label { display: grid; gap: 6px; color: #655d6d; font-size: 12px; font-weight: 700; }
.lobster-shadow-controls input { width: 100%; height: 40px; padding: 0 11px; border: 1px solid rgba(82,116,206,.2); border-radius: 10px; outline: 0; color: #352d3e; background: rgba(255,255,255,.9); font-size: 13px; }
.lobster-shadow-controls input:focus-visible { border-color: rgba(82,116,206,.72); box-shadow: 0 0 0 3px rgba(82,116,206,.14); }
.lobster-shadow-controls button { min-height: 40px; padding: 0 16px; border: 1px solid rgba(82,116,206,.24); border-radius: 10px; color: #fff; background: #405f9f; font-size: 12px; font-weight: 800; cursor: pointer; }
.lobster-shadow-controls button:hover { background: #344f87; }
.lobster-shadow-controls button:disabled { cursor: wait; opacity: .58; }
.lobster-shadow-status { min-height: 18px; display: block; margin-top: 9px; color: #6c6477; font-size: 12px; line-height: 1.5; }
.lobster-shadow-status.loading { color: #385f9f; }
.lobster-shadow-status.success { color: #177d60; }
.lobster-shadow-status.unconfigured { color: #9b681d; }
.lobster-shadow-status.error { color: #c44b36; }
.lobster-shadow-result { display: grid; gap: 10px; margin-top: 12px; }
.lobster-shadow-summary { padding: 14px; border: 1px solid rgba(82,116,206,.13); border-radius: 12px; background: rgba(255,255,255,.72); }
.lobster-shadow-summary > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.lobster-shadow-summary span { padding: 4px 7px; border-radius: 999px; color: #385f9f; background: rgba(82,116,206,.1); font-size: 10px; font-weight: 900; }
.lobster-shadow-summary small { color: #71697d; font-size: 11px; }
.lobster-shadow-summary p { margin: 9px 0 0; color: #383044; font-size: 14px; font-weight: 700; line-height: 1.6; }
.lobster-shadow-section { padding: 13px 14px; border-radius: 12px; background: rgba(255,255,255,.58); }
.lobster-shadow-section h4 { margin: 0 0 9px; color: #3a3147; font-size: 13px; }
.lobster-shadow-list { display: grid; gap: 7px; }
.lobster-shadow-list article { padding: 11px; border-left: 3px solid rgba(82,116,206,.55); border-radius: 8px; background: rgba(236,241,250,.74); }
.lobster-shadow-list.recommendations article { border-left-color: rgba(40,169,128,.58); background: rgba(237,248,244,.78); }
.lobster-shadow-list article > div { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.lobster-shadow-list strong { color: #3b3347; font-size: 12px; line-height: 1.5; }
.lobster-shadow-list b { flex: 0 0 auto; color: #3c659f; font-size: 10px; }
.lobster-shadow-list p { margin: 6px 0 0; color: #686071; font-size: 12px; line-height: 1.55; }
.lobster-shadow-refs { display: block; margin-top: 6px; color: #827a8d; font: 600 10px/1.45 "DM Mono",monospace; }
.lobster-shadow-method { color: #655d6d; font-size: 12px; line-height: 1.6; }
.lobster-shadow-method > strong { color: #393044; font-size: 13px; }
.lobster-shadow-method p { margin: 7px 0 0; }
.lobster-shadow-method ol { margin: 8px 0 0; padding-left: 22px; }
.lobster-shadow-method li + li { margin-top: 4px; }
.lobster-shadow-method .warning { color: #9b4c3d; }
.lobster-shadow-section.limitations ul { margin: 0; padding-left: 20px; color: #6b6374; font-size: 11px; line-height: 1.6; }
.lobster-shadow-section.limitations li + li { margin-top: 4px; }
.lobster-shadow-disclaimer { margin: 0; padding: 10px 12px; border-radius: 9px; color: #5d5370; background: rgba(118,89,215,.075); font-size: 11px; font-weight: 700; line-height: 1.55; }
.lobster-feedback-box { padding: 17px 28px 20px; border-top: 1px solid var(--line); background: rgba(247,248,250,.96); }
.lobster-feedback-box > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.lobster-feedback-box h3 { margin: 0; color: #352d3e; font-size: 16px; }
.lobster-feedback-box p { margin: 0; color: #6d6575; font-size: 12px; }
.lobster-feedback-box label { display: grid; gap: 6px; margin-top: 10px; color: #655d6d; font-size: 12px; font-weight: 700; }
.lobster-feedback-box input, .lobster-feedback-box textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; outline: 0; color: #352d3e; background: #fff; font-size: 13px; }
.lobster-feedback-box input { height: 40px; padding: 0 11px; }
.lobster-feedback-box textarea { min-height: 66px; padding: 10px 11px; resize: vertical; }
.lobster-feedback-box input:focus-visible, .lobster-feedback-box textarea:focus-visible { border-color: rgba(118,89,215,.72); box-shadow: 0 0 0 3px rgba(118,89,215,.16); }
.lobster-feedback-actions { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; margin-top: 11px; }
.lobster-feedback-actions button { min-height: 38px; border: 1px solid rgba(118,89,215,.2); border-radius: 9px; color: #6049b2; background: rgba(118,89,215,.07); font-size: 12px; font-weight: 700; cursor: pointer; }
.lobster-feedback-actions button:hover { background: rgba(118,89,215,.12); }
.lobster-feedback-actions button:disabled { cursor: wait; opacity: .5; }
#lobsterFeedbackStatus { min-height: 18px; display: block; margin-top: 8px; color: #675f70; font-size: 12px; }
#lobsterFeedbackStatus.success { color: #177d60; }
#lobsterFeedbackStatus.error { color: #c44b36; }

@media (max-width: 1100px) {
  .lobster-summary { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .lobster-boundary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lobster-insight-layout { grid-template-columns: 1fr 1fr; }
  .lobster-insight:last-child { grid-column: 1 / -1; }
  .lobster-layout { grid-template-columns: 1fr; }
  .lobster-side { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lobster-stage-list { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .lobster-stage-list article:nth-child(3n) { border-right: 0; }
}

@media (max-width: 760px) {
  .primary-nav { padding-bottom: 8px; scrollbar-width: thin; scrollbar-color: rgba(118,89,215,.42) transparent; }
  .primary-nav::-webkit-scrollbar { display: block; height: 4px; }
  .primary-nav::-webkit-scrollbar-thumb { border-radius: 99px; background: rgba(118,89,215,.42); }
  .lobster-hero { align-items: flex-start; flex-direction: column; padding: 22px; }
  .lobster-identity { align-items: flex-start; }
  .lobster-mark { width: 52px; height: 52px; font-size: 25px; }
  .lobster-hero h2 { font-size: 23px; }
  .lobster-hero p { font-size: 13px; }
  .lobster-hero-actions { width: 100%; align-items: flex-start; }
  .lobster-freshness { align-items: flex-start; flex-wrap: wrap; }
  .lobster-freshness small { flex-basis: calc(100% - 20px); margin-left: 18px; }
  .lobster-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lobster-insight-layout { grid-template-columns: 1fr; }
  .lobster-insight:last-child { grid-column: auto; }
  .lobster-summary article { min-height: 105px; }
  .lobster-stage-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lobster-stage-list article, .lobster-stage-list article:nth-child(3n) { border-right: 1px solid var(--line); }
  .lobster-stage-list article:nth-child(2n) { border-right: 0; }
  .lobster-toolbar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lobster-search { grid-column: 1 / -1; }
  .lobster-side { grid-template-columns: 1fr; }
  .lobster-ledger-list article { grid-template-columns: 82px minmax(0,1fr) 76px; }
  .lobster-ledger-list > article > span { display: none; }
  .lobster-evidence-dialog { width: 100%; height: 100dvh; max-height: 100dvh; margin: 0; border-radius: 0; }
}

@media (max-width: 520px) {
  .lobster-identity { gap: 12px; }
  .lobster-summary { grid-template-columns: 1fr; }
  .lobster-summary article { min-height: 94px; }
  .lobster-stage-list { grid-template-columns: 1fr; }
  .lobster-stage-list article, .lobster-stage-list article:nth-child(2n), .lobster-stage-list article:nth-child(3n) { border-right: 0; border-bottom: 1px solid var(--line); }
  .lobster-toolbar { grid-template-columns: 1fr; }
  .lobster-search { grid-column: auto; }
  .lobster-risk-row { grid-template-columns: 7px minmax(0,1fr); }
  .lobster-risk-row > b { display: none; }
  .lobster-risk-copy span, .lobster-risk-copy small { white-space: normal; }
  .lobster-learning-stats { grid-template-columns: 1fr 1fr; }
  .lobster-ledger-list article { grid-template-columns: 1fr auto; gap: 5px 10px; padding: 9px 0; }
  .lobster-ledger > .lobster-panel-head { align-items: flex-start; flex-direction: column; }
  .lobster-ledger > .lobster-panel-head > span { white-space: normal; }
  .lobster-ledger-list time { grid-column: 1 / -1; }
  .lobster-feedback-box, .lobster-evidence-body { padding-left: 18px; padding-right: 18px; }
  .lobster-shadow-box { margin-left: 18px; margin-right: 18px; }
  .lobster-shadow-box > header { flex-direction: column; }
  .lobster-shadow-controls { grid-template-columns: 1fr; }
  .lobster-feedback-box > div:first-child { align-items: flex-start; flex-direction: column; }
  .lobster-feedback-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lobster-evidence-grid { grid-template-columns: 1fr; }
  .lobster-boundary { grid-template-columns: 1fr; }
  .lobster-process-timeline article { grid-template-columns: 1fr; gap: 3px; }
}