
body{color:var(--text);font-family: Pretendard, "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", sans-serif;letter-spacing:0;line-height:1.5;}
.cpp-ch11-ch11-1-shell{padding:20px;}
.cpp-ch11-ch11-1-badge{display:inline-flex;margin-bottom:10px;border:1px solid var(--line);border-radius:7px;background:var(--surface);padding:3px 8px;color:var(--track-strong);font-size:13px;font-weight:900;}
.cpp-ch11-ch11-1-title{margin:0;font-size:25px;line-height:1.25;letter-spacing:0;}
.cpp-ch11-ch11-1-lead{margin:8px 0 16px;color:var(--muted);font-size:14px;}
.cpp-ch11-ch11-1-blocks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;border:1px solid var(--line);border-radius:8px;background:var(--paper);}
.cpp-ch11-ch11-1-block{min-width:0;padding:10px 11px;border-left:1px solid var(--line);}
.cpp-ch11-ch11-1-block:first-child{border-left:0;}
.cpp-ch11-ch11-1-block b{display:block;margin-bottom:4px;color:var(--track-strong);font-size:13px;line-height:1.25;}
.cpp-ch11-ch11-1-block span{display:block;color:var(--muted);font-size:13px;line-height:1.4;}
.cpp-ch11-ch11-1-table{width:100%;margin-top:12px;border-collapse:separate;border-spacing:0;overflow:hidden;border:1px solid var(--line);border-radius:8px;table-layout:fixed;}
.cpp-ch11-ch11-1-table th,.cpp-ch11-ch11-1-table td{padding:9px 11px;border-left:1px solid var(--line);border-top:1px solid var(--line);text-align:left;vertical-align:top;font-size:13px;line-height:1.45;}
.cpp-ch11-ch11-1-table th:first-child,.cpp-ch11-ch11-1-table td:first-child{border-left:0;}
.cpp-ch11-ch11-1-table thead th{border-top:0;background:var(--surface);color:var(--text);font-weight:900;}
.cpp-ch11-ch11-1-table tbody td:first-child{color:var(--track-strong);font-weight:900;}
.cpp-ch11-ch11-1-table tbody td:not(:first-child){color:var(--muted);}
.cpp-ch11-ch11-1-note{margin-top:12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:10px 12px;color:var(--muted);font-size:13px;}
.cpp-ch11-ch11-1-note b{color:var(--track-strong);}
@media(max-width:560px){
  .cpp-ch11-ch11-1-shell{padding:14px 16px;}
  .cpp-ch11-ch11-1-title{font-size:21px;}
  .cpp-ch11-ch11-1-lead{font-size:13px;}
  .cpp-ch11-ch11-1-blocks{grid-template-columns:repeat(2,minmax(0,1fr));}
  .cpp-ch11-ch11-1-block{border-left:1px solid var(--line);border-top:1px solid var(--line);padding:9px 10px;}
  .cpp-ch11-ch11-1-block:nth-child(-n+2){border-top:0;}
  .cpp-ch11-ch11-1-block:nth-child(2n+1){border-left:0;}
  .cpp-ch11-ch11-1-table th,.cpp-ch11-ch11-1-table td{padding:8px 7px;font-size:13px;line-height:1.4;}
  .cpp-ch11-ch11-1-table th:first-child,.cpp-ch11-ch11-1-table td:first-child{width:24%;}
}
@media(max-width:360px){
  .cpp-ch11-ch11-1-shell{padding:12px;}
  .cpp-ch11-ch11-1-title{font-size:20px;}
  .cpp-ch11-ch11-1-table th,.cpp-ch11-ch11-1-table td{padding:7px 6px;}
}
    /* cpp-ch11-gold-local-finish */
