.guide-button {
  display:flex;
  align-items:center;
  gap:7px;
  min-height:34px;
  padding:5px 10px;
  color:#eaffff;
  background:rgba(0,229,255,.09);
  border:1px solid rgba(0,229,255,.34);
  cursor:pointer;
}
.guide-button span { width:20px; height:20px; display:grid; place-items:center; color:#071016; background:#00e5ff; border-radius:50%; font-weight:1000; }
.guide-button b { font-size:10px; letter-spacing:.08em; }
.guide-button:hover { box-shadow:0 0 20px rgba(0,229,255,.2); }

.mode-coach {
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:44px 1fr auto;
  gap:13px;
  align-items:center;
  max-width:1500px;
  margin:0 auto 16px;
  padding:11px 14px;
  color:#eafcff;
  background:linear-gradient(90deg,rgba(0,229,255,.12),rgba(5,12,17,.94) 30%,rgba(200,255,37,.07));
  border:1px solid rgba(0,229,255,.28);
  box-shadow:0 12px 35px rgba(0,0,0,.18),inset 0 0 26px rgba(0,229,255,.025);
}
.mode-coach.is-alert { border-color:rgba(255,90,31,.62); background:linear-gradient(90deg,rgba(255,90,31,.18),rgba(12,8,7,.95)); }
.mode-coach.is-good { border-color:rgba(200,255,37,.42); }
.mode-coach-icon { width:38px; height:38px; display:grid; place-items:center; color:#071016; background:#00e5ff; border:0; border-radius:50%; font-size:20px; font-weight:1000; box-shadow:0 0 20px rgba(0,229,255,.25); cursor:pointer; }
.mode-coach.is-alert .mode-coach-icon { background:#ff5a1f; }
.mode-coach small { display:block; color:#00e5ff; font:900 8px/1 ui-monospace,monospace; letter-spacing:.16em; }
.mode-coach b { display:block; margin:5px 0 3px; font-size:14px; }
.mode-coach p { color:#91a7b3; font-size:11px; line-height:1.5; }
.mode-coach-more { padding:8px 11px; color:#bfeff5; background:transparent; border:1px solid rgba(151,206,224,.22); font-size:10px; cursor:pointer; }
body.guide-hints-off .mode-coach { display:none; }

[data-guide-term] { cursor:help; text-decoration:underline dotted rgba(0,229,255,.65); text-underline-offset:3px; }
[data-guide-term]:focus-visible { outline:2px solid #00e5ff; outline-offset:4px; }

.guide-modal[hidden] { display:none!important; }
.guide-modal { position:fixed; z-index:120; inset:0; display:grid; place-items:center; padding:18px; }
.guide-backdrop { position:absolute; inset:0; background:rgba(1,4,7,.83); backdrop-filter:blur(12px); }
.guide-dialog {
  position:relative;
  width:min(820px,100%);
  max-height:min(820px,92vh);
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr) auto;
  overflow:hidden;
  color:#effcff;
  background:linear-gradient(145deg,#07121b,#0b1821 65%,#1f1020);
  border:1px solid rgba(0,229,255,.38);
  box-shadow:0 35px 110px rgba(0,0,0,.72),0 0 45px rgba(0,229,255,.08);
}
.guide-header { display:flex; align-items:center; justify-content:space-between; padding:18px 20px; border-bottom:1px solid rgba(151,206,224,.18); }
.guide-header span { color:#00e5ff; font:900 8px/1 ui-monospace,monospace; letter-spacing:.18em; }
.guide-header h2 { margin-top:5px; color:#fff; font-size:24px; }
.guide-header button { width:34px; height:34px; color:#fff; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.18); font-size:22px; cursor:pointer; }
.guide-tabs { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:1px solid rgba(151,206,224,.18); }
.guide-tabs button { padding:12px 8px; color:#708895; background:#060d13; border:0; border-right:1px solid rgba(151,206,224,.12); font-weight:800; cursor:pointer; }
.guide-tabs button.is-active { color:#061016; background:#00e5ff; }
.guide-content { overflow:auto; padding:24px; scrollbar-color:#00e5ff #08131a; }
.guide-hero { display:grid; grid-template-columns:94px 1fr; gap:20px; align-items:center; }
.guide-hero-icon { width:86px; height:86px; display:grid; place-items:center; color:#071016; background:linear-gradient(135deg,#c8ff25,#00e5ff); font:1000 30px/1 ui-monospace,monospace; clip-path:polygon(10% 0,100% 0,100% 78%,78% 100%,0 100%,0 10%); }
.guide-kicker { color:#ff2ca8; font:900 9px/1 ui-monospace,monospace; letter-spacing:.15em; }
.guide-hero h3 { margin:7px 0; color:#fff; font-size:clamp(24px,4vw,38px); line-height:1.08; }
.guide-hero p { color:#a9bbc4; font-size:13px; line-height:1.75; }
.guide-actions-list { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:20px; }
.guide-action { padding:13px; background:rgba(255,255,255,.035); border:1px solid rgba(151,206,224,.16); }
.guide-action span { color:#00e5ff; font:900 10px/1 ui-monospace,monospace; }
.guide-action b { display:block; margin:7px 0 4px; font-size:13px; }
.guide-action p { color:#859aa6; font-size:10px; line-height:1.55; }
.guide-rule { margin-top:16px; padding:13px 15px; color:#cdd9de; background:rgba(255,211,79,.06); border-left:3px solid #ffd34f; font-size:12px; line-height:1.65; }
.guide-rule b { color:#ffd34f; }
.guide-term-chips { display:flex; flex-wrap:wrap; gap:7px; margin-top:16px; }
.guide-term-chips button { padding:7px 10px; color:#bdeef2; background:rgba(0,229,255,.06); border:1px solid rgba(0,229,255,.22); font-size:10px; cursor:pointer; }

.guide-word-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.guide-word-card { padding:14px; background:rgba(255,255,255,.035); border:1px solid rgba(151,206,224,.14); }
.guide-word-card h3 { color:#00e5ff; font:900 14px/1.2 ui-monospace,monospace; }
.guide-word-card b { display:block; margin:7px 0 4px; color:#fff; font-size:12px; }
.guide-word-card p { color:#91a6b1; font-size:11px; line-height:1.6; }
.guide-word-card em { display:block; margin-top:8px; color:#c8ff25; font-size:10px; font-style:normal; }

.guide-footer { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 18px; border-top:1px solid rgba(151,206,224,.18); background:#060c11; }
.guide-footer label { display:flex; align-items:center; gap:8px; color:#91a8b3; font-size:11px; cursor:pointer; }
.guide-footer input { accent-color:#00e5ff; }
.guide-footer > div { display:flex; align-items:center; gap:8px; }
.guide-footer button { min-width:72px; padding:8px 10px; color:#d9f7fa; background:rgba(255,255,255,.04); border:1px solid rgba(151,206,224,.2); cursor:pointer; }
.guide-footer #guide-next { color:#061016; background:#c8ff25; border-color:#c8ff25; font-weight:900; }
#guide-progress { color:#728b98; font:800 9px/1 ui-monospace,monospace; }

@media (max-width:720px) {
  .guide-button b { display:none; }
  .guide-button { padding:5px; }
  .mode-coach { grid-template-columns:38px 1fr; }
  .mode-coach-more { grid-column:1/-1; }
  .guide-hero { grid-template-columns:1fr; }
  .guide-hero-icon { width:64px; height:64px; }
  .guide-actions-list,.guide-word-grid { grid-template-columns:1fr; }
  .guide-footer { align-items:flex-start; flex-direction:column; }
  .guide-footer > div { width:100%; justify-content:flex-end; }
}