/* 말꼬리 연구소 도구 스타일 (CSP 대응: 동적 주입 → 외부 파일) */

/* ===== collections ===== */

.cl-list{display:flex;flex-direction:column;gap:10px}
.cl-card{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--hair);border-radius:var(--r2);
  background:var(--surface);cursor:pointer;transition:transform .15s var(--ease),border-color .15s,box-shadow .15s}
.cl-card:hover{transform:translateY(-2px);border-color:var(--hair2);box-shadow:var(--sh)}
.cl-card:active{transform:translateY(0)}
.cl-ico{width:42px;height:42px;border-radius:var(--r1);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.cl-ico svg{width:var(--ico-md);height:var(--ico-md)}
.cl-ico.win{background:var(--good-bg);color:var(--good)}
.cl-ico.danger{background:var(--danger-bg);color:var(--danger)}
.cl-ico.route{background:var(--warm-bg);color:var(--warm-ink)}
.cl-ico.gold{background:var(--soft);color:var(--ink2)}
.cl-body{flex:1;min-width:0}
.cl-name{font-size:var(--fs-md);font-weight:700;color:var(--ink);letter-spacing:-.02em}
.cl-desc{font-size:var(--fs-base);color:var(--ink3);margin-top:2px;line-height:1.4}
.cl-count{font-size:var(--fs-base);color:var(--ink3);white-space:nowrap;display:flex;align-items:center;gap:4px}
.cl-count b{color:var(--ink);font-weight:600}
.cl-count svg{width:var(--ico-sm);height:var(--ico-sm);color:var(--ink4)}
.cl-detail-head{margin-bottom:14px;position:relative}
.cl-save{position:absolute;top:0;right:0;white-space:nowrap;font-size:var(--fs-cap);font-weight:700;color:var(--ink3);
  border:1px solid var(--hair2);background:transparent;border-radius:999px;padding:var(--sp-1) var(--sp-3);
  cursor:pointer;font-family:inherit;transition:color .12s,border-color .12s}
.cl-save:hover{color:var(--ink);border-color:var(--ink3)}
.cl-save:disabled{opacity:.6}
@media (max-width:600px){.cl-save{min-height:44px}}
.cl-back2{display:inline-flex;align-items:center;gap:5px;font-size:var(--fs-base);color:var(--ink2);background:transparent;
  border:none;cursor:pointer;padding:0;margin-bottom:12px;font-family:inherit}
.cl-back2 svg{width:var(--ico-xs);height:var(--ico-xs)}
.cl-d-name{font-size:var(--fs-lg);font-weight:700;letter-spacing:-.02em}
.cl-d-desc{font-size:var(--fs-base);color:var(--ink2);margin-top:5px;line-height:1.6}
.cl-d-count{font-size:var(--fs-base);color:var(--ink3);margin-top:8px}
.cl-groups{border:1px solid var(--hair);border-radius:var(--r2);overflow:hidden;background:var(--surface)}
.cl-grow{display:flex;align-items:center;justify-content:space-between;padding:11px 15px;border-bottom:1px solid var(--hair);
  cursor:pointer;transition:background .15s}
.cl-grow:last-child{border-bottom:none}
.cl-grow:hover{background:var(--raise)}
.cl-gw{font-size:var(--fs-base);color:var(--ink)}.cl-gw .more{font-size:var(--fs-sm);color:var(--ink4);margin-left:6px}
.cl-gflow{font-size:var(--fs-sm);color:var(--ink2);display:flex;align-items:center;gap:5px}
.cl-gflow svg{width:var(--ico-xs);height:var(--ico-xs);color:var(--ink4)}
.cl-more{width:100%;padding:12px;margin-top:12px;border:1px solid var(--hair2);border-radius:var(--r1);background:var(--surface);
  color:var(--ink2);font-size:var(--fs-base);font-weight:600;font-family:inherit;cursor:pointer;transition:border-color .15s}
.cl-more:hover{border-color:var(--ink3);color:var(--ink)}
.cl-loading{padding:36px 0;text-align:center;color:var(--ink4);font-size:var(--fs-base)}
.cl-note{font-size:var(--fs-sm);color:var(--ink4);margin:14px 2px 0;line-height:1.6}
.cl-chars{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 4px}
.cl-charchip{font-size:var(--fs-base);padding:5px 12px;border-radius:999px;background:var(--danger-bg);color:var(--danger);
  cursor:pointer;transition:transform .12s}
.cl-charchip:hover{transform:translateY(-2px)}
/* 실전 주력 단어장(음절별) */
.cl-dbgroups{display:flex;flex-direction:column;gap:var(--sp-3)}
.cl-dbg{border:1px solid var(--hair);border-radius:var(--r1);overflow:hidden}
.cl-dbg-h{display:flex;align-items:center;gap:var(--sp-2);width:100%;min-height:44px;padding:var(--sp-2) var(--sp-3);
  border:none;background:var(--soft);cursor:pointer;font-family:inherit;text-align:left}
.cl-dbg-h:hover{background:var(--raise)}
.cl-dbg-c{font-size:var(--fs-md);font-weight:800;color:var(--good)}
.cl-dbg-n{margin-left:auto;font-size:var(--fs-cap);font-weight:700;color:var(--ink-4);font-family:var(--mono)}
.cl-dbg-b{display:flex;flex-wrap:wrap;gap:var(--sp-1);padding:var(--sp-2) var(--sp-3)}
.cl-dbw{font-size:var(--fs-sm);font-weight:600;color:var(--ink-2);background:var(--good-bg);border-radius:6px;
  padding:3px 8px;white-space:nowrap}


/* ===== dict ===== */

.dict-search-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.dict-search{flex:1;display:flex;align-items:center;gap:12px;border:1px solid var(--hair2);border-radius:999px;
  padding:13px 18px;background:var(--surface);transition:border-color .18s,box-shadow .18s,background .3s}
.dict-search:focus-within{border-color:var(--ink3);box-shadow:0 0 0 4px var(--focus)}
.dict-search svg{width:var(--ico-md);height:var(--ico-md);color:var(--ink4);flex-shrink:0}
.dict-search input{border:none;outline:none;background:transparent;color:var(--ink);font-size:var(--fs-lg);
  font-family:inherit;width:100%;letter-spacing:-.01em}
.dict-search input::placeholder{color:var(--ink4)}
.dict-chip{font-size:var(--fs-sm);color:var(--ink2);padding:8px 13px;border:1px solid var(--hair);border-radius:999px;
  background:var(--surface);white-space:nowrap}
.dict-crumbs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:14px;min-height:20px}
.dict-crumb{font-size:var(--fs-base);color:var(--ink3);cursor:pointer;padding:3px 9px;border-radius:999px;
  background:var(--soft);transition:color .15s}
