/* 静室 CSS：03-layout.css。职责边界见 governance/CSS_ARCHITECTURE_AND_TOKENS_20260814.md。 */
@layer layout {
  /* 最轻的定位层：工具不应先于内容出现。 */ .site-header {
    border-bottom:var(--stroke-hairline) solid var(--border-subtle)
  }
  .masthead {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    max-width:var(--container-wide);
    min-height:58px;
    margin:auto;
    padding:0 var(--gutter)
  }
  .navigation-toggle { display:none; }
  .masthead-navigation { display:grid; grid-template-columns:auto auto; align-items:center; justify-content:end; gap:var(--space-5); min-width:0; }
  .brand {
    display:flex;
    align-items:baseline;
    gap:10px;
    width:max-content
  }
  .brand b {
    font:500 18px/1 var(--font-reading);
    letter-spacing:.06em
  }
  .brand small {
    color:var(--text-muted);
    font:600 8px/1 var(--font-ui);
    letter-spacing:.13em
  }
  .primary-nav {
    display:flex;
    align-items:center;
    gap:var(--grid-gap-standard);
    color:var(--text-muted);
    font-size:11px;
    font-weight:600;
    letter-spacing:.08em
  }
  .primary-nav a,.masthead-tools a {
    white-space:nowrap
  }
  .primary-nav a.active,.masthead-tools a.active {
    color:var(--text-primary)
  }
  .masthead-tools {
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:12px;
    color:var(--text-muted);
    font-size:10px;
    letter-spacing:.06em
  }
  .marks-nav {
    display:flex;
    align-items:center;
    gap:4px
  }
  .marks-nav b {
    color:var(--action-primary);
    font-size:9px
  }
  .desk-nav {
    padding-left:12px;
    border-left:var(--stroke-hairline) solid var(--border-subtle)
  }
  .quiet-control {
    width:25px;
    height:25px;
    padding:0;
    border:0;
    background:transparent;
    color:var(--text-muted);
    font-size:14px;
    cursor:pointer
  }
  .quiet-control:hover {
    color:var(--action-primary)
  }
  .page-shell {
    max-width:var(--container-wide);
    min-height:calc(100vh - 180px);
    margin:auto;
    padding:0 var(--gutter)
  }
  .site-footer {
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:var(--grid-gap-standard);
    max-width:var(--container-wide);
    margin:var(--space-page-end) auto 0;
    padding:var(--space-5) var(--gutter) var(--space-6);
    border-top:var(--stroke-hairline) solid var(--border-subtle);
    color:var(--text-muted);
    font-size:10px
  }
  .site-footer p {
    margin:0
  }
  .site-footer p:first-child b {
    color:var(--text-primary);
    font:500 13px var(--font-reading);
    letter-spacing:.06em
  }
  .footer-actions {
    display:flex;
    align-items:center;
    gap:10px
  }
  .footer-actions form {
    margin:0
  }
  .footer-actions a {
    font-size:10px
  }
  .text-button {
    padding:0;
    border:0;
    border-bottom:var(--stroke-hairline) solid var(--border-strong);
    background:transparent;
    color:var(--text-muted);
    font-size:10px;
    cursor:pointer
  }
  .text-button:hover {
    color:var(--action-primary);
    border-color:var(--action-primary)
  }
  .flash-stack {
    max-width:var(--container-reading);
    margin:30px auto 0
  }
  .flash {
    margin:0;
    padding:9px 0;
    border-bottom:var(--stroke-hairline) solid var(--border-subtle);
    font-size:.83rem
  }
  .flash.success {
    color:var(--action-primary)
  }
}