:root{color-scheme:light;--paper:#faf9f6;--surface:#fff;--ink:#202d29;--muted:#536158;--accent:#215c46;--accent-dark:#bcd0c7;--on-accent:#fff;--soft:#edf3ee;--line:#d7ded7;--footer:#f0f2ed;--focus:#164cc7;--underline:#91ac9a;--content:49rem;--alert-bg:#fdf2f2;--alert-border:#f8717144;--alert-ink:#991b1b}

/* High Contrast: Light Mode */
:root[data-contrast="high"]{--paper:#fff;--surface:#fff;--ink:#000;--muted:#111;--accent:#004d2c;--accent-dark:#86efac;--on-accent:#fff;--soft:#f0f0f0;--line:#000;--footer:#fff;--focus:#0000ee;--underline:#000;--alert-bg:#fff5f5;--alert-border:#991b1b;--alert-ink:#7f1d1d}
:root[data-contrast="high"] a{text-decoration:underline;text-decoration-thickness:2px}
:root[data-contrast="high"] .emergency-box{border:2px solid var(--alert-border)!important;border-inline-start:6px solid var(--alert-ink)!important}
:root[data-contrast="high"] .emergency-header h3,:root[data-contrast="high"] .emergency-steps strong{color:var(--alert-ink)}
:root[data-contrast="high"] .badge-alert{background:#7f1d1d!important;color:#fff!important;border:2px solid #7f1d1d!important;font-weight:800;letter-spacing:.02em}
:root[data-contrast="high"] .definition{border:2px solid var(--accent)!important;border-inline-start:6px solid var(--accent)!important}
:root[data-contrast="high"] .theme-panel,:root[data-contrast="high"] .topics a,:root[data-contrast="high"] .button,:root[data-contrast="high"] .pagination a,:root[data-contrast="high"] .pagination span{border-width:2px;border-color:#000}
:root[data-contrast="high"] .brand-dot{background:#000}

@media screen and (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){color-scheme:dark;--paper:#141a18;--surface:#1b2420;--ink:#e6ede9;--muted:#b0bfb6;--accent:var(--accent-dark);--on-accent:#142019;--soft:#22312a;--line:#43574c;--footer:#19221d;--focus:#94bfff;--underline:#718f7d;--alert-bg:#261818;--alert-border:#ef444455;--alert-ink:#fca5a5}
  :root[data-contrast="high"]:not([data-theme="light"]){--paper:#000;--surface:#050505;--ink:#fff;--muted:#f0f0f0;--accent:#4ade80;--on-accent:#000;--soft:#181818;--line:#fff;--footer:#000;--focus:#ffff00;--underline:#fff;--alert-bg:#2d0505;--alert-border:#ef4444;--alert-ink:#ffcccc}
  :root[data-contrast="high"]:not([data-theme="light"]) a{text-decoration:underline;text-decoration-thickness:2px}
  :root[data-contrast="high"]:not([data-theme="light"]) .emergency-box{border:2px solid var(--alert-border)!important;border-inline-start:6px solid var(--alert-ink)!important}
  :root[data-contrast="high"]:not([data-theme="light"]) .badge-alert{background:#ffcccc!important;color:#000!important;border:2px solid #ffcccc!important;font-weight:800;letter-spacing:.02em}
  :root[data-contrast="high"]:not([data-theme="light"]) .definition{border:2px solid var(--accent)!important;border-inline-start:6px solid var(--accent)!important}
  :root[data-contrast="high"]:not([data-theme="light"]) .theme-panel,:root[data-contrast="high"]:not([data-theme="light"]) .topics a,:root[data-contrast="high"]:not([data-theme="light"]) .button,:root[data-contrast="high"]:not([data-theme="light"]) .pagination a,:root[data-contrast="high"]:not([data-theme="light"]) .pagination span{border-width:2px;border-color:#fff}
  :root[data-contrast="high"]:not([data-theme="light"]) .brand-dot{background:#fff}
}
@media screen{
  :root[data-theme="dark"]{color-scheme:dark;--paper:#141a18;--surface:#1b2420;--ink:#e6ede9;--muted:#b0bfb6;--accent:var(--accent-dark);--on-accent:#142019;--soft:#22312a;--line:#43574c;--footer:#19221d;--focus:#94bfff;--underline:#718f7d;--alert-bg:#261818;--alert-border:#ef444455;--alert-ink:#fca5a5}
  :root[data-theme="dark"][data-contrast="high"]{--paper:#000;--surface:#050505;--ink:#fff;--muted:#f0f0f0;--accent:#4ade80;--on-accent:#000;--soft:#181818;--line:#fff;--footer:#000;--focus:#ffff00;--underline:#fff;--alert-bg:#2d0505;--alert-border:#ef4444;--alert-ink:#ffcccc}
  :root[data-theme="dark"][data-contrast="high"] a{text-decoration:underline;text-decoration-thickness:2px}
  :root[data-theme="dark"][data-contrast="high"] .emergency-box{border:2px solid var(--alert-border)!important;border-inline-start:6px solid var(--alert-ink)!important}
  :root[data-theme="dark"][data-contrast="high"] .badge-alert{background:#ffcccc!important;color:#000!important;border:2px solid #ffcccc!important;font-weight:800;letter-spacing:.02em}
  :root[data-theme="dark"][data-contrast="high"] .definition{border:2px solid var(--accent)!important;border-inline-start:6px solid var(--accent)!important}
  :root[data-theme="dark"][data-contrast="high"] .theme-panel,:root[data-theme="dark"][data-contrast="high"] .topics a,:root[data-theme="dark"][data-contrast="high"] .button,:root[data-theme="dark"][data-contrast="high"] .pagination a,:root[data-theme="dark"][data-contrast="high"] .pagination span{border-width:2px;border-color:#fff}
  :root[data-theme="dark"][data-contrast="high"] .brand-dot{background:#fff}
}

@media screen{
  body{min-block-size:100vh;min-block-size:100dvh;display:flex;flex-direction:column}
  body>main{flex:1 0 auto}
}
*{box-sizing:border-box}html{scroll-padding-block-start:1.5rem}body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:1.125rem;line-height:1.65;text-align:start;overflow-wrap:anywhere}
[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1,h2,h3{text-wrap:pretty}a{color:var(--accent);text-underline-offset:.2em}a:hover{text-decoration-thickness:.13em}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:5px}main:focus{outline:none}.wrap{inline-size:min(calc(100% - 2.5rem),var(--content));margin-inline:auto}.skip{position:absolute;inset-block-start:-10rem;inset-inline-start:1rem;background:var(--surface);padding:.75rem;z-index:5}.skip:focus{inset-block-start:1rem}
html:lang(ja) body{line-break:strict;word-break:normal}
html:lang(ja) .brand,html:lang(ja) .eyebrow,html:lang(ja) h1,html:lang(ja) h2,html:lang(ja) h3,html:lang(ja) .guide-title{letter-spacing:normal}
.site-header{border-block-end:1px solid var(--line)}.header-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1rem;padding-block:1.2rem}.brand{display:inline-flex;align-items:center;gap:.45rem;color:var(--ink);font-size:1.5rem;font-weight:850;letter-spacing:-.045em;text-decoration:none;min-block-size:2.75rem}.brand-dot{inline-size:.45rem;block-size:.45rem;border-radius:100%;background:var(--accent)}.header-row nav{display:flex;flex-wrap:wrap;gap:1.2rem}.header-row nav a{display:inline-flex;align-items:center;min-block-size:2.75rem;font-size:.85rem;color:var(--ink)}
.hero{padding-block:3.5rem 2rem}.eyebrow{color:var(--accent);font-size:.75rem;font-weight:750;text-transform:uppercase;letter-spacing:.1em;margin-block-end:1rem}h1{font-size:clamp(2rem,5.2vw,3.3rem);font-weight:750;line-height:1.13;letter-spacing:-.045em;max-inline-size:23ch}.intro{margin-block-start:1.25rem;color:var(--muted);max-inline-size:64ch}.hero .intro{font-size:1.125rem}.actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-block-start:1.6rem}.button{display:inline-flex;justify-content:center;align-items:center;min-block-size:2.9rem;padding:.65rem 1rem;background:var(--accent);border:1px solid var(--accent);border-radius:.25rem;color:var(--on-accent);text-decoration:none;font-size:.875rem;font-weight:650}.button:hover{filter:brightness(.93);text-decoration:underline}.button.secondary{background:transparent;color:var(--accent)}.hero-note{font-size:.8rem;color:var(--muted);margin-block-start:1.25rem}
.topics{display:flex;flex-wrap:wrap;gap:.55rem;padding-block:0 1.8rem;border-block-end:1px solid var(--line)}.topics a{display:inline-flex;align-items:center;min-block-size:2.75rem;border:1px solid var(--line);border-radius:.25rem;background:var(--surface);padding:.4rem .75rem;font-size:.8125rem;color:var(--ink);text-decoration:none}.topics a:hover{background:var(--soft);border-color:var(--accent);text-decoration:underline}.latest{padding-block-start:1.75rem}.section-row{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;flex-wrap:wrap}.section-row h2{font-size:1.125rem}.small{font-size:.75rem;color:var(--muted)}.guide-list{padding:0;margin:0;list-style:none}.guide-list>li+li{border-block-start:1px solid var(--line)}.guide{padding-block:1.8rem 2rem}.meta{display:flex;align-items:baseline;flex-wrap:wrap;gap:.25rem .6rem;font-size:.8rem;color:var(--muted);margin-block-end:.65rem}.meta a{font-weight:650}.guide-title{font-size:clamp(1.25rem,3.2vw,1.65rem);line-height:1.35;letter-spacing:-.025em}.guide-title a{color:var(--ink);text-decoration-color:var(--underline);text-decoration-thickness:1px}.guide-title a:hover{color:var(--accent)}.summary{margin-block-start:.8rem;color:var(--muted)}.archive-link{padding-block:0 2rem}.empty{padding-block:2rem;color:var(--muted)}
.site-footer{background:var(--footer);border-block-start:1px solid var(--line);padding-block:2rem;margin-block-start:2rem}.footer-promise{font-size:.875rem;max-inline-size:64ch}.footer-links,.languages{display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;margin-block:.8rem}.footer-links a,.languages a{display:inline-flex;align-items:center;min-block-size:2.75rem;color:var(--ink);font-size:.8rem}.fine{font-size:.75rem;color:var(--muted)}
.page-header{padding-block:3rem 2rem}.page-header h1{font-size:clamp(2rem,5vw,2.8rem)}.breadcrumb{display:flex;gap:.7rem;flex-wrap:wrap;margin-block:1.5rem;font-size:.8rem}.article-header .eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:.4rem .6rem;margin-block-end:1.25rem}.article-header h1{max-inline-size:none;font-size:clamp(2rem,4.8vw,2.9rem);line-height:1.18}.article-header .meta{display:flex;flex-direction:column;gap:.25rem;margin-block:1rem .6rem;font-size:.8125rem;color:var(--muted)}.article-header .meta time{color:var(--ink)}.disclosure{font-size:.8rem;color:var(--muted);max-inline-size:80ch}.badge-alert{display:inline-flex;align-items:center;padding:.15rem .5rem;border-radius:.25rem;background:var(--alert-bg);color:var(--alert-ink);border:1px solid var(--alert-border);font-weight:750;letter-spacing:.01em;text-transform:none}.definition{background:var(--soft);border-inline-start:4px solid var(--accent);border-radius:.25rem;padding:1.35rem 1.4rem;margin-block:2rem}.definition h2{font-size:1rem;margin-block-end:.6rem}.emergency-box{background:var(--alert-bg);border:1px solid var(--alert-border);border-inline-start:4px solid var(--alert-ink);border-radius:.25rem;padding:1.2rem 1.35rem;margin-block:1.25rem 2rem}.definition+.emergency-box{margin-block-start:-.75rem}.emergency-header{display:flex;align-items:center;gap:.6rem;margin-block-end:.55rem}.emergency-header h3{font-size:1.05rem;font-weight:750;color:var(--alert-ink);line-height:1.3}.emergency-icon{flex:none;stroke:var(--alert-ink)}.emergency-steps{margin:0;padding-inline-start:1.25rem}.emergency-steps li{font-size:.925rem;line-height:1.5;color:var(--ink)}.emergency-steps li+li{margin-block-start:.45rem}.emergency-steps strong{color:var(--alert-ink);font-weight:700}.prose-section{margin-block:2rem}.prose-section h2,.sources h2,.related h2,.correction h2{font-size:1.45rem;line-height:1.3;letter-spacing:-.025em;margin-block-end:1rem}.prose-section p+p{margin-block-start:1rem}.prose-section ul{padding-inline-start:1.4rem}.prose-section li+li{margin-block-start:.6rem}.source-note{font-size:.8rem;color:var(--muted);margin-block-start:.8rem!important}.sources{border-block-start:1px solid var(--line);padding-block-start:1.5rem;margin-block:2rem}.sources ol{padding-inline-start:1.25rem}.sources li{font-size:.875rem;margin-block:1rem}.source-publisher{display:block;color:var(--muted)}.sources li p{font-size:.8rem;color:var(--muted);margin-block-start:.3rem}.correction{background:var(--soft);padding:1.25rem}.correction h2{font-size:1.1rem;margin-block-end:.5rem}.correction p{font-size:.875rem}.related{margin-block:2rem}.related ul{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;list-style:none;padding:0}.related a{display:inline-flex;align-items:center;min-block-size:2.75rem}.article-actions{margin-block:1.5rem 3rem}.pagination{display:flex;flex-wrap:wrap;gap:.5rem;padding-block:1rem 2rem}.pagination a,.pagination span{display:grid;place-items:center;min-inline-size:2.75rem;min-block-size:2.75rem;padding:.4rem;border:1px solid var(--line)}.pagination [aria-current]{background:var(--accent);color:var(--on-accent)}.contact-box{border:1px solid var(--line);padding:1.5rem;margin-block:2rem}.contact-box p{font-size:.875rem;margin-block-start:.6rem}.ad-slot{min-block-size:180px;margin-block:2rem;padding-block:1rem;border-block-start:1px solid var(--line);text-align:center}.ad-slot>p{text-transform:uppercase;letter-spacing:.1em;font-size:.7rem;color:var(--muted);margin-block-end:.8rem}
.native-banner-slot,.article-banner-slot{background:var(--soft);border:1px solid var(--line);border-radius:.5rem;padding:1.5rem 1rem;margin-block:2.5rem 2rem;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.03);overflow:hidden}
.topics + .native-banner-slot{margin-block-start:1.75rem}
.archive-link + .article-banner-slot{margin-block-start:.5rem}
:root[data-theme="dark"] .native-banner-slot,:root[data-theme="dark"] .article-banner-slot{background:rgba(255,255,255,.03);box-shadow:0 1px 4px rgba(0,0,0,.25)}
@media screen and (prefers-color-scheme:dark){:root:not([data-theme="light"]) .native-banner-slot,:root:not([data-theme="light"]) .article-banner-slot{background:rgba(255,255,255,.03);box-shadow:0 1px 4px rgba(0,0,0,.25)}}
:root[data-contrast="high"] .native-banner-slot,:root[data-contrast="high"] .article-banner-slot{border:2px solid var(--line)!important;background:transparent!important}
.native-banner-slot>p,.article-banner-slot>p{display:flex;align-items:center;justify-content:center;gap:.75rem;text-transform:uppercase;letter-spacing:.12em;font-size:.6875rem;font-weight:700;color:var(--muted);margin-block:0 1.1rem}
.native-banner-slot>p::before,.native-banner-slot>p::after,.article-banner-slot>p::before,.article-banner-slot>p::after{content:"";inline-size:2.5rem;border-block-start:1px solid var(--line)}
.native-banner-slot>div{margin-inline:auto}
.banner-frame{display:flex;justify-content:center;align-items:center;inline-size:100%;min-block-size:50px;overflow:hidden}
.native-banner-slot iframe,.banner-frame iframe{margin-inline:auto!important;display:block!important;max-inline-size:100%!important;border-radius:.35rem}
@media(max-width:30rem){.wrap{inline-size:calc(100% - 2rem)}.hero{padding-block-start:2rem}.header-row{padding-block:.8rem}.header-row nav{gap:.8rem}.hero h1{font-size:2.2rem}.guide{padding-block:1.5rem}.definition{padding:1.1rem}.small{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media print{body{background:white;color:black;font-size:11pt}.wrap{inline-size:100%}.site-header nav,.site-header .theme-control,.actions,.topics,.ad-slot,.native-banner-slot,.article-banner-slot,.skip,.footer-links,.languages{display:none}.hero,.page-header{padding-block:1rem}.site-footer{background:white}.guide,.definition{break-inside:avoid}}

.article-prose>p{margin-block:1rem}.article-prose h2{font-size:1.5rem;line-height:1.3;letter-spacing:-.025em;margin-block:2.3rem 1rem}.article-prose h3{font-size:1.15rem;line-height:1.4;margin-block:1.6rem .8rem}.article-prose ul{padding-inline-start:1.4rem;margin-block:1.2rem}.article-prose li+li{margin-block-start:.8rem}.sources summary{cursor:pointer;font-size:.875rem;font-weight:650;color:var(--muted);padding-block:.4rem}.sources summary:focus-visible{outline:3px solid var(--focus);outline-offset:5px}.related ul{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}.related li{border-block-start:1px solid var(--line);padding-block-start:.7rem}.related a{font-weight:650}.related p{font-size:.9rem;color:var(--muted);line-height:1.5}@media(max-width:35rem){.related ul{grid-template-columns:1fr}.article-prose h2{font-size:1.35rem}}
.tools-meta{margin-block-start:1.15rem;padding-block-start:.95rem;border-block-start:1px solid var(--line);display:flex;flex-direction:column;gap:.6rem}
.tool-card{display:flex;flex-direction:column;gap:.3rem;background:rgba(0,0,0,.035);border:1px solid var(--line);border-radius:.5rem;padding:.65rem .85rem}
:root[data-theme="dark"] .tool-card{background:rgba(0,0,0,.22);border-color:rgba(255,255,255,.09)}
@media screen and (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tool-card{background:rgba(0,0,0,.22);border-color:rgba(255,255,255,.09)}}
:root[data-contrast="high"] .tool-card{background:transparent!important;border:2px solid var(--line)!important}
.tool-card-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.4rem}
.tool-label{font-weight:700;font-size:.875rem;color:var(--ink)}
.tool-pill{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .65rem;border-radius:2rem;font-size:.785rem;font-weight:650;text-decoration:none;color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);transition:all .15s ease}
.tool-pill:hover,.tool-pill:focus-visible{background:color-mix(in srgb,var(--accent) 22%,transparent);text-decoration:none}
:root[data-contrast="high"] .tool-pill{border:2px solid var(--accent)!important;font-weight:800;text-decoration:underline}
.tool-note{font-size:.8125rem;color:var(--muted);line-height:1.45}
.tool-meta-item{margin:0;font-size:.85rem;color:var(--muted);display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;line-height:1.4}
.tool-meta-item strong{color:var(--ink);font-weight:650}
.tool-meta-item a{font-weight:650;color:var(--accent)}


.header-brand-row{display:flex;align-items:center;gap:.75rem}
.header-tools{display:flex;align-items:center;gap:.25rem}
.a11y-btn{position:relative;display:grid;place-items:center;inline-size:2.5rem;block-size:2.5rem;padding:0;border:1px solid transparent;border-radius:50%;color:var(--muted);background:transparent;cursor:pointer}
.a11y-btn:hover{color:var(--ink);background:var(--soft)}
.a11y-btn[aria-pressed="true"]{color:var(--accent);background:var(--soft);border-color:var(--accent)}
.a11y-btn svg{display:block;flex:none}
.theme-control{position:relative;flex:none;color:var(--ink)}
.theme-toggle{position:relative;display:grid;place-items:center;inline-size:2.75rem;block-size:2.75rem;padding:0;border:0;border-radius:50%;color:var(--muted);background:transparent}
.theme-auto{position:absolute;inset-inline-end:1px;inset-block-end:1px;display:grid;place-items:center;min-inline-size:1.125rem;block-size:1.125rem;padding-inline:2px;border:2px solid var(--paper);border-radius:50%;background:var(--accent);color:var(--on-accent);font-size:.625rem;font-weight:800;line-height:1;pointer-events:none}
.theme-toggle:hover,.theme-toggle[aria-expanded="true"]{color:var(--ink);background:var(--soft)}
.theme-control svg{display:block;flex:none}
.theme-panel{position:absolute;inset-block-start:calc(100% + .5rem);inset-inline-end:0;z-index:10;inline-size:12.5rem;max-inline-size:calc(100vw - 2rem);padding:.4rem;border:1px solid var(--line);border-radius:.75rem;background:var(--surface);box-shadow:0 .5rem 1.5rem #0002}
.theme-option{display:flex;align-items:center;gap:.7rem;inline-size:100%;min-block-size:2.75rem;padding:.6rem .7rem;border:0;border-radius:.4rem;color:var(--ink);background:transparent;font-size:.875rem;text-align:start}
.theme-option:hover{background:var(--soft)}
.theme-option[aria-pressed="true"]{background:var(--soft);color:var(--accent);font-weight:650}
.theme-check{margin-inline-start:auto;visibility:hidden}
.theme-option[aria-pressed="true"] .theme-check{visibility:visible}
.theme-option:focus-visible{outline-offset:-3px}
@media(max-width:40rem){.header-brand-row{inline-size:100%;justify-content:space-between}}

/* Local sharing controls work as links even without JavaScript. */
.theme-auto svg { width: 12px; height: 12px; stroke-width: 2.2; }
.sharing { margin-block: 2.5rem; padding-block-start: 1.25rem; border-block-start: 1px solid var(--line); }
.share-label { margin: 0 0 .65rem; font-weight: 700; }
.share-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.share-button { display: inline-flex; gap: .45rem; align-items: center; justify-content: center; min-height: 44px; padding: .5rem .75rem; border: 1px solid var(--line); border-radius: .6rem; background: var(--paper); color: var(--ink); text-decoration: none; font: inherit; font-size: .85rem; cursor: pointer; }
.share-button:hover { color: var(--accent); border-color: currentColor; }
.share-button svg { flex-shrink: 0; }
.share-status { margin: .5rem 0 0; font-size: .9rem; }
.share-status:empty { display: none; }
.share-fallback { display: block; margin-block-start: .75rem; }
.share-fallback input { display: block; width: 100%; margin-block-start: .4rem; padding: .75rem; border: 1px solid var(--line); border-radius: .4rem; color: var(--ink); background: var(--paper); font: inherit; }
@media print { .sharing { display: none; } }

/* Interactive Prompt & AI Response Cards */
.interaction-card {
  margin-block: 1.5rem 1.75rem;
  border-radius: 0.5rem;
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  overflow: hidden;
}
.prompt-card {
  border-inline-start: 4px solid var(--accent);
}
.response-card {
  border-inline-start: 4px solid #2563eb;
  background: color-mix(in srgb, var(--surface) 96%, #2563eb 4%);
}
.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  padding: 0.6rem 0.95rem;
  background: var(--soft);
  border-block-end: 1px solid var(--line);
}
.response-card .card-header {
  background: color-mix(in srgb, var(--soft) 94%, #2563eb 6%);
}
.card-title-group {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem 0.65rem;
}
.card-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.725rem;
}
.prompt-badge {
  color: var(--accent);
}
.response-badge {
  color: #2563eb;
}
.card-icon {
  flex: none;
}
.model-badge {
  display: inline-flex;
  align-items: center;
  font-size: 0.725rem;
  font-weight: 550;
  color: var(--muted);
  background: rgba(0, 0, 0, 0.045);
  border: 1px solid var(--line);
  border-radius: 1rem;
  padding: 0.12rem 0.55rem;
  line-height: 1.4;
}
.copy-card-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.3rem 0.65rem;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 0.35rem;
  background: var(--paper);
  color: var(--ink);
  font-size: 0.775rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s ease;
}
.copy-card-btn:hover,
.copy-card-btn:focus-visible {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--soft);
}
.copy-card-btn.copied {
  background: var(--accent);
  color: var(--on-accent);
  border-color: var(--accent);
}
.copy-icon {
  flex: none;
}
.card-body {
  padding: 0.95rem 1.15rem;
}
.card-code {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--ink);
}
.response-text {
  font-size: 0.925rem;
  line-height: 1.65;
  color: var(--ink);
}

/* Dark mode overrides */
:root[data-theme="dark"] .interaction-card {
  background: var(--surface);
}
:root[data-theme="dark"] .response-card {
  background: color-mix(in srgb, var(--surface) 93%, #3b82f6 7%);
  border-inline-start-color: #60a5fa;
}
:root[data-theme="dark"] .response-badge {
  color: #60a5fa;
}
:root[data-theme="dark"] .model-badge {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
}
@media screen and (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .response-card {
    background: color-mix(in srgb, var(--surface) 93%, #3b82f6 7%);
    border-inline-start-color: #60a5fa;
  }
  :root:not([data-theme="light"]) .response-badge {
    color: #60a5fa;
  }
  :root:not([data-theme="light"]) .model-badge {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.12);
  }
}

/* High contrast mode overrides */
:root[data-contrast="high"] .interaction-card {
  border: 2px solid var(--line)!important;
}
:root[data-contrast="high"] .copy-card-btn {
  border: 2px solid var(--line)!important;
  font-weight: 700;
}
:root[data-contrast="high"] .model-badge {
  border: 2px solid var(--line)!important;
  font-weight: 700;
}