.dict-crumb:hover{color:var(--ink)}
.dict-crumb.cur{color:var(--ink);font-weight:600;background:transparent;cursor:default}
.dict-sep{color:var(--ink4);font-size:var(--fs-cap)}
.dict-hint{text-align:center;color:var(--ink4);font-size:var(--fs-base);padding:56px 0;line-height:1.7}
.dict-hint .big{font-size:var(--fs-md);color:var(--ink3)}
.dict-samples{display:flex;gap:8px;justify-content:center;margin-top:16px;flex-wrap:wrap}
.dict-sample{font-size:var(--fs-base);padding:7px 15px;border:1px solid var(--hair2);border-radius:999px;cursor:pointer;
  background:var(--surface);color:var(--ink);transition:transform .15s,border-color .15s}
.dict-sample:hover{transform:translateY(-2px);border-color:var(--ink3)}
.dict-result{opacity:0;transform:translateY(8px);transition:opacity .3s,transform .34s var(--ease)}
.dict-result.show{opacity:1;transform:none}
.dict-verdict{border-radius:var(--r2);padding:18px 20px;margin-bottom:16px;border:1px solid transparent;transition:background .3s}
.dict-verdict.route{background:var(--warm-bg);border-color:var(--warm-br)}
.dict-verdict.win{background:var(--good-bg)}
.dict-verdict.lose{background:var(--danger-bg)}
.dict-verdict.none{background:var(--soft)}
.dict-v-top{display:flex;align-items:baseline;gap:12px}
.dict-v-char{font-size:28px;font-weight:700;line-height:1}
.dict-v-head{font-size:var(--fs-md);font-weight:600}
.dict-verdict.route .dict-v-head{color:var(--warm-ink)}
.dict-verdict.win .dict-v-head{color:var(--good)}
.dict-verdict.lose .dict-v-head{color:var(--danger)}
.dict-v-desc{font-size:var(--fs-base);color:var(--ink2);margin:8px 0 0;line-height:1.6}
.dict-groups{border:1px solid var(--hair);border-radius:var(--r2);overflow:hidden;background:var(--surface)}
.dict-sec{border-bottom:1px solid var(--hair)}
.dict-sec:last-child{border-bottom:none}
.dict-gh{display:flex;align-items:center;gap:8px;padding:11px 15px;background:var(--raise);cursor:pointer;user-select:none}
.dict-badge{font-size:var(--fs-sm);font-weight:600;padding:2px 9px;border-radius:999px}
.dict-badge.win{background:var(--good-bg);color:var(--good)}
.dict-badge.route{background:var(--warm-bg);color:var(--warm-ink)}
.dict-badge.lose{background:var(--danger-bg);color:var(--danger)}
.dict-gnote{font-size:var(--fs-sm);color:var(--ink3)}
.dict-gcaret{margin-left:auto;color:var(--ink3);display:flex;transition:transform .2s}
.dict-gcaret svg{width:var(--ico-xs);height:var(--ico-xs)}
.dict-gh.open .dict-gcaret{transform:rotate(180deg)}
.dict-rows{max-height:0;overflow:hidden;transition:max-height .3s ease}
.dict-rows.open{max-height:3000px}
/* 역방향 조회(prev-words) — 이 글자로 끝나는 단어 */
.dict-prev{margin-top:16px;border:1px solid var(--hair);border-radius:var(--r2);overflow:hidden}
.dict-prev-head{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;padding:12px 15px;
  background:var(--raise);cursor:pointer;user-select:none}
.dict-prev-title{font-size:var(--fs-base);font-weight:700;color:var(--ink)}
.dict-prev-sub{font-size:var(--fs-sm);color:var(--ink3)}
.dict-prev-head .dict-gcaret{transition:transform .2s}
.dict-prev-head.open .dict-gcaret{transform:rotate(180deg)}
.dict-prev-body{max-height:0;overflow:hidden;transition:max-height .35s ease}
.dict-prev-body.open{max-height:2400px;overflow-y:auto}
.dict-prev-row{display:flex;align-items:flex-start;gap:12px;padding:10px 15px;border-top:1px solid var(--hair)}
.dict-prev-start{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--hair2);background:var(--surface);
  cursor:pointer;font-family:inherit;padding:5px 9px;border-radius:999px;flex-shrink:0;transition:border-color .15s,background .15s}
.dict-prev-start:hover{border-color:var(--ink3);background:var(--soft)}
.dict-prev-ch{font-size:var(--fs-base);font-weight:700;color:var(--ink)}
.dict-prev-words{display:flex;flex-wrap:wrap;gap:5px;align-items:center;padding-top:3px}
.dict-prev-w{font-size:var(--fs-base);color:var(--ink2);background:var(--soft);padding:2px 8px;border-radius:7px}
.dict-prev-more{font-size:var(--fs-sm);color:var(--ink4)}
.dict-row{display:flex;align-items:center;justify-content:space-between;padding:11px 15px;
  border-top:1px solid var(--hair);cursor:pointer;transition:background .15s}
.dict-row:hover{background:var(--raise)}
.dict-word{font-size:var(--fs-base);color:var(--ink)}
.dict-word .more{font-size:var(--fs-sm);color:var(--ink4);margin-left:6px}
.dict-next{font-size:var(--fs-base);color:var(--ink2);display:flex;align-items:center;gap:5px;text-align:right}
.dict-next svg{width:var(--ico-xs);height:var(--ico-xs);color:var(--ink4);flex-shrink:0}
.dict-loading{padding:36px 0;text-align:center;color:var(--ink4);font-size:var(--fs-base)}
.dict-empty{padding:13px 15px;font-size:var(--fs-base);color:var(--ink4)}


/* ===== 플레이 모드 (탐색 내 — 구 freeplay) ===== */

.fp-rail{display:flex;gap:6px;align-items:center;overflow-x:auto;padding:4px 0 12px;margin-bottom:14px;
  border-bottom:1px solid var(--hair);min-height:44px}
.fp-rail::-webkit-scrollbar{height:0}
.fp-move{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 12px;border-radius:var(--r1);
  background:var(--soft)}