:root {
  --track-line: #b9d7ef;
  --cpp: var(--track);
  --cpp-strong: var(--track-strong);
  --cpp-tint: var(--track-tint);
  --accent-strong: var(--track-strong);
  --accent-tint: var(--track-tint);
  --line-tint: #dbe8f4;
  --ok: var(--track-strong);
  --warn: var(--track-strong);
  --danger: var(--track-strong);
  --ok-tint: var(--track-tint);
  --warn-tint: var(--track-tint);
  --danger-tint: var(--track-tint);
}
html[data-diagram-theme="dark"] {
  --track-line: rgba(122, 184, 232, 0.34);
  --cpp: var(--track);
  --cpp-strong: var(--track-strong);
  --cpp-tint: var(--track-tint);
  --accent-strong: var(--track-strong);
  --accent-tint: var(--track-tint);
  --line-tint: rgba(122, 184, 232, 0.20);
  --ok: var(--track-strong);
  --warn: var(--track-strong);
  --danger: var(--track-strong);
  --ok-tint: var(--track-tint);
  --warn-tint: var(--track-tint);
  --danger-tint: var(--track-tint);
}
html[data-diagram-theme="dark"],
html[data-diagram-theme="dark"] body { background: transparent; color: var(--text); }
.diagram,
[class*="figure"],
[class*="root"] {
  border-color: color-mix(in srgb, var(--track) 30%, var(--line));
  border-radius:8px;
  background: var(--paper);
  color: var(--text);
  box-shadow: none;
}
.diagram :is(h1, h2, h3, strong, b) { color: var(--text); }
.diagram :is(p, span, li, td, th, div) { border-color: var(--line); }
.diagram :is([class*="shell"], [class*="frame"], [class*="matrix"], [class*="table"], [class*="blocks"], [class*="grid"], [class*="layout"], [class*="compare"], [class*="flow"], [class*="wrap"], [class*="panel"], [class*="board"]) {
  border-color: color-mix(in srgb, var(--track) 24%, var(--line));
  background: var(--paper);
  box-shadow: none;
}
.diagram :is([class*="card"], [class*="node"], [class*="block"], [class*="cell"], [class*="slice"], [class*="row"], [class*="mode"], [class*="side"], [class*="stack"], [class*="box"], [class*="item"], [class*="section"], [class*="case"]) {
  border-color: color-mix(in srgb, var(--track) 22%, var(--line));
  background: color-mix(in srgb, var(--paper) 88%, var(--track-tint));
  color: var(--text);
  box-shadow: none;
}
.diagram :is([class*="kicker"], [class*="badge"], [class*="tag"], [class*="chip"], [class*="label"], [class*="keyword"], [class*="step"], [class*="num"]) {
  width: fit-content;
  border: 1px solid color-mix(in srgb, var(--track) 35%, var(--line));
  border-radius:6px;
  background: var(--track-tint);
  color: var(--track-strong);
  box-shadow: none;
}
.diagram :is([class*="note"], [class*="hint"], [class*="takeaway"], [class*="summary"], [class*="callout"], [class*="rule"], [class*="tradeoff"]) {
  border-color: color-mix(in srgb, var(--track) 30%, var(--line));
  background: var(--surface-strong);
  color: var(--text);
  box-shadow: none;
}
.diagram :is([class*="note"], [class*="hint"], [class*="takeaway"], [class*="summary"], [class*="callout"], [class*="rule"], [class*="tradeoff"]) :is(strong, b) { color: var(--track-strong); }
.diagram :is([class*="arrow"], [class*="connector"]) {
  border-color: color-mix(in srgb, var(--track) 32%, var(--line));
  background: var(--track-tint);
  color: var(--track-strong);
  box-shadow: none;
}
.diagram :is([class*="ok"], [class*="warn"], [class*="danger"], [class*="green"], [class*="amber"], [class*="red"], [class*="blue"], [class*="em"]) { color: var(--track-strong); }
.diagram code,
.diagram pre,
.diagram kbd {
  color: var(--text);
  background: color-mix(in srgb, var(--paper) 86%, var(--track-tint));
  border-color: var(--line-tint);
}
.diagram table,
.diagram thead,
.diagram tbody,
.diagram tr,
.diagram th,
.diagram td { border-color: var(--line); }
.diagram th,
.diagram [role="columnheader"],
.diagram [class*="head"] { background: var(--surface); color: var(--text); }
html[data-diagram-theme="dark"] .diagram :is([class*="card"], [class*="node"], [class*="block"], [class*="cell"], [class*="slice"], [class*="row"], [class*="mode"], [class*="side"], [class*="stack"], [class*="box"], [class*="item"], [class*="shell"], [class*="frame"], [class*="matrix"], [class*="table"], [class*="blocks"], [class*="grid"], [class*="layout"], [class*="compare"], [class*="flow"], [class*="wrap"], [class*="figure"], [class*="root"], [class*="panel"], [class*="board"], [class*="case"]) { color: var(--text); }
@media (max-width: 760px) {
  .diagram :is([class*="card"], [class*="node"], [class*="block"], [class*="cell"], [class*="slice"], [class*="row"], [class*="mode"], [class*="box"], [class*="item"]) { border-radius:8px; }
}
/* /cpp-ch11-gold-local-finish */
/* cpp-ch11-mobile-table-polish */
@media (max-width: 560px) {
  .cpp-ch11-ch11-1-table,
  .cpp-ch11-ch11-2-table,
  .cpp-ch11-ch11-3-table {
    display: block;
    overflow: hidden;
    table-layout: auto;
  }
  .cpp-ch11-ch11-1-table thead,
  .cpp-ch11-ch11-2-table thead,
  .cpp-ch11-ch11-3-table thead {
    display: none;
  }
  .cpp-ch11-ch11-1-table tbody,
  .cpp-ch11-ch11-1-table tr,
  .cpp-ch11-ch11-1-table td,
  .cpp-ch11-ch11-2-table tbody,
  .cpp-ch11-ch11-2-table tr,
  .cpp-ch11-ch11-2-table td,
  .cpp-ch11-ch11-3-table tbody,
  .cpp-ch11-ch11-3-table tr,
  .cpp-ch11-ch11-3-table td {
    display: block;
    width: 100% !important;
  }
  .cpp-ch11-ch11-1-table tr,
  .cpp-ch11-ch11-2-table tr,
  .cpp-ch11-ch11-3-table tr {
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--paper) 90%, var(--track-tint));
  }
  .cpp-ch11-ch11-1-table tr:first-child,
  .cpp-ch11-ch11-2-table tr:first-child,
  .cpp-ch11-ch11-3-table tr:first-child {
    border-top: 0;
  }
  .cpp-ch11-ch11-1-table td,
  .cpp-ch11-ch11-2-table td,
  .cpp-ch11-ch11-3-table td {
    min-height: 0;
    padding: 7px 10px 7px 86px;
    border-left: 0 !important;
    border-top: 1px solid var(--line);
    position: relative;
    word-break: keep-all;
    overflow-wrap: anywhere;
  }
  .cpp-ch11-ch11-1-table td:first-child,
  .cpp-ch11-ch11-2-table td:first-child,
  .cpp-ch11-ch11-3-table td:first-child {
    border-top: 0;
    color: var(--track-strong);
  }
  .cpp-ch11-ch11-1-table td::before,
  .cpp-ch11-ch11-2-table td::before,
  .cpp-ch11-ch11-3-table td::before {
    position: absolute;
    left: 10px;
    top: 7px;
    width: 64px;
    color: var(--track-strong);
    font-size:12px;
    font-weight: 850;
  }
  .cpp-ch11-ch11-1-table td:nth-child(1)::before,
  .cpp-ch11-ch11-2-table td:nth-child(1)::before,
  .cpp-ch11-ch11-3-table td:nth-child(1)::before { content: "항목"; }
  .cpp-ch11-ch11-1-table td:nth-child(2)::before,
  .cpp-ch11-ch11-2-table td:nth-child(2)::before,
  .cpp-ch11-ch11-3-table td:nth-child(2)::before { content: "기준"; }
  .cpp-ch11-ch11-1-table td:nth-child(3)::before,
  .cpp-ch11-ch11-2-table td:nth-child(3)::before,
  .cpp-ch11-ch11-3-table td:nth-child(3)::before { content: "결론"; }
}
/* /cpp-ch11-mobile-table-polish */
