:root {
  --ink: #17221f;
  --muted: #66736d;
  --line: #dce4dd;
  --paper: #f7f8f4;
  --surface: #ffffff;
  --forest: #184c3a;
  --sage: #dcead8;
  --gold: #c88d27;
  --clay: #bd5e3e;
  --blue: #3f6f93;
  --radius: 14px;
  --shadow: 0 12px 28px rgba(25, 43, 35, 0.07);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  line-height: 1.55;
}
button, a { font: inherit; }
button { cursor: pointer; }
a { color: inherit; }

.skip-link { position: fixed; left: 1rem; top: -4rem; z-index: 10; padding: .55rem .75rem; background: var(--ink); color: white; border-radius: 6px; }
.skip-link:focus { top: 1rem; }
.site-header, .main-nav, main, footer { max-width: 1480px; margin-inline: auto; }
.site-header { display: flex; justify-content: space-between; align-items: center; gap: 1.25rem; padding: 1.5rem 2rem 1rem; }
.brand { display: flex; gap: .8rem; align-items: center; }
.brand-mark { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; color: #fff; background: var(--forest); border-radius: 50%; font-family: Georgia, serif; font-weight: 800; }
.brand h1 { margin: -.2rem 0 0; font-size: 1.1rem; letter-spacing: -.02em; }
.eyebrow, .panel-label { margin: 0; color: var(--muted); font-size: .7rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.header-actions { display: flex; align-items: center; gap: .85rem; }
.access-note { display: inline-flex; align-items: center; gap: .4rem; color: var(--muted); font-size: .85rem; }
.status-dot { width: .55rem; height: .55rem; background: #5b9e75; border-radius: 50%; }
.secondary-button, .primary-button, .filter-button { border-radius: 8px; border: 1px solid var(--line); padding: .55rem .85rem; background: var(--surface); color: var(--ink); font-weight: 650; }
.secondary-button:hover, .filter-button:hover { border-color: var(--forest); color: var(--forest); }
.primary-button { border-color: var(--forest); background: var(--forest); color: #fff; }
.main-nav { display: flex; gap: .35rem; padding: 0 2rem; border-bottom: 1px solid var(--line); overflow-x: auto; }
.main-nav a { flex: 0 0 auto; padding: .8rem .7rem; color: var(--muted); text-decoration: none; font-size: .9rem; font-weight: 650; border-bottom: 2px solid transparent; }
.main-nav a:hover, .main-nav a.active { color: var(--forest); border-color: var(--forest); }
.section-wrap { padding: 3.8rem 2rem; border-bottom: 1px solid var(--line); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.75rem; }
.section-heading h2 { margin: .15rem 0 0; font-size: clamp(1.55rem, 3vw, 2.25rem); line-height: 1.15; letter-spacing: -.045em; }
.project-period { margin: .75rem 0 0; color: var(--forest); font-size: .9rem; }
.project-period span { color: var(--muted); }
.section-heading.compact h2 { font-size: clamp(1.35rem, 2.4vw, 1.8rem); }
.updated, .section-note { margin: 0; color: var(--muted); font-size: .83rem; text-align: right; }
.overview-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr); gap: 1rem; }
.priority-panel { display: flex; flex-direction: column; align-items: flex-start; min-height: 230px; padding: 1.8rem; border-radius: var(--radius); background: var(--forest); color: #fff; }
.priority-panel .panel-label { color: #c8dacd; }
.priority-panel h3 { max-width: 38rem; margin: .85rem 0 .4rem; font-size: clamp(1.35rem, 2vw, 1.8rem); line-height: 1.22; letter-spacing: -.035em; }
.priority-panel p:not(.panel-label) { max-width: 40rem; margin: 0; color: #d8e7dc; }
.text-link { margin-top: auto; padding-top: 1.2rem; color: white; font-weight: 700; text-decoration: none; }
.text-link:hover { text-decoration: underline; }
.metric-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.metric { min-height: 108px; padding: 1.15rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.metric-value { display: block; font-size: 1.55rem; font-weight: 760; letter-spacing: -.04em; }
.metric-label { display: block; margin-top: .15rem; color: var(--muted); font-size: .82rem; }
.accent-metric { background: #fffaf0; border-color: #f0d8a3; }
.notice { margin-top: 1rem; padding: .85rem 1rem; color: #3c5148; background: var(--sage); border-radius: 10px; font-size: .9rem; }
.roadmap-table { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--surface); }
.roadmap-row { display: grid; grid-template-columns: 1.1fr .85fr 1.55fr 1.5fr; gap: 1rem; padding: 1.15rem 1.25rem; border-top: 1px solid var(--line); }
.roadmap-row:first-child { border-top: 0; }
.roadmap-head { padding-block: .7rem; background: #f2f5f0; color: var(--muted); font-size: .73rem; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }
.roadmap-row p { margin: .35rem 0 0; color: var(--muted); font-size: .86rem; }
.lane-dot { display: inline-block; width: .65rem; height: .65rem; margin-right: .5rem; border-radius: 50%; }
.lane-ssm, .ssm-label { background: var(--gold); }.lane-platform, .platform-label { background: var(--blue); }.lane-client, .client-label { background: var(--clay); }
.badge, .lane-label, .risk { display: inline-flex; align-items: center; width: fit-content; padding: .18rem .45rem; border-radius: 99px; font-size: .7rem; font-weight: 750; line-height: 1.2; }
.badge-week { background: #fff0d8; color: #8a5b0e; }.badge-progress { background: #e0edf5; color: #2f627f; }.badge-waiting { background: #fde9df; color: #99503b; }
.filters { display: flex; flex-wrap: wrap; gap: .4rem; }.filter-button { font-size: .8rem; padding: .4rem .65rem; }.filter-button.is-selected { color: #fff; background: var(--forest); border-color: var(--forest); }
.kanban { display: grid; grid-template-columns: repeat(5, minmax(245px, 1fr)); gap: 1rem; overflow-x: auto; padding-bottom: .5rem; }
.kanban-column { min-height: 250px; padding: .8rem; background: #eef1ed; border-radius: 12px; }
.kanban-column > header { display: flex; justify-content: space-between; align-items: center; margin-bottom: .7rem; }
.kanban-column h3 { margin: 0; font-size: .88rem; }.count { display: grid; place-items: center; min-width: 1.35rem; height: 1.35rem; padding: 0 .25rem; color: var(--muted); border-radius: 99px; background: #dce2dc; font-size: .73rem; font-weight: 750; }
.task-stack { display: grid; gap: .75rem; }.task-card { padding: .9rem; border: 1px solid #dde3dd; border-radius: 10px; background: var(--surface); box-shadow: 0 2px 7px rgba(20, 44, 29, .04); }
.card-topline { display: flex; justify-content: space-between; gap: .5rem; }.lane-label { color: #fff; }.risk { color: var(--muted); background: #edf0ed; }.risk.high { color: #93452e; background: #fde8df; }.risk.medium { color: #8a5b0e; background: #fff0d8; }.risk.low { color: #2d6a4b; background: #e1eee3; }.done-risk { color: #2d6a4b; background: #e1eee3; }
.task-card h4 { margin: .7rem 0 .8rem; font-size: .97rem; line-height: 1.35; letter-spacing: -.015em; }.task-card dl { display: grid; gap: .55rem; margin: 0; }.task-card dl div { display: grid; gap: .08rem; }.task-card dt { color: var(--muted); font-size: .68rem; font-weight: 750; }.task-card dd { margin: 0; color: #3d4a45; font-size: .76rem; line-height: 1.43; }
.filter-result { min-height: 1.3em; margin: .8rem 0 0; color: var(--muted); font-size: .84rem; }
.client-section { background: #f2f5f0; }.client-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }.client-grid article { padding: 1.4rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }.client-grid h3 { margin: 0; font-size: 1rem; }.client-grid ul { display: grid; gap: .6rem; padding: 0; margin: 1rem 0 0; list-style: none; font-size: .88rem; }.client-grid li { position: relative; padding-left: 1.25rem; }.check-list li::before, .pending-list li::before { position: absolute; left: 0; font-weight: 800; }.check-list li::before { content: "✓"; color: #2d7755; }.pending-list li::before { content: "?"; color: #a96f11; }
.tomorrow-section { background: #fffdf7; }.tomorrow-note { margin: 0 0 1rem; text-align: left; }.tomorrow-list { display: grid; gap: .65rem; padding: 0; margin: 0; list-style: none; }.tomorrow-item { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) auto; align-items: center; gap: .9rem; padding: .95rem 1rem; border: 1px solid #eadfca; border-radius: 10px; background: var(--surface); }.tomorrow-item-waiting { border-color: #f0c9b9; background: #fff8f4; }.tomorrow-number { color: var(--gold); font-size: .78rem; font-weight: 800; letter-spacing: .08em; }.tomorrow-item strong { display: block; font-size: .92rem; }.tomorrow-item p { margin: .18rem 0 0; color: var(--muted); font-size: .78rem; }.tomorrow-sync { margin: 1rem 0 0; color: #53635a; font-size: .84rem; }
.next-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; padding: 0; margin: 0; list-style: none; }.next-list li { padding-top: 1rem; border-top: 2px solid var(--ink); }.next-list span { color: var(--forest); font-size: .72rem; font-weight: 800; letter-spacing: .1em; }.next-list strong { display: block; margin: .45rem 0 .25rem; }.next-list p { margin: 0; color: var(--muted); font-size: .85rem; }
footer { display: flex; justify-content: space-between; gap: 1rem; padding: 1.5rem 2rem; color: var(--muted); font-size: .75rem; } footer p { margin: 0; }
dialog { width: min(34rem, calc(100% - 2rem)); border: 0; border-radius: var(--radius); box-shadow: 0 22px 55px rgba(0,0,0,.22); }dialog::backdrop { background: rgba(14, 27, 21, .55); }.dialog-content { padding: 1.4rem; }.dialog-content h2 { margin: .45rem 0; font-size: 1.4rem; }.dialog-content p:not(.eyebrow) { color: var(--muted); }.dialog-content button { margin-top: .5rem; }
button:focus-visible, a:focus-visible { outline: 3px solid #e9b759; outline-offset: 3px; }

@media (max-width: 860px) { .site-header, .section-heading, footer { align-items: flex-start; flex-direction: column; }.header-actions { width: 100%; justify-content: space-between; }.overview-grid, .client-grid { grid-template-columns: 1fr; }.roadmap-table { overflow-x: auto; }.roadmap-row { min-width: 760px; }.updated, .section-note { text-align: left; }.next-list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .site-header, .section-wrap, footer { padding-left: 1rem; padding-right: 1rem; }.main-nav { padding-inline: 1rem; }.section-wrap { padding-block: 2.7rem; }.metric-grid { gap: .65rem; }.metric { min-height: 92px; padding: .9rem; }.kanban { grid-template-columns: repeat(5, minmax(84vw, 1fr)); }.tomorrow-item { grid-template-columns: 2rem minmax(0, 1fr); }.tomorrow-item .lane-label, .tomorrow-item .badge { grid-column: 2; justify-self: start; }.next-list { grid-template-columns: 1fr; }.header-actions { align-items: flex-end; }.access-note { font-size: .75rem; } }
