/* ==========================================
   AI 水印专题 - 深海信号与来源凭证
   ========================================== */

body.article-page[data-hero-tone="watermark"] {
    --article-hero-start: #071b22;
    --article-hero-mid: #0d3540;
    --article-hero-end: #164f55;
    --article-hero-glow-a: rgba(76, 235, 195, 0.22);
    --article-hero-glow-b: rgba(79, 151, 239, 0.2);
    --article-hero-accent: #76f1cf;
}

body.article-page[data-hero-tone="watermark"] .nav-links a.active {
    color: #963d1c;
    border-color: #e5ae95;
    background: #fff3ed;
}

body.article-page[data-hero-tone="watermark"] .nav-links a.active::before {
    background: #b84821;
}

.watermark-article {
    --wm-ink: #10292d;
    --wm-deep: #08262d;
    --wm-teal: #0a756b;
    --wm-mint: #dff7ef;
    --wm-green: #1fa67a;
    --wm-blue: #356cae;
    --wm-blue-soft: #e6f0fb;
    --wm-amber: #9a5d05;
    --wm-amber-soft: #fff3d9;
    --wm-coral: #aa493d;
}

.watermark-article code,
.watermark-article .hero-kicker,
.watermark-article .lab-index,
.watermark-article .metric-heading i,
.watermark-article .concept-top span {
    font-family: 'JetBrains Mono', monospace;
}

.watermark-article .chapter-section {
    scroll-margin-top: 112px;
}

.watermark-article .section-label {
    color: var(--wm-teal);
}

.watermark-article .section-title {
    margin-bottom: 0.8rem;
    color: var(--wm-ink);
    font-family: 'Noto Serif SC', serif;
    font-size: clamp(1.8rem, 3.8vw, 2.75rem);
    line-height: 1.34;
}

.watermark-article .section-intro {
    max-width: 880px;
    margin-bottom: 1.8rem;
    color: var(--text-secondary);
    font-size: 1.03rem;
    line-height: 1.9;
}

/* Hero */
.watermark-hero {
    min-height: 610px;
    display: grid;
    place-content: center;
}

.watermark-hero .article-title span {
    color: var(--article-hero-accent);
}

.signal-field span {
    position: absolute;
    z-index: -1;
    color: rgba(255, 255, 255, 0.08);
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(0.68rem, 1vw, 0.86rem);
    letter-spacing: 0.12em;
    white-space: nowrap;
}

.signal-field span:nth-child(1) { left: 5%; top: 18%; transform: rotate(-7deg); }
.signal-field span:nth-child(2) { right: 5%; top: 22%; transform: rotate(6deg); }
.signal-field span:nth-child(3) { left: 9%; bottom: 18%; }
.signal-field span:nth-child(4) { right: 8%; bottom: 18%; transform: rotate(-4deg); }

.hero-proof {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.6rem;
    width: fit-content;
    max-width: 100%;
    margin: 2rem auto 0;
    padding: 0.75rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 16px;
    background: rgba(2, 16, 20, 0.34);
    backdrop-filter: blur(10px);
}

.hero-proof i {
    color: rgba(255, 255, 255, 0.42);
    font-style: normal;
}

.hero-proof b {
    margin-left: 0.2rem;
    color: #ffcc82;
    font-size: 0.78rem;
}

.proof-chip {
    padding: 0.4rem 0.72rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
}