.fp-move .n{font-size:var(--fs-micro);color:var(--ink4);line-height:1}
.fp-move .w{font-size:var(--fs-base);color:var(--ink);font-weight:500}
.fp-move.me{background:var(--good-bg)}.fp-move.me .w{color:var(--good)}
.fp-rail-empty{font-size:var(--fs-base);color:var(--ink4);padding:8px 2px}
.fp-turn{flex-shrink:0;font-size:var(--fs-cap);color:var(--ink4);padding:0 8px;white-space:nowrap}
.fp-current{display:flex;align-items:baseline;gap:10px;margin-bottom:4px}
.fp-cur-char{font-size:24px;font-weight:700}
.fp-cur-who{font-size:var(--fs-base);color:var(--ink3)}
/* 최선수 원탭 바 (issue 5) */
.fp-best{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:-4px 0 14px;
  padding:10px 14px;background:var(--surface);border:1px solid var(--hair2);border-radius:var(--r2)}
.fp-best-lbl{font-size:var(--fs-sm);font-weight:700;color:var(--ink3)}
.fp-best-w{font-size:var(--fs-md);font-weight:700;color:var(--ink);margin-right:auto}
.fp-best-play{display:inline-flex;align-items:center;gap:4px;border:none;cursor:pointer;
  background:var(--p-bg);color:var(--p-ink);font-family:inherit;font-size:var(--fs-base);font-weight:700;
  padding:7px 13px;border-radius:999px;transition:transform .12s var(--ease),opacity .15s}
.fp-best-play:hover{opacity:.9}.fp-best-play:active{transform:scale(.96)}
.fp-best-play svg{width:var(--ico-xs);height:var(--ico-xs)}
.fp-tbtn{font-size:var(--fs-base);padding:8px 14px;border:1px solid var(--hair2);border-radius:999px;background:var(--surface);
  color:var(--ink2);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:5px;
  transition:border-color .15s,color .15s}
.fp-tbtn:hover{border-color:var(--ink3);color:var(--ink)}
.fp-tbtn:disabled{opacity:.4;cursor:default}
.fp-tbtn svg{width:var(--ico-xs);height:var(--ico-xs)}
.fp-tbtn.hint{margin-left:auto}
.fp-loading{padding:30px 0;text-align:center;color:var(--ink4);font-size:var(--fs-base)}
.fp-over{border-radius:var(--r2);padding:20px;text-align:center;background:var(--soft);margin-bottom:14px}
.fp-over.win{background:var(--good-bg)}.fp-over.lose{background:var(--danger-bg)}
.fp-over .big{font-size:16px;font-weight:700;display:block;margin-bottom:4px}
.fp-over.win .big{color:var(--good)}.fp-over.lose .big{color:var(--danger)}
.fp-over .sub{font-size:var(--fs-base);color:var(--ink2)}


/* ===== learn ===== */

.ln-wrap{max-width:100%}
.ln-progress{display:flex;gap:6px;margin-bottom:24px}
.ln-dot{flex:1;height:4px;border-radius:999px;background:var(--hair2);transition:background .3s}
.ln-dot.on{background:var(--ink)}
.ln-dot.done{background:var(--ink3)}
.ln-card{opacity:0;transform:translateY(10px);transition:opacity .35s var(--ease),transform .35s var(--ease);
  min-height:280px;display:flex;flex-direction:column}
.ln-card.in{opacity:1;transform:none}
.ln-step{font-size:var(--fs-base);font-weight:600;color:var(--ink3);letter-spacing:.02em;margin-bottom:10px}
.ln-title{font-size:var(--fs-xl);font-weight:700;letter-spacing:-.03em;line-height:1.3;margin:0 0 12px}
.ln-body{font-size:var(--fs-base);color:var(--ink2);line-height:1.7;margin:0 0 20px}
.ln-body b{color:var(--ink);font-weight:600}
.ln-demo{border-radius:var(--r2);padding:18px;background:var(--surface);border:1px solid var(--hair);margin-bottom:8px}
.ln-demo.win{background:var(--good-bg);border-color:transparent}
.ln-demo.lose{background:var(--danger-bg);border-color:transparent}
.ln-demo.route{background:var(--warm-bg);border-color:var(--warm-br)}
.ln-flow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:var(--fs-md)}
.ln-tok{padding:6px 12px;border-radius:var(--r1);background:var(--soft);font-weight:600;color:var(--ink)}
.ln-tok.big{font-size:var(--fs-lg)}
.ln-tok.danger{background:var(--danger-bg);color:var(--danger)}
.ln-tok.good{background:var(--good-bg);color:var(--good)}
.ln-tok.warm{background:var(--warm-bg);color:var(--warm-ink)}
.ln-arrow{color:var(--ink4);display:flex;align-items:center}
.ln-arrow svg{width:var(--ico-sm);height:var(--ico-sm)}
.ln-caption{font-size:var(--fs-base);color:var(--ink3);margin-top:10px;line-height:1.5}
.ln-stat{display:flex;gap:8px;margin-top:12px}
.ln-stat-box{flex:1;text-align:center;padding:12px 8px;border-radius:var(--r1);background:var(--surface);border:1px solid var(--hair)}
.ln-stat-n{font-size:var(--fs-lg);font-weight:700;letter-spacing:-.02em}
.ln-stat-n.win{color:var(--good)}.ln-stat-n.lose{color:var(--danger)}.ln-stat-n.route{color:var(--warm-ink)}
.ln-stat-l{font-size:var(--fs-sm);color:var(--ink3);margin-top:2px}
.ln-nav{display:flex;gap:8px;margin-top:auto;padding-top:20px}
.ln-btn{padding:12px 20px;border:1px solid var(--hair2);border-radius:var(--r1);background:var(--surface);
  color:var(--ink);font-size:var(--fs-base);font-weight:600;font-family:inherit;cursor:pointer;transition:border-color .15s,opacity .15s}
