/* Глава «Девичья башня»: ночное море, латунь маяка, лоция смотрителя. Все селекторы с префиксом md-. */

/* ---------- лоция Хранителя ---------- */
.md-doc { position: relative; font-family: Georgia, "Times New Roman", serif; color: #3a2614; font-variant-numeric: lining-nums; }
.as-keeper .panel[data-type^="md_"] .pbody {
  background:
    radial-gradient(120% 80% at 50% 0%, #fbf1da 0%, transparent 70%),
    repeating-linear-gradient(0deg, #00000006 0 1px, transparent 1px 4px),
    linear-gradient(#f2e3c2, #e3cfa4);
  border-color: #b99a62;
  box-shadow: inset 0 0 0 6px #f6ead0, inset 0 0 0 7px #a88a55, inset 0 0 40px #8a5a2a33, 0 8px 22px #0006;
}
.md-doc-head { display: flex; flex-direction: column; align-items: center; gap: 2px; margin: -2px 0 12px; }
.md-doc-head h4 { margin: 0; font: italic 600 17px Georgia, serif; color: #5a3416; letter-spacing: .02em; text-align: center; }
.md-doc-head::after { content: ""; width: 70%; height: 5px; border-top: 1px solid #8a6a3a; border-bottom: 1px solid #8a6a3a; margin-top: 4px; }
.md-engr { width: 120px; height: 28px; fill: none; stroke: #6a4a24; stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.md-doc .lead { font-weight: 600; }
.md-rules { margin: 0 0 12px; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }
.md-note { font-style: italic; color: #6a4a2a; }
.md-tbl th, .md-tbl td { border-color: #a88a55; }
.md-tbl th { background: #e8d4a8; }
.md-tbl .pulses { color: #3a2614; }
.md-stamp { position: relative; margin: 6px -2px -4px auto; width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center;
  color: #a3261c; border: 3px double #a3261c; transform: rotate(-14deg); opacity: .85; animation: md-stamp .5s cubic-bezier(.3,1.6,.6,1) both; pointer-events: none; }
.md-stamp .ic { width: 36px; height: 36px; }
@keyframes md-stamp { from { transform: rotate(-14deg) scale(2.4); opacity: 0; } to { transform: rotate(-14deg) scale(1); opacity: .85; } }
.md-doc.md-k-err { animation: md-kerr .5s; }
@keyframes md-kerr { 20% { transform: rotate(-.8deg) translateX(-4px); } 50% { transform: rotate(.6deg) translateX(3px); } 80% { transform: translateX(-1px); } }
.md-doc.md-k-err::after { content: ""; position: absolute; left: 30%; top: 40%; width: 60px; height: 44px; border-radius: 48% 52% 40% 60%; background: #2a1a0c; opacity: 0; animation: md-blot 1.2s; pointer-events: none; }
@keyframes md-blot { 10% { opacity: .55; transform: scale(1.1); } 100% { opacity: 0; transform: scale(.6); } }

/* ---------- корабль ---------- */
.md-ship { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.md-sea { width: 100%; border-radius: 12px; display: block; box-shadow: inset 0 0 0 2px #0006, 0 0 0 1.5px #5a4630; }
.md-twinkle { animation: md-tw 3.2s ease-in-out infinite; }
@keyframes md-tw { 50% { opacity: .25; } }
.md-hw { animation: md-tw 5s ease-in-out infinite; }
.md-wave { animation: md-wave 7s linear infinite; }
.md-wave.w2 { animation-duration: 9s; animation-direction: reverse; }
.md-wave.w3 { animation-duration: 11s; }
@keyframes md-wave { to { transform: translateX(36px); } }
.md-bob { animation: md-bob 3.4s ease-in-out infinite; transform-box: view-box; transform-origin: 220px 125px; }
@keyframes md-bob { 0%, 100% { transform: translateY(0) rotate(-1.2deg); } 50% { transform: translateY(3px) rotate(1.4deg); } }
.md-sl { opacity: .38; transition: opacity .06s; overflow: visible; }
.md-slglow, .md-refl { opacity: 0; transition: opacity .06s; }
.md-shipg.md-on .md-sl { opacity: 1; }
.md-shipg.md-on .md-slglow { opacity: 1; }
.md-shipg.md-on .md-refl { opacity: .35; }
.md-shipg { transform-box: view-box; transition: transform 4s ease-in, opacity 4s; }
.md-gone .md-shipg { transform: translateX(150px) scale(.7); opacity: 0; }
.md-beam, .md-mylamp { opacity: 0; }
.md-mylamp { fill: #fff2b0; }
.md-beam.md-on, .md-mylamp.md-on { animation: md-beamf .5s ease-out; }
@keyframes md-beamf { 0% { opacity: 0; } 8%, 80% { opacity: 1; } 100% { opacity: 0; } }
.md-gone .md-beam { opacity: .5; animation: none; }
.md-gone .md-mylamp { opacity: 1; }
.md-ship.md-err .md-sea { animation: md-redflash .6s; }
@keyframes md-redflash { 30% { box-shadow: inset 0 0 0 3px #ff5a4a, 0 0 22px #ff5a4a; filter: saturate(1.4) brightness(.8); } }
.md-slots { display: flex; gap: 8px; width: 100%; max-width: 340px; }
.md-slot { flex: 1; height: 52px; border-radius: 10px; display: grid; place-items: center; color: #ffe9a8; background: #10161f; box-shadow: inset 0 0 0 1.5px #3c5470; }
.md-slot .pulses i { height: 13px; border-radius: 7px; }
.md-slot .ps { width: 13px; }
.md-slot .pl { width: 40px; }
/* итог модуля: управление убрано, остаётся то, что получилось */
.md-ship > .md-ctl, .md-lensbox > .md-ctl, .md-horn > div.md-ctl { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.md-ship > .md-ctl > .row { width: 100%; }
.md-gone .md-ctl, .md-done .md-ctl { display: none !important; }
.md-gone .md-slot { background: #2a2010; color: #fff2b0; box-shadow: inset 0 0 0 2px #e6c675, 0 0 12px #ffd25a66; }
.md-slot.md-new { animation: md-pop .3s; }
@keyframes md-pop { from { transform: scale(1.3); box-shadow: inset 0 0 0 2px #ffe9a8, 0 0 14px #ffd25a; } }
.btn.md-flash { flex-direction: column; gap: 6px; min-height: 72px; }
.btn.md-flash .pulses i { height: 12px; }
.btn.md-flash .ps { width: 12px; }
.btn.md-flash .pl { width: 38px; }

/* ---------- линза ---------- */
.md-lensbox { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.md-lenswrap { width: 100%; max-width: 280px; }
.md-lens { width: 100%; display: block; overflow: visible; }
.md-ring { transform-box: view-box; transform-origin: 120px 120px; transition: transform .45s cubic-bezier(.3,1.3,.5,1); }
.md-up { transform-box: view-box; transition: transform .45s cubic-bezier(.3,1.3,.5,1); }
.md-glass { fill: none; stroke: #2b4a5e; }
.md-ring.r1 .md-glass { stroke: #335a70; }
.md-ring.r2 .md-glass { stroke: #3c6a80; }
.md-prism { fill: none; stroke: #9cc7d8; stroke-opacity: .25; stroke-width: 1; }
.md-ribs path { stroke: #c9a24a; stroke-width: 1.6; }
.md-rsym { color: #f4ead6; }
.md-core { opacity: .55; transition: opacity .6s; }
.md-flame { transform-box: fill-box; transform-origin: 50% 100%; animation: md-flick .9s ease-in-out infinite alternate; opacity: .7; }
@keyframes md-flick { from { transform: scale(.92, .86) skewX(-3deg); } to { transform: scale(1.04, 1.08) skewX(3deg); } }
.md-window { fill: #ffe9a8; fill-opacity: .12; }
.md-rays { opacity: 0; transform-box: view-box; transform-origin: 120px 120px; }
.md-lens.md-lit .md-rays { opacity: .75; animation: md-spin 14s linear infinite; }
.md-lens.md-lit .md-core { opacity: 1; filter: drop-shadow(0 0 12px #ffd25a); }
.md-lens.md-lit .md-glass { stroke: #6aa7bd; }
.md-lens.md-lit .md-rsym { color: #fff6cf; }
@keyframes md-spin { to { transform: rotate(360deg); } }
.md-lens.md-err { animation: md-sputter .7s; }
@keyframes md-sputter { 10%, 50% { filter: brightness(.35) sepia(1) hue-rotate(-40deg) saturate(3); } 30%, 70% { filter: brightness(1.3); } }
.md-lens.md-ignite { animation: md-ign 1.4s ease-out; }
@keyframes md-ign { 0% { filter: brightness(1); } 25% { filter: brightness(2.2) drop-shadow(0 0 30px #ffe9a8); } 100% { filter: brightness(1); } }
.md-rrows { width: 100%; display: flex; flex-direction: column; gap: 8px; }
.md-rrow { display: flex; align-items: center; gap: 10px; }
.md-rrow .md-rname { flex: 1; color: var(--muted); font-size: 14px; }
.md-rrow .btn.round { width: 52px; height: 52px; font-size: 24px; }
.md-rglyph { width: 32px; height: 32px; flex: none; }
.md-rglyph circle { stroke: #8a7656; }
.md-rglyph circle.on { stroke: var(--brass2); }
.md-lightbtn { width: 100%; }
.md-tonight { display: flex; align-items: center; gap: 12px; font-weight: 700; padding: 8px 12px; margin-bottom: 12px; background: #fff6e2; border: 2px dashed #a88a55; border-radius: 12px; }
.md-skybig { color: #1f3a5e; }
.md-lenstbl td { padding: 4px 2px; }
.md-lenstbl th.md-cur { background: #f3dfae; box-shadow: inset 0 -3px 0 #a3261c; }
.md-trip { display: flex; flex-direction: column; align-items: center; gap: 1px; }
.md-tk { display: inline-flex; align-items: center; gap: 1px; }
.md-tk .md-rglyph { width: 14px; height: 14px; }
.md-tk .md-rglyph circle { stroke: #b0956a; }
.md-tk .md-rglyph circle.on { stroke: #3a2614; }
.md-tk .ic { width: 22px; height: 22px; }

/* ---------- горн ---------- */
.md-horn { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.md-hornrow { width: 100%; display: flex; align-items: center; gap: 10px; }
.md-hornart { width: 38%; max-width: 150px; flex: none; overflow: visible; }
.md-sr { opacity: 0; }
.md-hornart.md-blow .md-sr { animation: md-ring var(--blast, .5s) ease-out; }
.md-hornart.md-blow .md-sr.b { animation-delay: .08s; }
.md-hornart.md-blow .md-sr.c { animation-delay: .16s; }
@keyframes md-ring { 0% { opacity: 0; transform: translateX(-6px); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateX(8px); } }
.md-fog ellipse { opacity: .12; animation: md-fog 6s ease-in-out infinite alternate; }
.md-fog ellipse + ellipse { animation-duration: 8s; }
@keyframes md-fog { to { transform: translateX(14px); opacity: .32; } }
.md-strip { flex: 1; background: #f1e6cc; border-radius: 10px; padding: 4px; box-shadow: inset 0 0 0 1.5px #a88a55, 0 2px 6px #0006; }
.md-strip svg { display: block; width: 100%; }
.md-lane { stroke: #b7a07a; stroke-width: 1; stroke-dasharray: 3 3; }
.md-lane.l0 { stroke: #8a6a3a; }
.md-band { fill: transparent; }
.md-band.b1 { fill: #8a6a3a; fill-opacity: .12; }
.md-tick { fill: #8a6a3a; }
.md-nb { fill: #3a2614; }
.md-nb.md-play { transform-box: fill-box; transform-origin: 0 50%; animation: md-draw .35s ease-out both; }
@keyframes md-draw { from { transform: scaleX(0); opacity: .3; } }
.md-played { width: 100%; max-width: 340px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.md-pslot { height: 78px; border-radius: 10px; background: #f1e6cc; box-shadow: inset 0 0 0 1.5px #a88a55; display: grid; place-items: center; padding: 4px; }
.md-pslot svg { width: 100%; height: 100%; display: block; }
.md-pslot .md-nb { fill: #2a1a0c; }
.md-pslot.empty { background: #241b13; box-shadow: inset 0 0 0 1.5px #4a3a2a; }
.md-pslot.md-new { animation: md-pop .3s; }
.md-horn.md-done .md-pslot { box-shadow: inset 0 0 0 2px #e6c675, 0 0 14px #ffd25a66; }
.md-lensbox.md-done .md-lenswrap { width: 82%; max-width: 300px; margin: 14px 0 4px; }
.md-boat.md-done .md-board { box-shadow: inset 0 0 0 2px #e6c675, 0 0 22px #ffd25a77; }
.md-levers { width: 100%; display: grid; grid-template-columns: 1.3fr 1.1fr .9fr; gap: 10px; align-items: end; }
.md-lever { position: relative; height: 190px; border: 0; padding: 0; background: linear-gradient(#2a2119, #1d1610); border-radius: 14px; cursor: pointer; touch-action: none;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; box-shadow: inset 0 0 0 1.5px #4a3a2a; overflow: hidden; }
.md-lever.p1 { height: 170px; }
.md-lever.p2 { height: 150px; }
.md-lslot { position: absolute; left: 50%; top: 14px; bottom: 44px; width: 10px; margin-left: -5px; border-radius: 5px; background: #0d0907; box-shadow: inset 0 2px 4px #000; }
.md-lhandle { position: absolute; left: 50%; top: 8px; width: 46px; margin-left: -23px; height: 30px; transition: transform .18s cubic-bezier(.3,1.4,.6,1); }
.md-lever.p0 .md-lhandle { width: 56px; margin-left: -28px; }
.md-lever.p2 .md-lhandle { width: 38px; margin-left: -19px; }
.md-lknob { position: absolute; inset: 0; border-radius: 14px; background: linear-gradient(#f3dc9b, #b48a35 60%, #6d501b); box-shadow: 0 4px 8px #0008; }
.md-lever.md-pull .md-lhandle { transform: translateY(calc(var(--pull, 90px))); }
.md-lever.p1 { --pull: 74px; }
.md-lever.p2 { --pull: 58px; }
.md-lfill { position: absolute; right: 8px; top: 14px; bottom: 44px; width: 6px; border-radius: 3px; background: #3a2c1f; overflow: hidden; }
.md-lfill i { position: absolute; inset: 0; background: #e6c675; transform: scaleY(0); transform-origin: 50% 100%; }
.md-lever.md-long .md-lfill i { background: #ffb43a; box-shadow: 0 0 8px #ffb43a; }
.md-lmark { position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: center; color: #8a7656; }
.md-lever.md-pull .md-lmark { color: var(--brass2); }
.md-lever.md-long .md-lmark { color: #ffb43a; }
.md-lever:disabled { cursor: default; filter: grayscale(.6) brightness(.7); }
.md-hint { margin: -4px 0 0; color: var(--muted); font-size: 14px; text-align: center; }
.md-horn.md-err .md-strip { animation: md-redflash .6s; }
.md-horn.md-clearfog .md-fog ellipse { animation: md-fogaway 1.6s forwards; }
@keyframes md-fogaway { to { opacity: 0; transform: translateX(60px); } }
.md-horn.md-done .md-fog { display: none; }
.md-songs { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.md-song { display: flex; align-items: center; gap: 6px; }
.md-song b { width: 18px; text-align: center; font: 700 16px Georgia, serif; color: #6a4a24; }
.md-song svg { flex: 1; display: block; border-bottom: 1px dotted #a88a55; }
.md-callbg { fill: #c9a24a; fill-opacity: .28; }
.md-legend { display: flex; justify-content: center; gap: 18px; margin-bottom: 8px; }
.md-leg { display: flex; align-items: flex-end; gap: 4px; }
.md-leg svg { width: 30px; height: 44px; }
.md-legl { width: 16px; border-radius: 4px; background: linear-gradient(#e6c675, #8a6a2a); box-shadow: inset 0 0 0 1px #5a4020; }
.md-legl.p0 { height: 40px; width: 20px; }
.md-legl.p1 { height: 32px; }
.md-legl.p2 { height: 24px; width: 12px; }

/* ---------- лодка ---------- */
.md-boat { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.md-boardwrap { position: relative; width: 100%; max-width: 300px; }
.md-board { width: 100%; display: block; border-radius: 12px; box-shadow: inset 0 0 0 2px #0006, 0 0 0 1.5px #5a4630; }
.md-compass { position: absolute; right: 6px; top: 6px; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: #0008; color: #e6c675; }
.md-compass .ic { width: 24px; height: 24px; }
.md-cell { fill: #17405f; stroke: #0e2c45; stroke-width: 1; }
.md-ripple { fill: none; stroke: #4f86b5; stroke-width: 1.4; stroke-linecap: round; opacity: .55; animation: md-rip 4s ease-in-out infinite; }
@keyframes md-rip { 50% { opacity: .2; transform: translateX(4px); } }
.md-shore rect { fill: #6c5a3e; }
.md-shore path { fill: none; stroke: #4a7a3a; stroke-width: 3; stroke-linecap: round; }
.md-flow { fill: none; stroke: #9fd3f2; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 8 10; animation: md-flow .9s linear infinite; opacity: .8; }
@keyframes md-flow { to { stroke-dashoffset: 18; } }
.md-arrow { fill: none; stroke: #e8f6ff; stroke-width: 4.5; stroke-linecap: round; stroke-linejoin: round; }
.md-foam { fill: none; stroke: #e8f6ff; stroke-width: 2; stroke-dasharray: 5 7; opacity: .6; transform-box: fill-box; transform-origin: center; animation: md-foam 3s ease-in-out infinite; }
@keyframes md-foam { 50% { transform: scale(1.08) rotate(20deg); opacity: .3; } }
.md-pierlamp { animation: md-tw 2.4s ease-in-out infinite; }
.md-jetty { fill: none; stroke: #c9a46a; stroke-width: 2.4; }
.md-boatmove { transform-box: view-box; }
.md-boatbob { transform-box: view-box; transform-origin: 135px 136px; animation: md-bob2 2.8s ease-in-out infinite; }
@keyframes md-bob2 { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg) translateY(1px); } }
.md-oar { transform-box: view-box; }
.md-oar.l { transform-origin: 127px 136px; }
.md-oar.r { transform-origin: 143px 136px; }
.md-oars.md-stroke .md-oar.l { animation: md-oarl .38s ease-in-out 2; }
.md-oars.md-stroke .md-oar.r { animation: md-oarr .38s ease-in-out 2; }
@keyframes md-oarl { 50% { transform: rotate(-28deg); } }
@keyframes md-oarr { 50% { transform: rotate(28deg); } }
.md-splash { fill: none; stroke: #fff; stroke-width: 3; opacity: 0; transform-box: view-box; transform-origin: 135px 135px; }
.md-boat.md-crash .md-splash { animation: md-splash .9s ease-out; }
@keyframes md-splash { 0% { opacity: .9; transform: scale(.4); } 100% { opacity: 0; transform: scale(2.4); } }
.md-boat.md-crash .md-board { animation: md-redflash .7s; }
.md-boat.md-crash .md-boatbob { animation: md-wreck .8s; }
@keyframes md-wreck { 0% { transform: rotate(0) scale(.3); opacity: 0; } 60% { transform: rotate(380deg) scale(1.1); opacity: 1; } 100% { transform: rotate(360deg) scale(1); } }
.md-boat.md-moor .md-board { animation: md-moor 1.4s ease-out; }
@keyframes md-moor { 30% { box-shadow: inset 0 0 0 3px #ffe9a8, 0 0 30px #ffd25a; } }
.md-pad { display: grid; grid-template-columns: repeat(3, 64px); grid-template-rows: repeat(3, 56px); gap: 6px; grid-template-areas: ". n ." "w c e" ". s ."; }
.md-pad .btn { min-height: 0; padding: 0; font-size: 22px; }
.md-pad .n { grid-area: n; }
.md-pad .w { grid-area: w; }
.md-pad .e { grid-area: e; }
.md-pad .s { grid-area: s; }
.md-padc { grid-area: c; display: grid; place-items: center; color: var(--muted); }
.md-chart { width: 100%; display: block; margin: 4px 0 12px; cursor: crosshair; border: 1.5px solid #8a6a3a; border-radius: 4px; background: #efe1bf; }
.md-kland { fill: #dcc69a; }
.md-kwater { stroke: none; }
.md-kgrid { stroke: #a88a55; stroke-width: .7; }
.md-karrow path { fill: none; stroke: #1f4a7a; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.md-krock { fill: #6a5a48; stroke: #2a1a0c; stroke-width: 1.4; }
.md-kjetty { fill: #b88a50; stroke: #4a2e14; stroke-width: 1.4; }
.md-kjetty.md-blink { animation: md-kblink .4s 4; }
@keyframes md-kblink { 50% { stroke: #a3261c; stroke-width: 4; } }
.md-ktower path { fill: #f3e7cf; stroke: #3a2614; stroke-width: 1.4; }
.md-kshore { fill: none; stroke: #6a4a24; stroke-width: 1.4; }
.md-kmark circle { fill: none; stroke: #4a4a4a; stroke-width: 2; stroke-dasharray: 3 2; }
.md-kmark path { fill: none; stroke: #4a4a4a; stroke-width: 2.4; stroke-linecap: round; }
.md-krose path { fill: none; stroke: #3a2614; stroke-width: 1.2; }
.md-krose path.f { fill: #3a2614; }

/* ---------- сцена победы ---------- */
.md-win { width: 100%; display: block; border-radius: 12px; margin-bottom: 12px; }
.mdw-stars circle { animation: md-tw 2.6s ease-in-out infinite; }
.mdw-wins rect { opacity: 0; animation: md-winon .6s forwards; }
@keyframes md-winon { to { opacity: .85; } }
.mdw-lamp { opacity: 0; animation: md-lampon .5s .5s forwards; }
.mdw-halo { opacity: 0; transform-box: fill-box; transform-origin: center; animation: md-lampon .8s .6s forwards, md-halo 2s 1.4s ease-in-out infinite alternate; }
@keyframes md-lampon { to { opacity: 1; } }
@keyframes md-halo { to { transform: scale(1.25); } }
.mdw-beam { opacity: 0; transform-box: view-box; transform-origin: 150px 65px; animation: md-lampon .6s .9s forwards, md-sweep 6s .9s ease-in-out infinite; }
@keyframes md-sweep { 0% { transform: scaleX(1) rotate(-10deg); } 25% { transform: scaleX(.15) rotate(0); } 50% { transform: scaleX(-1) rotate(10deg); } 75% { transform: scaleX(-.15) rotate(0); } 100% { transform: scaleX(1) rotate(-10deg); } }
.mdw-glint { opacity: 0; animation: md-lampon 1s 1.2s forwards, md-tw 2s 2.2s ease-in-out infinite; }
.mdw-sea path { animation: md-wave 6s linear infinite; }
.mdw-sea path + path { animation-duration: 9s; animation-direction: reverse; }

@media (min-width: 900px) {
  .md-levers .md-lever { height: 170px; }
  .md-levers .md-lever.p1 { height: 150px; }
  .md-levers .md-lever.p2 { height: 130px; }
}