/* Экран «Работы» — поле колец-услуг. Кольцо --> копьё в руну -->
   из руны раскрывается кейс на весь блок. В кейсе сверху полоска проектов и возврат к кольцам. */
.mobile-project-picker{display:none!important}

/* ---------- режим колец ---------- */
.rings-mode .workbench{display:none!important}
/* без JS поле пустое и скрыто — работы показываются обычным списком релиза */
.ring-field{display:none}
.rings-mode .ring-field{display:block}
.ring-field{position:relative;height:max(600px,calc(100vh - 150px));margin:0 0 24px;border-bottom:1px solid var(--line)}
.ring-ask{position:absolute;left:0;top:22px;margin:0;font:11px/1.5 'Courier New',monospace;letter-spacing:.04em;color:var(--muted);text-transform:uppercase}
.ring-field button{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:8px;width:150px;padding:6px;background:none;border:0;text-align:center;font:14px/1.3 var(--sans);color:var(--ink);cursor:pointer}
.ring-field .ring{display:block;width:var(--s,96px);transform:rotate(var(--r,0deg));animation:bob var(--d,5s) ease-in-out var(--dl,0s) infinite}
.ring-field .ring svg{display:block;width:100%;height:auto;aspect-ratio:100/60;overflow:visible;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
@keyframes bob{50%{translate:0 -6px}}
.ring-field button:hover .ring svg{transform:translateY(-5px) rotate(-8deg)}
.ring-field button:hover{color:var(--accent)}
.ring-field button.lit,.ring-field button[aria-pressed=true]{color:var(--accent);font-weight:700}
.ring-field button.lit .ring svg,.ring-field button[aria-pressed=true] .ring svg{--front:url(#front-lit);--back:#5a3fc0;--rimf:#efeaff;--edge:#2a1878;transform:scale(1.08)}
.draupnir{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);width:var(--s);pointer-events:none}
.draupnir svg{display:block;width:100%;height:auto;aspect-ratio:100/60;overflow:visible;animation:turn 10s ease-in-out infinite}
@keyframes turn{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.86) rotate(-3deg)}}
.rune-mark{position:absolute;left:var(--x);top:var(--y);width:var(--rs);height:calc(var(--rs) * 1.3);transform:translate(-50%,-62%);overflow:visible;pointer-events:none}
.rune-mark path{fill:none;stroke:var(--accent);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.rune-mark.flash path{animation:runeflash .5s ease}
@keyframes runeflash{40%{stroke:#fff;filter:drop-shadow(0 0 8px #5839ce)}}

/* кольцо в стиле сайта: бумага, тонкая линия цвета текста, мягкая лавандовая тень, гравировка рунами */
.ring-art{--band:url(#band);--edge:#262322;--wall:#cfc6e3}
.ring-art .rim{fill:#d8d0e6;stroke:var(--edge);stroke-width:.9}
.ring-art .top{fill:var(--band);stroke:var(--edge);stroke-width:1.1}
.ring-art .wall{fill:var(--wall);stroke:var(--edge);stroke-width:.7}
.ring-art .gleam{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;opacity:.9}
.ring-art .engrave{fill:none;stroke:var(--edge);stroke-width:.8;stroke-linecap:round;opacity:.55}

/* ---------- режим кейса ---------- */
.case-mode .workbench{display:block!important}
.case-bar{display:none}
.case-mode .case-bar{display:flex;align-items:stretch;border-bottom:1px solid var(--line);margin:0 0 30px}
.case-back{display:flex;align-items:center;gap:8px;padding:0 18px 0 0;margin-right:6px;border:0;border-right:1px solid var(--line);background:none;cursor:pointer;color:var(--ink);font-size:20px;min-height:58px}
.case-back svg{width:40px;aspect-ratio:100/60;overflow:visible}
.case-back:hover{color:var(--accent)}
.case-mode .project-rail{display:flex!important;flex-direction:row!important;border-top:0!important;overflow-x:auto;scrollbar-width:none;margin:0!important;gap:0!important}
.case-mode .project-rail>a{flex:none;border-bottom:2px solid transparent!important;padding:14px 16px!important;min-height:58px!important;align-items:center!important;gap:8px!important}
.case-mode .project-rail>a[aria-current=true]{border-bottom-color:var(--accent)!important;background:none!important}
.case-mode .project-rail small,.case-mode .project-rail .rail-arrow,.case-mode .project-rail>p{display:none!important}
.case-mode .project-rail .rail-number{padding:0!important}

.spear-layer{pointer-events:none;z-index:60;overflow:visible}
.spear-layer .shaft{stroke:#262322;stroke-width:3;stroke-linecap:round}
.spear-layer .butt{fill:#262322}
.spear-layer .band{stroke:#262322;stroke-width:2;stroke-linecap:round}
.spear-layer .blade{fill:var(--accent);stroke:#3b2394;stroke-width:.8}
.spear-layer .ridge{stroke:#fff;stroke-width:.9;opacity:.65}
.spear-layer .trail{fill:none;stroke:url(#trail-g);stroke-width:3;stroke-linecap:round}
.spear-layer .burst line{stroke:var(--accent);stroke-width:1.6;stroke-linecap:round}

@media (max-width:760px){
  .ring-field{height:max(640px,calc(100vh - 170px))}
  .ring-field button{left:var(--mx);top:var(--my);width:118px;font-size:12px;gap:5px}
  .ring-field .ring{width:var(--ms,66px)}
  .draupnir,.rune-mark{left:var(--mx);top:var(--my)}
  .draupnir{width:var(--ms)}
  .rune-mark{width:var(--mrs);height:calc(var(--mrs) * 1.3)}
  .case-back{padding-right:12px}
  .case-mode .project-rail{-webkit-mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent);mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent)}
}
@media (prefers-reduced-motion:reduce){.ring-field .ring,.draupnir svg{animation:none}}