.ln-btn:hover{border-color:var(--ink3)}
.ln-btn.primary{flex:1;background:var(--p-bg);color:var(--p-ink);border-color:var(--p-bg)}
.ln-btn:disabled{opacity:.4;cursor:default}
.ln-final-tools{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.ln-tool-link{display:flex;align-items:center;gap:12px;padding:13px 15px;border:1px solid var(--hair);border-radius:var(--r1);
  background:var(--surface);cursor:pointer;transition:border-color .15s,transform .12s}
.ln-tool-link:hover{border-color:var(--ink3);transform:translateY(-1px)}
.ln-tool-link .ti{font-size:var(--fs-sm)}
.ln-tl-ico{width:32px;height:32px;border-radius:9px;background:var(--soft);color:var(--ink2);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ln-tl-ico svg{width:var(--ico-sm);height:var(--ico-sm)}
.ln-tl-name{font-size:var(--fs-base);font-weight:600;color:var(--ink)}
.ln-tl-desc{font-size:var(--fs-sm);color:var(--ink3)}
.ln-tl-arrow{margin-left:auto;color:var(--ink4)}
.ln-tl-arrow svg{width:var(--ico-sm);height:var(--ico-sm)}
.ln-loading{padding:60px 0;text-align:center;color:var(--ink4);font-size:var(--fs-base)}


/* ===== review ===== */

.rv-setup{padding:8px 0}
.rv-intro{font-size:var(--fs-base);color:var(--ink2);line-height:1.6;margin:0 0 16px}
.rv-field{margin-bottom:14px}
.rv-flabel{font-size:var(--fs-base);font-weight:600;color:var(--ink3);margin:0 2px 8px}
.rv-input{width:100%;border:1px solid var(--hair2);border-radius:var(--r1);padding:12px 14px;background:var(--surface);
  color:var(--ink);font-size:var(--fs-base);font-family:inherit;outline:none;resize:vertical;min-height:80px;line-height:1.7}
.rv-input:focus{border-color:var(--ink3)}
.rv-hintline{font-size:var(--fs-sm);color:var(--ink4);margin:6px 2px 0}
.rv-seat{display:flex;gap:8px;align-items:center;margin-bottom:14px}
.rv-seat .lbl{font-size:var(--fs-base);color:var(--ink3);margin-right:auto}
.rv-seat-tog{display:inline-flex;border:1px solid var(--hair2);border-radius:999px;overflow:hidden}
.rv-seat-tog button{border:none;background:transparent;color:var(--ink2);font-size:var(--fs-sm);padding:6px 13px;cursor:pointer;font-family:inherit}
.rv-seat-tog button.on{background:var(--p-bg);color:var(--p-ink);font-weight:600}
.rv-go{width:100%;padding:13px;border:none;border-radius:var(--r1);background:var(--p-bg);color:var(--p-ink);
  font-size:var(--fs-md);font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s,transform .12s var(--ease)}
.rv-go:active{transform:scale(.99)}
.rv-go:disabled{opacity:.45;cursor:default}
.rv-err{font-size:var(--fs-base);color:var(--danger);margin:10px 2px 0}
.rv-summary{border-radius:var(--r2);padding:16px 18px;margin-bottom:14px;background:var(--soft)}
.rv-summary.win{background:var(--good-bg)}.rv-summary.lose{background:var(--danger-bg)}
.rv-sum-big{font-size:16px;font-weight:700;display:block;margin-bottom:3px}
.rv-summary.win .rv-sum-big{color:var(--good)}.rv-summary.lose .rv-sum-big{color:var(--danger)}
.rv-sum-sub{font-size:var(--fs-base);color:var(--ink2);line-height:1.55}
.rv-detail{border-radius:var(--r2);padding:16px 18px;margin-bottom:14px;background:var(--surface);border:1px solid var(--hair)}
.rv-d-head{font-size:var(--fs-base);font-weight:600;margin-bottom:8px}
.rv-d-head.blunder{color:var(--danger)}.rv-d-head.best{color:var(--good)}
.rv-d-head.inaccuracy{color:var(--warn,#e0a93a)}
.rv-d-body{font-size:var(--fs-base);color:var(--ink2);line-height:1.6}
.rv-d-body b{color:var(--ink);font-weight:600}
.rv-loss{margin-top:10px;display:inline-block;font-size:var(--fs-sm);font-weight:600;padding:4px 10px;
  border-radius:999px;background:var(--danger-bg);color:var(--danger)}
.rv-loss.gain{background:var(--good-bg);color:var(--good)}
.rv-loss b{color:inherit;font-weight:800}
.rv-cmp{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.rv-cmp-row{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:var(--r1);background:var(--raise)}
.rv-cmp-badge{font-size:var(--fs-cap);font-weight:600;padding:2px 8px;border-radius:999px;white-space:nowrap}
.rv-cmp-badge.good{background:var(--good-bg);color:var(--good)}
.rv-cmp-badge.bad{background:var(--danger-bg);color:var(--danger)}
.rv-cmp-word{font-size:var(--fs-base);color:var(--ink)}
.rv-cmp-note{font-size:var(--fs-sm);color:var(--ink3);margin-left:auto}
.rv-actions{display:flex;gap:8px;margin-bottom:8px}
.rv-abtn{flex:1;padding:11px;border:1px solid var(--hair2);border-radius:var(--r1);background:var(--surface);
  color:var(--ink);font-size:var(--fs-base);font-weight:600;font-family:inherit;cursor:pointer;transition:border-color .15s}
.rv-abtn:hover{border-color:var(--ink3)}
.rv-abtn.primary{background:var(--p-bg);color:var(--p-ink);border-color:var(--p-bg)}
.rv-loading{padding:36px 0;text-align:center;color:var(--ink4);font-size:var(--fs-base)}
.rv-legend{display:flex;gap:14px;margin:0 2px 12px;font-size:var(--fs-sm);color:var(--ink3)}
.rv-legend span{display:inline-flex;align-items:center;gap:5px}
.rv-legend .dot{width:9px;height:9px;border-radius:3px}
.rv-legend .rv-warn-dot{background:var(--warn,#e0a93a)}
.rvg-dot.warn{fill:var(--warn,#e0a93a)}


/* ===== settings ===== */

.set-field{margin-bottom:22px}
.set-label{font-size:var(--fs-base);font-weight:600;color:var(--ink3);margin:0 2px 9px;letter-spacing:.01em}
.set-seg{display:flex;gap:6px;flex-wrap:wrap}
.set-opt{font-size:var(--fs-base);padding:9px 16px;border:1px solid var(--hair2);border-radius:999px;cursor:pointer;
  background:var(--surface);color:var(--ink2);font-family:inherit;
  transition:background .18s,color .18s,border-color .18s,transform .12s var(--ease)}
.set-opt:hover{border-color:var(--ink3);color:var(--ink)}
.set-opt:active{transform:scale(.97)}
.set-opt.on{background:var(--p-bg);color:var(--p-ink);border-color:var(--p-bg);font-weight:600}
.set-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;
  background:var(--surface);border:1px solid var(--hair);border-radius:var(--r2);margin-bottom:10px;cursor:pointer;
  transition:border-color .18s}
.set-toggle-row:hover{border-color:var(--hair2)}
.set-t-name{font-size:var(--fs-base);font-weight:600;color:var(--ink)}
.set-t-desc{font-size:var(--fs-sm);color:var(--ink3);margin-top:3px}
.set-switch{position:relative;width:40px;height:23px;border-radius:999px;background:var(--hair2);
  transition:background .2s;flex-shrink:0}
.set-switch.on{background:var(--good)}
.set-switch::after{content:'';position:absolute;top:2.5px;left:2.5px;width:18px;height:18px;border-radius:50%;
  background:#fff;transition:transform .2s var(--ease);box-shadow:0 1px 2px rgba(0,0,0,.15)}
.set-switch.on::after{transform:translateX(17px)}
.set-apply{width:100%;padding:14px;border:none;border-radius:var(--r1);background:var(--p-bg);color:var(--p-ink);
  font-size:var(--fs-md);font-weight:700;font-family:inherit;cursor:pointer;letter-spacing:-.01em;
  transition:opacity .18s,transform .12s var(--ease)}
.set-apply:hover{opacity:.9}
.set-apply:active{transform:scale(.99)}
.set-apply:disabled{opacity:.45;cursor:default;transform:none}
.set-result{margin-top:14px;padding:13px 16px;border-radius:var(--r2);font-size:var(--fs-base);line-height:1.6;
  opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s var(--ease)}
.set-result.show{opacity:1;transform:none}
.set-result.ok{background:var(--good-bg);color:var(--good)}
.set-result.info{background:var(--soft);color:var(--ink2)}
.set-note{font-size:var(--fs-sm);color:var(--ink4);margin:16px 2px 0;line-height:1.6}


/* ===== 인라인 스타일 대체 유틸리티 (CSP style-src 'self' 대응) ===== */
.u-mr8{margin-right:8px}
.u-mt14{margin-top:14px}
.u-mt0{margin-top:0}
.u-pad16{padding:16px 0}
.u-op85{opacity:.85}
.u-fw500{font-weight:500}
.u-hint{font-size:var(--fs-base);color:var(--ink3)}
.u-hint-warm{font-size:var(--fs-base);color:var(--warm-ink)}
.u-lead{font-size:var(--fs-xl);font-weight:700;letter-spacing:-.03em}
.u-sub{font-size:var(--fs-base);color:var(--ink2)}
.u-ink{color:var(--ink)}
.u-ink3{color:var(--ink3)}
.u-ink4{color:var(--ink4)}
.u-ink4-shrink{color:var(--ink4);flex-shrink:0}
.u-ink4-ml4{color:var(--ink4);margin-left:4px}
.u-ink-name{color:var(--ink);font-weight:500;margin-left:2px}
.u-good{color:var(--good)}
.u-danger{color:var(--danger)}
.u-bg-good{background:var(--good)}
.u-bg-danger{background:var(--danger)}
.u-spinner-p{width:15px;height:15px;border-width:2px;margin-right:8px;border-top-color:var(--p-ink);border-color:color-mix(in srgb,var(--p-ink) 30%,transparent);vertical-align:-2px}
/* 순차 등장 애니메이션 지연: --i 변수로 제어 */
.u-stagger{transition-delay:calc(0.04s * var(--i, 1))}

/* 판정 못 한 수의 상대 여지 힌트 */
.dict-hint{display:inline-block;font-size:var(--fs-cap);font-weight:600;padding:1px 6px;border-radius:999px;
  background:var(--soft);color:var(--ink3);margin-right:6px;vertical-align:1px}
.dict-hint.good{background:var(--good-bg);color:var(--good)}
.dict-hint.danger{background:var(--danger-bg);color:var(--danger)}
.dict-wr{display:inline-block;font-size:var(--fs-cap);font-weight:700;padding:1px 7px;border-radius:999px;
  background:var(--soft);color:var(--ink2);margin-right:6px;vertical-align:1px}
.dict-wr.good{background:var(--good-bg);color:var(--good)}
.dict-wr.danger{background:var(--danger-bg);color:var(--danger)}
/* 넘길 글자 + 전략적 의미 뱃지 (issue 2) */
.dict-give{color:var(--ink3)}
/* 돌림/두방 단어 성격 라벨 (이끼식) */
.dict-wtype{display:inline-block;font-size:var(--fs-cap);font-weight:700;padding:1px 6px;border-radius:5px;margin-left:7px;
  vertical-align:middle;letter-spacing:-.01em;cursor:help}
.dict-wtype.rd{background:var(--warm-bg,#f4ecdd);color:var(--warm-ink,#8a6d3b)}
.dict-wtype.tw{background:var(--soft);color:var(--ink3);border:1px solid var(--hair)}
/* 탐색→플레이 연속 버튼 */
.dict-playfrom{display:inline-flex;align-items:center;gap:5px;margin:-6px 0 14px;border:1px solid var(--hair2);
  background:var(--surface);color:var(--ink2);cursor:pointer;font-family:inherit;font-size:var(--fs-base);font-weight:600;
  padding:7px 13px;border-radius:999px;transition:border-color .15s,background .15s,color .15s}
.dict-playfrom:hover{border-color:var(--ink3);background:var(--soft);color:var(--ink)}
.dict-mean{display:inline-block;font-size:var(--fs-cap);font-weight:700;padding:1px 7px;border-radius:999px;
  background:var(--soft);color:var(--ink2);margin-left:5px;vertical-align:1px}
.dict-mean.good{background:var(--good-bg);color:var(--good)}
.dict-mean.danger{background:var(--danger-bg);color:var(--danger)}
.dict-mean.kill{background:var(--p-bg);color:var(--p-ink)}

/* ===== 경유 루트 찾기 결과 (탐색 검색창 쉼표 입력) ===== */
.fp-found{margin-top:14px;padding:16px;border-radius:var(--r2);background:var(--raise);border:1px solid var(--hair)}
.fp-found-head{font-size:var(--fs-base);font-weight:600;color:var(--ink2);margin-bottom:10px}
.fp-found-note{font-weight:500;color:var(--danger)}
.fp-found-chain{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:10px;line-height:1.8}
.fp-found-w{font-size:var(--fs-base);color:var(--ink);padding:2px 8px;border-radius:8px;background:var(--surface)}
.fp-found-w.good{background:var(--good-bg);color:var(--good)}
.fp-found-w.danger{background:var(--danger-bg);color:var(--danger)}
.fp-found-w.hit{background:var(--p-bg);color:var(--p-ink);font-weight:600}
.fp-found-arr{color:var(--ink4);font-size:var(--fs-sm)}
.fp-found-legend{font-size:var(--fs-sm);color:var(--ink4);margin-bottom:12px}
.fp-found-legend .fp-found-w{font-size:var(--fs-cap);padding:1px 6px;margin:0 2px}
.fp-warn{margin-top:14px;padding:14px 16px;border-radius:var(--r1);background:var(--warm-bg);
  border:1px solid var(--warm-br);color:var(--warm-ink);font-size:var(--fs-base);line-height:1.6}
.fp-loading{margin-top:14px;padding:14px;color:var(--ink3);font-size:var(--fs-base)}

/* ══════════ 자동완성 드롭다운 (플레이 모드 검색) ══════════ */
.fp-ac{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:30;background:var(--surface);
  border:1px solid var(--hair2);border-radius:var(--r1);box-shadow:0 12px 32px rgba(0,0,0,.14);
  overflow:hidden;text-align:left;max-height:280px;overflow-y:auto}
.fp-ac-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;
  font-size:var(--fs-base);color:var(--ink);cursor:pointer;transition:background .1s}
.fp-ac-item b{font-weight:700;color:var(--ink)}
.fp-ac-item .nx{font-size:var(--fs-sm);color:var(--ink3);flex-shrink:0}
.fp-ac-item:hover,.fp-ac-item.on{background:var(--raise)}
.fp-ac-item.on{box-shadow:inset 2px 0 0 var(--p-bg)}

/* 게임 중 단어 검색 */
.fp-search{position:relative;margin:0 0 12px}
.fp-search input{width:100%;box-sizing:border-box;border:1px solid var(--hair2);border-radius:999px;
  padding:10px 16px;background:var(--surface);color:var(--ink);font-size:var(--fs-base);font-family:inherit;outline:none;
  transition:border-color .15s}
.fp-search input:focus{border-color:var(--ink3);box-shadow:0 0 0 4px var(--focus)}
.fp-search input::placeholder{color:var(--ink4)}

/* ══════════ 복기: 승률 그래프 ══════════ */
.rv-graph{border:1px solid var(--hair);border-radius:var(--r2);background:var(--surface);
  padding:12px 14px 6px;margin-bottom:14px}
.rvg-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.rvg-head>span:first-child{font-size:var(--fs-base);font-weight:700;color:var(--ink)}
.rvg-note{font-size:var(--fs-sm);color:var(--ink4)}
.rvg-scroll{overflow-x:auto;overflow-y:hidden}
.rvg-scroll::-webkit-scrollbar{height:6px}
.rvg-scroll svg{display:block}
.rvg-mid{stroke:var(--hair2);stroke-width:1;stroke-dasharray:4 4}
.rvg-line{fill:none;stroke:var(--ink2);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.rvg-area{fill:var(--good);opacity:.07}
.rvg-yl{font-size:var(--fs-micro);fill:var(--ink4)}
.rvg-xl{font-size:var(--fs-micro);fill:var(--ink4)}
.rvg-dot{fill:var(--surface);stroke:var(--ink3);stroke-width:1.6;cursor:pointer;transition:r .12s}
.rvg-dot.start{cursor:default}
.rvg-dot.good{stroke:var(--good);fill:var(--good-bg)}
.rvg-dot.bad{stroke:var(--danger);fill:var(--danger-bg)}
.rvg-dot.swing{stroke:var(--warm-ink);fill:var(--warm-bg)}
.rvg-dot.sel{stroke-width:3}
.rvg-dot:hover{stroke-width:3}

/* ══════════ 복기: 내 아카이브 ══════════ */
.rv-arch{margin-top:26px;border-top:1px solid var(--hair);padding-top:18px}
.rv-arch-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.rv-arch-head>span:first-child{font-size:var(--fs-base);font-weight:700;color:var(--ink)}
.rv-arch-sub{font-size:var(--fs-sm);color:var(--ink4)}
.rv-arch-body{display:flex;flex-direction:column;gap:8px}
.rv-arch-note{font-size:var(--fs-base);color:var(--ink4);padding:18px 0;text-align:center;line-height:1.7}
.rv-arch-link{color:var(--ink2);font-weight:600;text-decoration:underline}
.rv-arch-item{border:1px solid var(--hair);border-radius:var(--r1);background:var(--surface);
  padding:11px 14px;cursor:pointer;transition:border-color .15s,transform .12s var(--ease)}
.rv-arch-item:hover{border-color:var(--ink3);transform:translateY(-1px)}
.rv-arch-item.loading{opacity:.55;pointer-events:none}
.rv-arch-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.rv-arch-mode{font-size:var(--fs-sm);font-weight:600;color:var(--ink2)}
.rv-arch-time{font-size:var(--fs-sm);color:var(--ink4)}
.rv-arch-vs{font-size:var(--fs-base);color:var(--ink);margin-top:3px}
.rv-arch-vs .rv-arch-win{font-weight:700}
.rv-arch-v{font-size:var(--fs-cap);color:var(--ink4);margin:0 4px}
.rv-arch-prev{font-size:var(--fs-sm);color:var(--ink3);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv-arch-more{margin-top:10px;width:100%}

/* ══════════ 글자 사전: 결과 내 검색 · 행 펼치기 ══════════ */
.dict-filter{margin-bottom:10px}
.dict-filter input{width:100%;box-sizing:border-box;border:1px solid var(--hair2);border-radius:999px;
  padding:9px 16px;background:var(--surface);color:var(--ink);font-size:var(--fs-base);font-family:inherit;outline:none;
  transition:border-color .15s}
.dict-filter input:focus{border-color:var(--ink3);box-shadow:0 0 0 4px var(--focus)}
.dict-filter input::placeholder{color:var(--ink4)}
.dict-row{display:block;padding:0}
.dict-row-top{display:flex;align-items:center;gap:10px;padding:11px 15px}
.dict-row-main{flex:1;display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;min-width:0}
.dict-row-main .dict-word{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dict-jump{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;border:1px solid var(--hair2);
  border-radius:999px;background:var(--surface);color:var(--ink2);font-size:var(--fs-sm);font-family:inherit;
  padding:6px 12px;cursor:pointer;transition:border-color .15s,color .15s}
.dict-jump:hover{border-color:var(--ink3);color:var(--ink)}
.dict-jump svg{width:var(--ico-xs);height:var(--ico-xs)}
.dict-words{padding:2px 15px 12px;display:flex;flex-wrap:wrap;gap:6px;border-top:1px dashed var(--hair)}
.dict-words[hidden]{display:none}
.dict-chipw{font-size:var(--fs-base);padding:4px 10px;border-radius:999px;background:var(--raise);color:var(--ink2)}
.dict-chipw.rest{color:var(--ink4)}
.dict-row.expanded{background:var(--raise)}
.dict-row.expanded .dict-words .dict-chipw{background:var(--surface)}
.dict-frow{display:flex;align-items:center;gap:10px;padding:10px 15px;border-bottom:1px solid var(--hair)}
.dict-frow:last-child{border-bottom:none}
.dict-frow .dict-word{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dict-v-depth{font-size:var(--fs-base);color:var(--ink2);margin-top:8px;padding-top:8px;border-top:1px dashed var(--hair2)}

@media (max-width:700px){
  .dict-jump{padding:6px 9px}
  .rvg-note{display:block}
}

/* ═════════ 꼬리봇 대결 (battle) ═════════ */
.bt-loading{padding:40px 0;text-align:center;color:var(--ink4);font-size:var(--fs-base)}
.bt-intro{margin-bottom:20px}
.bt-title{font-size:var(--fs-xl);font-weight:700;color:var(--ink);margin:0 0 6px}
.bt-sub{font-size:var(--fs-base);color:var(--ink3);margin:0;line-height:1.6}
.bt-setup{display:flex;flex-direction:column;gap:20px;max-width:520px}
.bt-field{display:flex;flex-direction:column;gap:9px}
.bt-flabel{font-size:var(--fs-base);font-weight:600;color:var(--ink2)}
.bt-opt{font-weight:400;color:var(--ink4);font-size:var(--fs-sm)}
.bt-seg{display:flex;gap:8px}
.bt-segbtn{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 10px;
  border:1px solid var(--hair2);border-radius:var(--r1);background:var(--surface);cursor:pointer;
  font-family:inherit;transition:border-color .15s,background .15s}
.bt-segbtn b{font-size:var(--fs-base);color:var(--ink);font-weight:600}
.bt-segbtn span{font-size:var(--fs-cap);color:var(--ink4)}
.bt-segbtn:hover{border-color:var(--ink3)}
.bt-segbtn.on{border-color:var(--ink);background:var(--raise)}
.bt-segbtn.on b{color:var(--ink)}
.bt-start{padding:12px 14px;border:1px solid var(--hair2);border-radius:var(--r1);background:var(--field);
  color:var(--ink);font-size:var(--fs-lg);font-family:inherit;text-align:center;width:90px}
.bt-start:focus{outline:none;border-color:var(--ink)}
.bt-go{margin-top:4px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:14px;border:none;border-radius:var(--r1);background:var(--p-bg);color:var(--p-ink);
  font-size:var(--fs-md);font-weight:600;font-family:inherit;cursor:pointer;transition:opacity .15s}
.bt-go:hover{opacity:.9}
.bt-go svg{width:var(--ico-md);height:var(--ico-md)}

.bt-hud{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.bt-hud-diff{font-size:var(--fs-base);font-weight:600;color:var(--ink2);display:inline-flex;align-items:center;gap:6px}
.bt-reset{display:inline-flex;align-items:center;gap:5px;padding:7px 12px;border:1px solid var(--hair2);
  border-radius:999px;background:var(--surface);color:var(--ink3);font-size:var(--fs-sm);font-family:inherit;cursor:pointer}
.bt-reset:hover{border-color:var(--ink3);color:var(--ink)}
.bt-reset svg{width:var(--ico-xs);height:var(--ico-xs)}
.bt-cur{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px 0 20px}
.bt-cur-ch{font-size:var(--fs-char-lg);font-weight:800;color:var(--ink);line-height:1}
.bt-cur-tag{font-size:var(--fs-sm);font-weight:600;padding:3px 12px;border-radius:999px;min-height:22px}
.bt-cur-tag.win{background:var(--good-bg);color:var(--good)}
.bt-cur-tag.lose{background:var(--danger-bg);color:var(--danger)}
.bt-cur-tag.route{background:var(--soft);color:var(--ink3)}
.bt-turnbar{min-height:26px;text-align:center;margin-bottom:10px}
.bt-turn{font-size:var(--fs-base);font-weight:600;padding:4px 14px;border-radius:999px}
.bt-turn.me{background:var(--good-bg);color:var(--good)}
.bt-turn.bot{background:var(--soft);color:var(--ink2)}
.bt-play{min-height:80px;margin-bottom:18px}
.bt-inputwrap{position:relative}
.bt-input{width:100%;padding:14px 16px;border:1px solid var(--hair2);border-radius:var(--r1);
  background:var(--field);color:var(--ink);font-size:16px;font-family:inherit;box-sizing:border-box}
.bt-input:focus{outline:none;border-color:var(--ink)}
.bt-ac{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:20;background:var(--surface);
  border:1px solid var(--hair2);border-radius:var(--r1);overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.bt-ac-item{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;cursor:pointer;font-size:var(--fs-md);color:var(--ink)}
.bt-ac-item:hover,.bt-ac-item.on{background:var(--raise)}
.bt-ac-item .nx{font-size:var(--fs-sm);color:var(--ink4)}
.bt-hintline{margin-top:10px;font-size:var(--fs-base);color:var(--ink3);text-align:center;line-height:1.5}
.bt-warn{color:var(--danger)}
.bt-thinking{padding:20px 0;text-align:center;color:var(--ink3);font-size:var(--fs-base)}
.bt-chain{display:flex;flex-direction:column;gap:6px;max-height:280px;overflow-y:auto;padding-top:4px}
.bt-chain-empty{text-align:center;color:var(--ink4);font-size:var(--fs-base);padding:20px 0}
.bt-move{display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:var(--r1);max-width:80%}
.bt-move.me{align-self:flex-end;background:var(--good-bg);flex-direction:row-reverse}
.bt-move.bot{align-self:flex-start;background:var(--soft)}
.bt-move .bt-mw{font-size:var(--fs-md);font-weight:600;color:var(--ink)}
.bt-move .bt-mn{font-size:var(--fs-sm);color:var(--ink4)}
.bt-over{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px 20px;border-radius:var(--r2);text-align:center}
.bt-over.win{background:var(--good-bg)}
.bt-over.lose{background:var(--danger-bg)}
.bt-over-big{font-size:var(--fs-xl);font-weight:800;color:var(--ink)}
.bt-over.win .bt-over-big{color:var(--good)}
.bt-over.lose .bt-over-big{color:var(--danger)}
.bt-over-sub{font-size:var(--fs-base);color:var(--ink2);line-height:1.6;max-width:340px}
.bt-over-actions{display:flex;gap:10px;margin-top:12px}
.bt-abtn{padding:11px 20px;border:1px solid var(--hair2);border-radius:var(--r1);background:var(--surface);
  color:var(--ink);font-size:var(--fs-base);font-weight:600;font-family:inherit;cursor:pointer;transition:border-color .15s}
.bt-abtn:hover{border-color:var(--ink3)}
.bt-abtn.primary{background:var(--p-bg);color:var(--p-ink);border-color:var(--p-bg)}

/* 배틀 실시간 승률 바 */
.bt-wr{margin:0 auto 16px;max-width:440px}
.bt-wr-bar{height:10px;border-radius:999px;background:var(--danger-bg);overflow:hidden;position:relative}
.bt-wr-fill{height:100%;border-radius:999px;background:var(--ink3);transition:width .5s cubic-bezier(.4,0,.2,1);
  min-width:2px}
.bt-wr-fill.good{background:var(--good)}
.bt-wr-fill.low{background:var(--danger)}
.bt-wr-fill.calc{background:var(--ink4);opacity:.5}
.bt-wr-labels{display:flex;justify-content:space-between;margin-top:6px;font-size:var(--fs-sm);color:var(--ink3);font-weight:600}
.bt-wr-labels .bt-wr-bot{color:var(--ink4)}

/* ═════════ 학습 도구: 모드 탭 + 실전 팁 ═════════ */
.ln-tabs{display:inline-flex;gap:4px;padding:4px;background:var(--soft);border-radius:999px;margin-bottom:22px}
.ln-tab{padding:7px 18px;border:none;border-radius:999px;background:transparent;color:var(--ink3);
  font-size:var(--fs-base);font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s,color .15s}
.ln-tab.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.ln-tips-load,.ln-tips .ln-tip-empty{color:var(--ink4);font-size:var(--fs-base)}
.ln-tips-load{padding:40px 0;text-align:center}
.ln-tips{display:flex;flex-direction:column;gap:16px}
.ln-tip-card{border:1px solid var(--hair);border-radius:var(--r2);padding:18px 20px;background:var(--surface)}
.ln-tip-h{display:flex;align-items:center;gap:9px;font-size:var(--fs-md);font-weight:700;color:var(--ink);margin-bottom:8px}
.ln-tip-badge{font-size:var(--fs-cap);font-weight:700;padding:3px 9px;border-radius:999px;letter-spacing:.02em}
.ln-tip-badge.atk{background:var(--danger-bg);color:var(--danger)}
.ln-tip-badge.due{background:var(--good-bg);color:var(--good)}
.ln-tip-badge.hold{background:var(--warn-bg,#332810);color:var(--warn,#e0a93a)}
.ln-tip-desc{font-size:var(--fs-base);color:var(--ink3);line-height:1.6;margin:0 0 14px}
.ln-tip-row{display:flex;align-items:center;gap:8px;padding:9px 0;border-top:1px solid var(--hair);flex-wrap:wrap}
.ln-tip-row:first-of-type{border-top:none}
.ln-tip-word{font-size:var(--fs-md);font-weight:600;color:var(--ink)}
.ln-tip-recv{font-size:var(--fs-base);color:var(--ink2);font-weight:500}
.ln-tip-arrow{color:var(--ink4);font-size:var(--fs-base)}
.ln-tip-to{font-size:var(--fs-md);font-weight:700;color:var(--danger)}
.ln-tip-note{font-size:var(--fs-sm);color:var(--ink4);margin-left:auto}
.ln-tip-empty{padding:8px 0}
.ln-long-wrap{display:flex;flex-wrap:wrap;gap:7px}
.ln-long-chip{font-size:var(--fs-base);padding:6px 12px;border-radius:999px;background:var(--soft);color:var(--ink2);font-weight:500}
.ln-tip-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:16px 18px;border-radius:var(--r2);background:var(--raise);border:1px solid var(--hair)}
.ln-tip-foot span{font-size:var(--fs-base);color:var(--ink2);line-height:1.5}
@media(max-width:520px){.ln-tip-note{margin-left:0;width:100%}.ln-tip-foot{flex-direction:column;align-items:stretch}}

/* 배틀 저장한 대국 */
.bt-saved-sec{margin-top:28px;padding-top:22px;border-top:1px solid var(--hair)}
.bt-saved-h{font-size:var(--fs-base);font-weight:700;color:var(--ink2);margin-bottom:12px;display:flex;align-items:center;gap:7px}
.bt-saved-n{font-size:var(--fs-cap);font-weight:600;color:var(--ink4);background:var(--soft);padding:1px 8px;border-radius:999px}
.bt-saved-list{display:flex;flex-direction:column;gap:8px}
.bt-saved-item{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:11px 14px;border:1px solid var(--hair);border-radius:var(--r1);background:var(--surface)}
.bt-saved-main{display:flex;align-items:center;gap:12px;min-width:0}
.bt-saved-res{font-size:var(--fs-sm);font-weight:800;width:26px;height:26px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bt-saved-res.win{background:var(--good-bg);color:var(--good)}
.bt-saved-res.lose{background:var(--danger-bg);color:var(--danger)}
.bt-saved-info{display:flex;flex-direction:column;gap:2px;min-width:0}
.bt-saved-meta{font-size:var(--fs-base);color:var(--ink);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-saved-date{font-size:var(--fs-cap);color:var(--ink4)}
.bt-saved-acts{display:flex;gap:6px;flex-shrink:0}
.bt-saved-btn{padding:6px 12px;border:1px solid var(--hair2);border-radius:999px;background:var(--surface);
  color:var(--ink2);font-size:var(--fs-sm);font-weight:600;font-family:inherit;cursor:pointer;transition:border-color .15s,color .15s}
.bt-saved-btn:hover{border-color:var(--ink3);color:var(--ink)}
.bt-saved-btn.del:hover{border-color:var(--danger);color:var(--danger)}