/* dgk-diagram-style — 生成物。⛔直接編集しない（css-architecture.md §4-0） */
:root{--dgk-brand:#1eb9ee}
.dgk{--brand:var(--dgk-brand,#1eb9ee);--ink:#0e2740;--gold:#c8912f;--paper:#f6f3ea;--muted:#6b7686;
 --line:#e5e2d8;container-type:inline-size;margin:1.8em 0;font-family:inherit}
.dgk *{box-sizing:border-box}

.dgk ul,.dgk ol{list-style:none !important;margin:0 !important;padding:0 !important}

.dgk .dgk__lv2{margin-top:16px !important}

.dgk li{list-style:none !important;margin:0 !important;text-indent:0 !important;
 background-image:none !important}
.dgk li::marker{content:"" !important}
.dgk li::before{content:none !important}
.dgk dl,.dgk dt,.dgk dd{margin:0}
.dgk__card{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden;
 box-shadow:0 2px 16px rgba(14,39,64,.06)}

.dgk__hd{display:block;padding:14px 18px 14px 16px;border-bottom:1px solid var(--line);
 border-left:5px solid var(--brand);background:#fbfcfe}
.dgk__ttl{font-size:1.05rem;font-weight:800;color:var(--ink);line-height:1.5;margin:0}
.dgk__body{padding:20px 18px}
.dgk__cap{padding:10px 18px 14px;border-top:1px solid var(--line);color:var(--muted);
 font-size:.82rem;line-height:1.7;margin:0}

.dgk__flow{list-style:none;margin:0;padding:0;display:grid;gap:24px}
.dgk__q{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px 14px;
 font-weight:800;color:var(--ink);font-size:.95rem}
.dgk__step{position:relative;border:1px solid var(--brand);border-radius:10px;padding:12px 14px;
 background:#f4fafd}
.dgk__step b{display:block;font-size:.95rem;font-weight:800;color:var(--ink)}
.dgk__step small{display:block;font-size:.82rem;color:var(--muted);margin-top:4px;line-height:1.7}
.dgk__step em{display:inline-block;font-style:normal;font-size:.75rem;font-weight:800;color:#fff;
 background:var(--brand);border-radius:999px;padding:2px 10px;margin-bottom:6px}

.dgk__step:not(:last-child)::after{content:"";position:absolute;left:50%;bottom:-15px;width:10px;height:10px;
 transform:translateX(-50%) rotate(45deg);border-right:2px solid var(--brand);
 border-bottom:2px solid var(--brand)}
.dgk__foot{margin-top:14px;background:#fdf6e8;border:1px solid var(--gold);border-radius:10px;
 padding:10px 14px;font-size:.88rem;color:#6d4f14;line-height:1.7}

.dgk__cmp{display:grid;grid-template-columns:1fr;gap:14px;align-items:stretch}
.dgk__col{border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.dgk__colhd{background:var(--brand);color:#fff;font-weight:800;font-size:.92rem;padding:10px 14px}
.dgk__col--b .dgk__colhd{background:var(--ink)}
.dgk__col--c .dgk__colhd{background:var(--gold)}
.dgk__row{padding:10px 14px;border-top:1px solid var(--line)}
.dgk__row:first-of-type{border-top:0}
.dgk__row dt{font-size:.75rem;font-weight:800;color:var(--muted);letter-spacing:.04em;margin:0}
.dgk__row dd{font-size:.9rem;color:var(--ink);margin:4px 0 0;line-height:1.8}

.dgk__tree{list-style:none;margin:0;padding:0}
.dgk__top{background:var(--brand);color:#fff;border-radius:10px;padding:11px 14px;text-align:center;
 font-weight:800;font-size:.95rem}
.dgk__lv2{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:12px}
.dgk__node{position:relative;border:1px solid var(--line);border-radius:10px;padding:11px 14px;
 background:var(--paper)}
.dgk__node b{display:block;font-size:.92rem;font-weight:800;color:var(--ink)}
.dgk__node small{display:block;font-size:.82rem;color:var(--muted);margin-top:3px;line-height:1.7}

.dgk__t{display:grid;grid-template-columns:1fr;gap:0;border:1px solid var(--ink);border-radius:10px;
 overflow:hidden}
.dgk__side{padding:12px 14px}
.dgk__side+.dgk__side{border-top:1px solid var(--ink)}
.dgk__side h4{margin:0 0 6px;font-size:.78rem;font-weight:800;letter-spacing:.06em;color:var(--muted)}
.dgk__side p{margin:0;font-size:.92rem;color:var(--ink);line-height:1.8}

@container (min-width: 34rem){

  .dgk__cmp{grid-template-columns:repeat(auto-fit,minmax(13rem,1fr))}
  .dgk__lv2{grid-template-columns:repeat(auto-fit,minmax(11rem,1fr))}
  .dgk__t{grid-template-columns:1fr 1fr}
  .dgk__side+.dgk__side{border-top:0;border-left:1px solid var(--ink)}
}

.dgk-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.dgk-sm{font-size:.85em;white-space:nowrap}
.dgk-mk{background:linear-gradient(transparent 60%,#fff462 60%);font-weight:bold}

