#konatus-flow { margin-top:5rem; border:1px solid #506362; border-top:4px solid #c9af74; padding:clamp(1.25rem,4vw,3rem); background:linear-gradient(145deg,#172b2b,#101b20 70%); scroll-margin-top:100px; }
.flow-intro { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); align-items:center; gap:2.5rem; margin-bottom:2.5rem; }
#konatus-flow .flow-kicker { font:600 11px/1.6 system-ui,sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#dac48f; }
#konatus-flow h2 { font-size:clamp(3.5rem,6vw,6.8rem); line-height:.9; letter-spacing:-.035em; margin:1.2rem 0 1.5rem; }
#konatus-flow h2 em { color:#d9bd7f; font-weight:400; }
#konatus-flow .flow-deck { font-size:clamp(1.4rem,2.5vw,1.9rem); line-height:1.25; }
.flow-photo { margin:0; min-width:0; }
.flow-photo img { width:100%; height:auto; display:block; border:1px solid #415958; }
#konatus-flow figcaption { margin-top:.6rem; color:#afbfbc; font:11px/1.6 system-ui,sans-serif; }
.flow-pairing { margin:2rem 0; padding:1.4rem; border-left:2px solid #bead80; background:rgba(203,183,131,.05); }
#konatus-flow .flow-pairing h3 { margin-top:0; }
.flow-method { margin:2rem 0; border-top:1px solid #4b6160; border-bottom:1px solid #4b6160; padding:1rem 0; }
.flow-method summary { cursor:pointer; padding:.5rem 0; min-height:44px; color:#dfca97; }
#flow-source { margin-top:2rem; padding-top:1rem; border-top:1px solid #4b6160; scroll-margin-top:100px; }
#konatus-flow .tv-download,#konatus-flow .tv-copy { min-height:44px; }
#konatus-flow a:focus-visible,#konatus-flow button:focus-visible,#konatus-flow summary:focus-visible { outline:2px solid #b7e6dc; outline-offset:4px; }
@media(max-width:760px) { .flow-intro { grid-template-columns:minmax(0,1fr); gap:1.3rem; } #konatus-flow { margin-top:3rem; } }
.flow-timeframes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem; margin:2.5rem 0; }
.flow-timeframes article { border-top:1px solid #8c9c91; padding:1.2rem 0; }
.flow-timeframes span { font:600 12px/1.6 system-ui,sans-serif; letter-spacing:.08em; color:#d9bd7f; }
.flow-color-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; padding:1px; background:#405252; margin:1.8rem 0; }
.flow-color { display:flex; align-items:center; gap:1.3rem; padding:1.25rem; background:#111f23; min-width:0; --candle:#939DAA; }
.flow-color:last-child { grid-column:1 / -1; }
.flow-color-strong-up { --candle:#21CE91; }.flow-color-weak-up { --candle:#689C91; }.flow-color-strong-down { --candle:#F05F6D; }.flow-color-weak-down { --candle:#AE858D; }.flow-color-conflict { --candle:#E9B85D; }.flow-color-pause { --candle:#AE91E8; }
.flow-candle { position:relative; flex:0 0 15px; height:28px; background:var(--candle); margin:8px 4px; }
.flow-candle::before { content:""; position:absolute; width:2px; top:-8px; bottom:-8px; left:6.5px; background:var(--candle); }
#konatus-flow .flow-color h4 { margin:0 0 .35rem; color:#ede9df; font:600 15px/1.4 system-ui,sans-serif; }
#konatus-flow .flow-color p { margin:0; font:13px/1.5 system-ui,sans-serif; color:#bdc9c7; }
.flow-filter-list { padding-left:1.5rem; }.flow-filter-list li { padding:.5rem 0; }
.flow-preset-table { overflow-x:auto; margin:2rem 0; }
.flow-preset-table table { width:100%; border-collapse:collapse; font:14px/1.6 system-ui,sans-serif; }
.flow-preset-table caption { text-align:left; color:#dec58f; padding-bottom:1rem; font-weight:600; }
.flow-preset-table th,.flow-preset-table td { padding:.8rem .5rem; text-align:left; border-bottom:1px solid #465b59; color:#d5dfdb; }
.flow-preset-table thead th { color:#dec58f; }.flow-preset-table tbody th { font-weight:400; }
@media(max-width:760px) { .flow-timeframes { grid-template-columns:minmax(0,1fr); gap:.5rem; } }
@media(max-width:480px) { .flow-color-legend { grid-template-columns:minmax(0,1fr); } .flow-preset-table table { font-size:12px; } }