.proof-chip.embedded { color: #08382e; background: #75e5c3; }
.proof-chip.credential { color: #0b3155; background: #a8cef5; }
.proof-chip.context { color: #4c3000; background: #f5cf83; }

/* Opening */
.opening-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.82fr);
    gap: clamp(2rem, 5vw, 4.5rem);
    align-items: center;
}

.opening-copy > p:not(.section-intro) {
    color: var(--text-secondary);
    line-height: 1.9;
}

.origin-card {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 90px 1fr;
    align-items: center;
    min-height: 280px;
    padding: 1.5rem;
    border: 1px solid #cae5df;
    border-radius: 24px;
    background: linear-gradient(145deg, #f5fbf9, #e7f5f1);
    box-shadow: 0 18px 42px rgba(18, 139, 126, 0.12);
}

.origin-source,
.origin-output {
    text-align: center;
}

.origin-source strong,
.origin-source small,
.origin-output strong,
.origin-output small {
    display: block;
}

.origin-source small,
.origin-output small {
    margin-top: 0.4rem;
    color: var(--text-muted);
    font-size: 0.7rem;
    line-height: 1.5;
}

.origin-icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    margin: 0 auto 0.7rem;
    border-radius: 18px;
    color: #d7fff2;
    background: var(--wm-deep);
    box-shadow: 0 10px 22px rgba(8, 38, 45, 0.22);
    font-size: 1.7rem;
}

.origin-path {
    position: relative;
    height: 3px;
    background: repeating-linear-gradient(90deg, #4db7a7 0 9px, transparent 9px 15px);
}

.origin-path::after {
    content: '›';
    position: absolute;
    right: -3px;
    top: -20px;
    color: #258e82;
    font-size: 2rem;
}

.origin-path span {
    position: absolute;
    top: 50%;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #5ed2b9;
    transform: translateY(-50%);
    animation: travel-signal 2.4s infinite ease-in-out;
}

.origin-path span:nth-child(2) { animation-delay: 0.55s; }
.origin-path span:nth-child(3) { animation-delay: 1.1s; }

.output-preview {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 3px;
    width: 76px;
    height: 58px;
    margin: 0 auto 0.8rem;
    padding: 7px;
    border: 1px solid #b5d9d1;
    border-radius: 10px;
    background: #fff;
}

.output-preview i {
    border-radius: 3px;
    background: linear-gradient(180deg, #6cd0ba, #317f93);
    opacity: 0.86;
}

.output-preview i:nth-child(2),
.output-preview i:nth-child(4) { opacity: 0.35; }

.core-thesis {
    margin-top: 1.8rem;
    padding: 1.3rem 1.5rem;
    border-left: 4px solid var(--wm-teal);
    border-radius: 0 14px 14px 0;
    background: #effaf7;
}

.core-thesis span {
    color: var(--wm-teal);
    font-size: 0.73rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.core-thesis p {
    margin: 0.45rem 0 0;
    color: var(--text-secondary);
    line-height: 1.8;
}

/* Concepts */
.concept-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.concept-card {
    --concept-color: var(--wm-teal);
    position: relative;
    overflow: hidden;
    padding: 1.45rem;
    border: 1px solid var(--border-subtle);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.concept-card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: var(--concept-color);
}

.concept-card.detector-kind { --concept-color: var(--wm-amber); }
.concept-card.credential-kind { --concept-color: var(--wm-blue); }

.concept-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--concept-color);
}

.concept-top span { font-size: 0.68rem; letter-spacing: 0.12em; }
.concept-top i {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: #fff;
    background: var(--concept-color);
    font-style: normal;
    font-weight: 700;
}

.concept-card h3 { margin: 0.9rem 0 0.55rem; color: var(--wm-ink); font-size: 1.28rem; }
.concept-card > p { min-height: 104px; color: var(--text-secondary); line-height: 1.72; }
.concept-card dl { margin: 1rem 0 0; border-top: 1px solid var(--border-subtle); }
.concept-card dl div { display: grid; grid-template-columns: 78px 1fr; gap: 0.55rem; padding-top: 0.72rem; }
.concept-card dt { color: var(--text-muted); font-size: 0.72rem; }
.concept-card dd { margin: 0; color: var(--wm-ink); font-size: 0.82rem; font-weight: 600; }

.comparison-wrap {
    overflow-x: auto;
    margin-top: 1.5rem;
    border: 1px solid var(--border-subtle);
    border-radius: 16px;
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.watermark-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
}

.watermark-table th,
.watermark-table td {
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    text-align: left;
    line-height: 1.65;
}

.watermark-table thead th {
    color: var(--wm-ink);
    background: #f1f8f6;
    font-size: 0.78rem;
}

.watermark-table tbody th { color: var(--wm-ink); white-space: nowrap; }
.watermark-table tbody tr:last-child > * { border-bottom: 0; }

/* Media */
.media-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

.media-grid article {
    min-height: 270px;
    padding: 1.35rem;
    border: 1px solid var(--border-subtle);
    border-radius: 18px;
    background: linear-gradient(180deg, #fff, #f8fbfa);
}

.media-grid h3 { margin: 1rem 0 0.55rem; color: var(--wm-ink); }
.media-grid p { margin: 0; color: var(--text-secondary); font-size: 0.88rem; line-height: 1.75; }
.media-icon {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border-radius: 22px;
    background: var(--wm-mint);
}

.image-icon span {
    width: 44px;
    height: 38px;
    border-radius: 8px;
    background:
        radial-gradient(circle at 72% 25%, #f3bd5b 0 4px, transparent 5px),
        linear-gradient(145deg, transparent 49%, #258a7d 50% 67%, transparent 68%),
        linear-gradient(35deg, transparent 44%, #65cdb6 45% 67%, transparent 68%),
        #d4eee8;
    border: 2px solid #2e9488;
}

.audio-icon { display: flex; align-items: center; justify-content: center; gap: 4px; }
.audio-icon span { width: 5px; border-radius: 99px; background: #238e82; }
.audio-icon span:nth-child(1), .audio-icon span:nth-child(5) { height: 18px; }
.audio-icon span:nth-child(2), .audio-icon span:nth-child(4) { height: 36px; }
.audio-icon span:nth-child(3) { height: 50px; }
.video-icon span,
.credential-icon span {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    color: #fff;
    background: #238e82;
}
.credential-icon { background: var(--wm-blue-soft); }
.credential-icon span { background: var(--wm-blue); font-weight: 700; }

.tradeoff-band {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(0.65rem, 2vw, 1.5rem);
    margin-top: 1.5rem;
    padding: 1.35rem;
    border-radius: 18px;
    color: #e9fff8;
    background: var(--wm-deep);
}

.tradeoff-band div { text-align: center; }
.tradeoff-band strong, .tradeoff-band span { display: block; }
.tradeoff-band span { margin-top: 0.25rem; color: rgba(233, 255, 248, 0.62); font-size: 0.72rem; }
.tradeoff-band i { color: #72dfc3; font-style: normal; font-size: 1.3rem; }
.band-note { margin: 0.85rem 0 0; color: var(--text-muted); font-size: 0.82rem; line-height: 1.7; text-align: center; }

/* Text watermark */
.token-process {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.8rem;
    counter-reset: process;
}

.token-process article {
    position: relative;
    padding: 1.25rem;
    border: 1px solid #d1e9e3;
    border-radius: 16px;
    background: #f6fbfa;
}

.token-process article:not(:last-child)::after {
    content: '→';
    position: absolute;
    z-index: 2;
    right: -0.72rem;
    top: 50%;
    color: var(--wm-teal);
    transform: translateY(-50%);
}

.token-process article > span {
    color: var(--wm-teal);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
}
.token-process h3 { margin: 0.5rem 0; color: var(--wm-ink); font-size: 1rem; }
.token-process p { margin: 0; color: var(--text-secondary); font-size: 0.82rem; line-height: 1.65; }

.watermark-lab {
    display: grid;
    grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr);
    gap: 1.4rem 2rem;
    margin-top: 1.5rem;
    padding: clamp(1.4rem, 3vw, 2rem);
    border: 1px solid #b9dcd3;
    border-radius: 22px;
    background: linear-gradient(145deg, #edf9f5, #f8fcfb);
    box-shadow: 0 16px 44px rgba(18, 139, 126, 0.1);
}

.lab-index { color: var(--wm-teal); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.1em; }
.lab-copy h3 { margin: 0.55rem 0 0.75rem; color: var(--wm-ink); font-size: 1.28rem; line-height: 1.45; }
.lab-copy p { margin: 0; color: var(--text-secondary); font-size: 0.86rem; line-height: 1.72; }
.lab-controls { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.1rem; }
.lab-controls button,
.sample-buttons button {
    padding: 0.52rem 0.78rem;
    border: 1px solid #b7d9d2;
    border-radius: 9px;
    color: var(--wm-ink);
    background: #fff;
    cursor: pointer;
    font: inherit;
    font-size: 0.78rem;
    transition: 0.2s ease;
}
.lab-controls button:hover,
.sample-buttons button:hover { border-color: var(--wm-teal); color: var(--wm-teal); transform: translateY(-1px); }
.lab-controls .mode-button.active { color: #fff; border-color: var(--wm-teal); background: var(--wm-teal); }
.refresh-button { margin-left: auto; }

.token-stage {
    padding: 1rem;
    border: 1px solid #173f46;
    border-radius: 16px;
    background: var(--wm-deep);
}

.token-stream {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 0.45rem;
    min-height: 154px;
}

.token-stream span {
    padding: 0.38rem 0.56rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 7px;
    color: rgba(235, 250, 247, 0.68);
    background: rgba(255, 255, 255, 0.05);
    font-size: 0.77rem;
    animation: token-in 0.35s both;
    animation-delay: var(--delay);
}
.token-stream .green-token { color: #baffea; border-color: rgba(91, 225, 188, 0.46); background: rgba(55, 189, 151, 0.2); }
.token-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem 1rem; margin-top: 1rem; padding-top: 0.8rem; border-top: 1px solid rgba(255,255,255,.1); }
.token-stats div:not(.signal-meter) { display: flex; align-items: baseline; justify-content: space-between; }
.token-stats span { color: rgba(235, 250, 247, 0.58); font-size: 0.7rem; }
.token-stats strong { color: #94efd4; font-family: 'JetBrains Mono', monospace; }
.signal-meter { grid-column: 1 / -1; overflow: hidden; height: 6px; border-radius: 99px; background: rgba(255,255,255,.1); }
.signal-meter i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #4f93c5, #65e4be); transition: width 0.4s ease; }
.lab-disclaimer { grid-column: 1 / -1; margin: 0; color: var(--text-muted); font-size: 0.75rem; line-height: 1.65; }

.formula-card {
    display: grid;
    grid-template-columns: minmax(300px, 0.8fr) 1.2fr;
    gap: 2rem;
    align-items: center;
    margin-top: 1rem;
    padding: 1.25rem 1.4rem;
    border: 1px solid #d8e5e2;
    border-radius: 16px;
    background: #fff;
}
.formula-card span { display: block; margin-bottom: 0.45rem; color: var(--wm-teal); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.08em; }
.formula-card code { color: var(--wm-ink); font-size: 0.82rem; }
.formula-card p { margin: 0; color: var(--text-secondary); font-size: 0.85rem; line-height: 1.7; }

/* Style metrics */
.metric-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.metric-card {
    --metric-color: var(--wm-teal);
    padding: 1.45rem;
    border: 1px solid var(--border-subtle);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--shadow-sm);
}
.metric-card.variance-card { --metric-color: var(--wm-blue); }
.metric-card.function-card { --metric-color: var(--wm-amber); }
.metric-card.diversity-card { --metric-color: #7654a5; }
.metric-heading { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 0.5rem; }
.metric-heading > span { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; color: #fff; background: var(--metric-color); font-size: 0.68rem; }
.metric-heading h3 { margin: 0; color: var(--wm-ink); font-size: 1.22rem; }
.metric-heading i { color: var(--metric-color); font-size: 0.62rem; font-style: normal; }
.metric-card p { min-height: 100px; margin: 1rem 0; color: var(--text-secondary); line-height: 1.78; }
.metric-card code { display: block; padding: 0.75rem; border-radius: 10px; color: var(--wm-ink); background: color-mix(in srgb, var(--metric-color) 10%, white); font-size: 0.78rem; }
.metric-card small { display: block; margin-top: 0.8rem; color: var(--text-secondary); line-height: 1.62; }

.not-proof {
    margin-top: 1.2rem;
    padding: 1.3rem 1.5rem;
    border: 1px solid #f0d49d;
    border-radius: 16px;
    background: var(--wm-amber-soft);
}
.not-proof span { color: #986211; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; }
.not-proof p { margin: 0.45rem 0 0; color: var(--text-secondary); line-height: 1.78; }

/* Style lab */
.style-lab {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
    gap: 1.2rem;
    padding: clamp(1.3rem, 3vw, 2rem);
    border: 1px solid #c8dfda;
    border-radius: 22px;
    background: linear-gradient(145deg, #f5fbf9, #edf5f7);
}
.lab-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.lab-title-row h3 { margin: 0.45rem 0 1rem; color: var(--wm-ink); font-size: 1.35rem; }
.sample-buttons { display: flex; gap: 0.4rem; }
.style-input-panel label { display: block; margin-bottom: 0.5rem; color: var(--wm-ink); font-size: 0.8rem; font-weight: 600; }
.style-input-panel textarea {
    width: 100%;
    resize: vertical;
    padding: 1rem;
    border: 1px solid #b7d4cf;
    border-radius: 12px;
    color: var(--wm-ink);
    background: rgba(255,255,255,.9);
    font: 0.92rem/1.85 'Noto Sans SC', sans-serif;
}
.style-input-panel textarea:focus { border-color: var(--wm-teal); outline: 3px solid rgba(18,139,126,.14); }
.privacy-note { margin: 0.6rem 0 0; color: var(--text-muted); font-size: 0.7rem; line-height: 1.55; }
.privacy-note code { color: var(--wm-teal); }

.metric-results {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.65rem;
}
.metric-results article {
    min-height: 120px;
    padding: 0.95rem;
    border: 1px solid #d3e3df;
    border-radius: 13px;
    background: rgba(255,255,255,.82);
}
.metric-results span,
.metric-results strong,
.metric-results small { display: block; }
.metric-results span { color: var(--text-muted); font-size: 0.68rem; }
.metric-results strong { margin-top: 0.38rem; color: var(--wm-ink); font-family: 'JetBrains Mono', monospace; font-size: 1.45rem; }
.metric-results small { margin-top: 0.48rem; color: var(--text-muted); font-size: 0.62rem; line-height: 1.45; }
.result-bar { overflow: hidden; height: 5px; margin-top: 0.75rem; border-radius: 99px; background: #e5efec; }
.result-bar i { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--wm-teal); transition: width .3s ease; }
.result-bar.amber i { background: var(--wm-amber); }
.result-bar.blue i { background: var(--wm-blue); }
.perplexity-result { grid-column: 1 / -1; min-height: auto !important; }
.perplexity-result strong { color: var(--wm-coral); font-size: 1rem; }
.lab-verdict { padding: 0.9rem 1.1rem; border-radius: 0 0 16px 16px; color: #31545a; background: #e2f1ed; font-size: 0.78rem; text-align: center; }

/* Limits */
.failure-map {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.9rem;
}
.failure-map article { padding: 1.3rem; border: 1px solid var(--border-subtle); border-radius: 16px; background: #fff; }
.failure-map span { display: inline-block; padding: 0.28rem 0.55rem; border-radius: 99px; color: #9b5a0a; background: var(--wm-amber-soft); font-size: 0.68rem; font-weight: 700; }
.failure-map h3 { margin: 0.75rem 0 0.45rem; color: var(--wm-ink); font-size: 1rem; }
.failure-map p { margin: 0; color: var(--text-secondary); font-size: 0.82rem; line-height: 1.68; }

.evidence-ladder {
    margin-top: 1.4rem;
    padding: 1.5rem;
    border-radius: 20px;
    color: #eafff8;
    background: var(--wm-deep);
}
.ladder-label { margin-bottom: 1rem; color: #7fe4c7; font-size: 0.72rem; font-weight: 700; letter-spacing: .08em; }
.evidence-ladder ol { display: grid; gap: 0.55rem; margin: 0; padding: 0; list-style: none; }
.evidence-ladder li { display: grid; grid-template-columns: 38px minmax(190px, .75fr) 1fr; gap: .8rem; align-items: center; padding: .7rem .8rem; border: 1px solid rgba(255,255,255,.08); border-radius: 11px; background: rgba(255,255,255,.04); }
.evidence-ladder li > span { color: #f2c66f; font-size: .68rem; }
.evidence-ladder strong { font-size: .86rem; }
.evidence-ladder small { color: rgba(234,255,248,.58); line-height: 1.45; }

/* Workflow and governance */
.workflow-list { display: grid; gap: 0.75rem; }
.workflow-list article { display: grid; grid-template-columns: 58px 1fr; gap: 1rem; padding: 1.15rem 1.25rem; border: 1px solid #d8e7e3; border-radius: 15px; background: #fff; }
.workflow-list article > span { display: grid; place-items: center; align-self: start; width: 46px; height: 46px; border-radius: 14px; color: #fff; background: var(--wm-teal); font-family: 'JetBrains Mono', monospace; font-size: .72rem; }
.workflow-list h3 { margin: 0 0 .35rem; color: var(--wm-ink); font-size: 1.05rem; }
.workflow-list p { margin: 0; color: var(--text-secondary); font-size: .86rem; line-height: 1.7; }
.decision-card { display: grid; grid-template-columns: 110px 1fr 60px 1fr; gap: 1rem; align-items: center; margin-top: 1.2rem; padding: 1.2rem; border-radius: 16px; background: #edf8f5; }
.decision-card > span { color: var(--wm-teal); font-size: .72rem; font-weight: 700; }
.decision-card p { margin: 0; color: var(--wm-ink); font-family: 'Noto Serif SC', serif; line-height: 1.7; }
.decision-card div { color: var(--wm-coral); font-size: .72rem; font-weight: 700; text-align: center; }

.governance-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.governance-grid article { padding: 1.3rem; border-top: 4px solid var(--wm-teal); border-radius: 14px; background: #f5faf9; }
.governance-grid span { color: var(--wm-teal); font-size: .7rem; font-weight: 700; letter-spacing: .12em; }
.governance-grid h3 { margin: .7rem 0 .45rem; color: var(--wm-ink); font-size: 1rem; }
.governance-grid p { margin: 0; color: var(--text-secondary); font-size: .82rem; line-height: 1.7; }
.closing-quote { max-width: 860px; margin: 2rem auto 0; padding: 1.3rem 1.5rem; border: 0; border-left: 4px solid var(--wm-blue); color: var(--wm-ink); background: var(--wm-blue-soft); font-family: 'Noto Serif SC', serif; font-size: 1.08rem; line-height: 1.85; }

/* References */
.reference-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }
.reference-list a { display: grid; grid-template-columns: 92px 1fr; gap: .25rem 1rem; padding: 1rem 1.1rem; border: 1px solid var(--border-subtle); border-radius: 14px; color: inherit; background: #fff; text-decoration: none; transition: .2s ease; }
.reference-list a:hover { border-color: #8fc9bd; box-shadow: 0 10px 26px rgba(18,139,126,.09); transform: translateY(-2px); }
.reference-list span { grid-row: 1 / 3; align-self: center; color: var(--wm-teal); font-size: .68rem; font-weight: 700; letter-spacing: .05em; }
.reference-list strong { color: var(--wm-ink); font-size: .88rem; line-height: 1.5; }
.reference-list small { color: var(--text-secondary); line-height: 1.5; }

@keyframes travel-signal {
    0% { left: 0; opacity: 0; }
    15% { opacity: 1; }
    85% { opacity: 1; }
    100% { left: calc(100% - 8px); opacity: 0; }
}

@keyframes token-in {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 980px) {
    .concept-grid,
    .failure-map { grid-template-columns: repeat(2, 1fr); }
    .concept-card:last-child { grid-column: 1 / -1; }
    .media-grid,
    .governance-grid { grid-template-columns: repeat(2, 1fr); }
    .token-process { grid-template-columns: repeat(2, 1fr); }
    .token-process article:nth-child(2)::after { display: none; }
    .watermark-lab,
    .style-lab { grid-template-columns: 1fr; }
    .decision-card { grid-template-columns: 90px 1fr; }
    .decision-card div { text-align: left; }
}

@media (max-width: 768px) {
    .watermark-hero { min-height: 520px; }
    .opening-grid { grid-template-columns: 1fr; }
    .origin-card { min-height: 235px; grid-template-columns: 1fr 70px 1fr; }
    .metric-grid,
    .reference-list { grid-template-columns: 1fr; }
    .metric-card p { min-height: auto; }
    .formula-card { grid-template-columns: 1fr; gap: 1rem; }
    .tradeoff-band { align-items: stretch; }
    .tradeoff-band div { flex: 1; }
    .failure-map { grid-template-columns: 1fr; }
    .evidence-ladder li { grid-template-columns: 30px 1fr; }
    .evidence-ladder small { grid-column: 2; }
    .reference-list a { grid-template-columns: 78px 1fr; }
}

@media (max-width: 560px) {
    .hero-proof { border-radius: 12px; }
    .hero-proof i { display: none; }
    .hero-proof b { flex-basis: 100%; margin: .25rem 0 0; }
    .concept-grid,
    .media-grid,
    .token-process,
    .governance-grid { grid-template-columns: 1fr; }
    .concept-card:last-child { grid-column: auto; }
    .token-process article::after { display: none !important; }
    .tradeoff-band { flex-direction: column; }
    .tradeoff-band i { transform: rotate(90deg); text-align: center; }
    .watermark-lab { padding: 1rem; }
    .refresh-button { margin-left: 0; }
    .token-stats { grid-template-columns: 1fr; }
    .signal-meter { grid-column: auto; }
    .lab-title-row { display: block; }
    .sample-buttons { margin-bottom: .8rem; }
    .metric-results { grid-template-columns: 1fr; }
    .perplexity-result { grid-column: auto; }
    .workflow-list article { grid-template-columns: 44px 1fr; padding: 1rem; }
    .workflow-list article > span { width: 38px; height: 38px; }
    .decision-card { grid-template-columns: 1fr; gap: .6rem; }
    .reference-list a { grid-template-columns: 1fr; }
    .reference-list span { grid-row: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .origin-path span,
    .token-stream span { animation: none; }
    .lab-controls button,
    .sample-buttons button,
    .reference-list a,
    .signal-meter i,
    .result-bar i { transition: none; }
}

@media print {
    .watermark-lab,
    .style-lab { break-inside: avoid; }
    .lab-controls,
    .sample-buttons { display: none; }
}