/* SMK Tool — Unified Workspace.
   Historical patch layers are consolidated in ORIGINAL load order.
   Edit styles here instead of creating additional workspace-polish-NN.css files.
*/

/* ===== workspace-fixes.css (preserved order) ===== */
/* SMK Tool 0.7.1 · Workspace polish · 2026-10-21
   Fixes: hidden dev access, consistent transitions, single glass layer,
   in-page About/Radio/Routes, 8-icon mobile navigation. No calculation logic changes. */
@media screen {
  .smk-unified-app .smk-home-brandname[role="button"] {cursor:pointer;}
  .smk-unified-app .smk-home-brandname[role="button"]:focus-visible,
  .smk-unified-app #smkHomeBrandVersion:focus-visible {outline:2px solid #c6a9ff;outline-offset:4px;}
  .smk-unified-app #smkHomeBrandVersion {
    display:inline-flex!important;align-items:center;width:auto!important;height:auto!important;
    border:0!important;background:none!important;box-shadow:none!important;
    padding:3px 2px!important;cursor:pointer!important;text-align:left;
    -webkit-text-fill-color:#a6a0bf;color:#a6a0bf!important;letter-spacing:.4px!important;
    font-size:11px!important;font-weight:750!important;
  }
  .smk-unified-app #smkHomeBrandVersion:hover {color:#d5c0ff!important;-webkit-text-fill-color:#d5c0ff!important;}
  .smk-unified-app .smk-home-navitem--utility {margin-top:18px;border-top:1px solid rgba(185,166,224,.14)!important;border-radius:11px;}
  .smk-unified-app .smk-home-navitem--utility .svg-icon{color:#e7adc5;}
  .smk-unified-app .smk-home-navitem--utility:hover{background:rgba(227,136,168,.08)!important;}
  .smk-unified-app .smk-home-sidebar-bottom{display:none!important;}
  .smk-unified-app .smk-home-brandcaption{margin-top:4px;}
  .smk-unified-app #smkActiveRoute{display:none!important;}
  .smk-unified-app .smk-unified-head{margin-bottom:21px;}
  /* One main glass plane: nested legacy shells turn into transparent content. */
  .smk-unified-app #smkCalculatorMount .next-main,
  .smk-unified-app #smkCalculatorMount .next-layout > .next-main,
  .smk-unified-app #smkCalculatorMount .next-layout.smk-wide > .next-main {
    border:0!important;border-radius:0!important;
    background:transparent!important;box-shadow:none!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    padding:0!important;
  }
  .smk-unified-app #smkHistoryMount .history-dialog,
  .smk-unified-app #smkAboutMount .about-card,
  .smk-unified-app #smkTraceMount #gameModal .trace-shell {
    border:0!important;border-radius:0!important;
    background:transparent!important;box-shadow:none!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    padding-left:0!important;padding-right:0!important;
  }
  /* About title, intro, and version are already in the workspace header. */
  .smk-unified-app #smkAboutMount .about-modal-header{display:none!important;}
  .smk-unified-app #smkAboutMount .about-modal-content{padding:0!important;margin:0!important;}
  .smk-unified-app #smkAboutMount .about-version-row {margin-top:0!important;}
  .smk-unified-app #smkRadioMount #radioModal,
  .smk-unified-app #smkRadioMount #radioModal.active{
    padding:8px 0!important;background:transparent!important;border:0!important;
    box-shadow:none!important;filter:none!important;
  }
  /* Player remains a single, intentionally visible glass card. */
  .smk-unified-app #smkRadioMount #radioModal > .custom-alert-card {
    box-shadow:0 12px 45px rgba(0,0,0,.12)!important;
  }
  /* Existing page animations were disabled as a workaround; restore consistently. */
  .smk-unified-app .smk-page:not([hidden]){animation:none!important;opacity:1;transform:none;filter:none;visibility:visible;}
  .smk-unified-app .smk-page:not([hidden]).smk-entering{
    animation:smkWorkspaceSlideIn .40s cubic-bezier(.20,.78,.22,1) both!important;
  }
  @keyframes smkWorkspaceSlideIn {
    0%{opacity:0;transform:translate3d(0,13px,0);filter:blur(3px);}
    100%{opacity:1;transform:translate3d(0,0,0);filter:blur(0);}
  }
  .smk-unified-app .smk-home-navitem{transition:background-color .23s ease,border-color .23s ease,color .23s ease,transform .23s ease!important;}
}
@media screen and (max-width:900px) {
  /* Two rows of compact, reachable navigation — no horizontal scroll bar. */
  .smk-unified-app .smk-home-shell{display:block!important;padding:9px 9px 28px!important;}
  .smk-unified-app .smk-home-sidebar{position:relative!important;top:auto!important;
    padding:13px 12px 12px!important;margin-bottom:12px!important;
    border-radius:19px!important;min-height:0!important;overflow:visible!important;}
  .smk-unified-app .smk-home-brand{padding:0 3px 11px!important;gap:9px!important;}
  .smk-unified-app .smk-home-brandmark{width:34px;height:34px;border-radius:10px;}
  .smk-unified-app .smk-home-brandname{font-size:20px!important;}
  .smk-unified-app .smk-home-sidebar .smk-home-nav{
    display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:5px!important;overflow:visible!important;padding:0!important;margin:0!important;
  }
  .smk-unified-app button.smk-home-navitem{
    padding:8px 3px 7px!important;min-width:0!important;width:100%!important;min-height:56px!important;
    display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
    gap:5px!important;border-radius:12px!important;text-align:center!important;
    white-space:normal!important;transform:none!important;
    font-size:0!important;line-height:1.2!important;
  }
  .smk-unified-app .smk-home-navitem .svg-icon{width:18px!important;height:18px!important;}
  .smk-unified-app .smk-home-navitem span[data-mobile]{display:block!important;width:100%!important;
    font-size:0!important;line-height:1.25!important;white-space:normal!important;
  }
  .smk-unified-app .smk-home-navitem span[data-mobile]::after{
    content:attr(data-mobile);font-size:10px!important;font-weight:730!important;
    -webkit-text-fill-color:currentColor;
  }
  .smk-unified-app .smk-home-navitem--utility{margin-top:0!important;border-top:1px solid transparent!important;}
  .smk-unified-app .smk-home-content{min-height:65dvh!important;padding:19px 14px 25px!important;}
  .smk-unified-app .smk-unified-head{margin-bottom:17px!important;padding-bottom:14px!important;}
  .smk-unified-app #smkCalculatorMount .next-main{padding:0!important;}
  .smk-unified-app #smkCalculatorMount #stepsContainer{padding:0!important;}
}
@media screen and (max-width:420px){
 .smk-unified-app .smk-home-shell{padding-left:6px!important;padding-right:6px!important;}
 .smk-unified-app .smk-home-sidebar{padding-left:9px!important;padding-right:9px!important;}
 .smk-unified-app .smk-home-content{padding-left:12px!important;padding-right:12px!important;}
 .smk-unified-app .smk-home-navitem span[data-mobile]::after{font-size:9px!important;}
 .smk-unified-app .smk-unified-stats{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (prefers-reduced-motion:reduce){
 .smk-unified-app .smk-page.smk-entering{animation:none!important;}
 .smk-unified-app .smk-home-navitem{transition:none!important;}
}
@media print {
 .smk-unified-app #smkCalculatorMount .next-main{border:0!important;background:transparent!important;box-shadow:none!important;}
}

/* ===== workspace-polish.css (preserved order) ===== */
/* SMK Tool 0.7.1 — Unified Workspace polish, iteration 04.
   Presentation only; calculator, history storage and player logic unchanged. */
.smk-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.smk-mobile-more{display:none;}
@media screen {
 /* All pages participate in a single consistent reveal, including revisits. */
 .smk-unified-app .smk-page.smk-entering:not([hidden]){
   animation:smkWorkViewIn .44s cubic-bezier(.18,.8,.22,1) both!important;
   transform-origin:50% 0;
 }
 @keyframes smkWorkViewIn{from{opacity:0;transform:translate3d(0,15px,0) scale(.993);filter:blur(2.5px)}to{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}}
 .smk-unified-app .smk-home-content{background:linear-gradient(150deg,rgba(27,22,41,.82),rgba(10,10,21,.79))!important;}
 /* Recent calculation: a navigable archive preview, not a bare empty glass sheet. */
 .smk-unified-app .smk-unified-recent{overflow:hidden;padding:23px 23px 19px;background:radial-gradient(ellipse at 100% 0%,rgba(151,101,209,.13),transparent 58%),linear-gradient(150deg,rgba(48,38,69,.40),rgba(11,10,23,.56))!important;border:1px solid rgba(189,160,239,.21)!important;}
 .smk-unified-app .smk-unified-recent::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(#c0a0ff,#76c8dd);opacity:.75;}
 .smk-home-recent-kicker{display:block;color:#a894cb;letter-spacing:1.3px;font-size:9px;font-weight:800;}
 .smk-home-recent-heading h2{margin-top:6px!important;font-size:19px!important;}
 .smk-home-recent-icon{width:41px;height:41px;display:grid;place-items:center;border:1px solid rgba(189,155,250,.24);border-radius:12px;background:rgba(126,93,190,.13);color:#c7aaf6;}
 .smk-home-recent-icon .svg-icon{width:19px;height:19px;}
 .smk-home-recent-title-row{display:flex;align-items:center;gap:11px;margin-bottom:9px;}
 .smk-home-recent-route-icon{width:33px;height:33px;display:grid;place-items:center;flex-shrink:0;font-size:18px;border-radius:10px;color:#dac7ff;background:rgba(168,135,222,.15);border:1px solid rgba(205,165,243,.21);}
 .smk-home-recent-entry .smk-home-recent-title-row strong{margin:0!important;font-size:24px!important;}
 .smk-home-recent-entry time{display:block;padding-left:44px;font-size:12px;}
 .smk-unified-recent .smk-home-recent-summary{margin-top:21px;min-height:47px;padding:11px 13px;border-radius:12px;background:rgba(4,4,14,.27);border-color:rgba(190,162,228,.16);}
 .smk-unified-recent .smk-home-recent-summary span{font-size:11px;}
 .smk-unified-recent .smk-home-recent-summary b{font-size:14px;color:#eee4ff;}
 .smk-unified-recent .smk-home-recent-open{margin-top:13px;padding:11px 13px!important;display:flex;gap:10px;align-items:center;border:1px solid rgba(192,159,253,.25)!important;border-radius:12px;background:rgba(135,101,205,.12)!important;color:#e2d3ff!important;transition:transform .22s ease,background .22s ease,border-color .22s ease!important;}
 .smk-unified-recent .smk-home-recent-open:hover{background:rgba(150,115,222,.24)!important;border-color:rgba(202,169,255,.56)!important;transform:translateY(-2px);}
 /* History: no nested page header, no second tinted glass; same glass as other pages. */
 .smk-unified-app #smkHistoryMount .history-dialog{background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
 .smk-unified-app #smkHistoryMount .history-head{padding:0 2px 11px!important;border:0!important;background:none!important;}
 .smk-unified-app #smkHistoryMount .history-head #historyCount{color:#ae9cbf;font-size:12px;line-height:1.4;}
 .smk-unified-app #smkHistoryMount .history-tools{padding:11px 0 15px!important;}
 .smk-unified-app #smkHistoryMount .history-list{padding-left:0!important;padding-right:0!important;}
 .smk-unified-app #smkHistoryMount .history-status{padding-left:0!important;padding-right:0!important;}
 .smk-unified-app #smkHistoryMount .history-footer{padding-left:0!important;padding-right:0!important;}
 /* Match the route-search field precisely, including focus, clear and entrance. */
 .smk-unified-app #smkHistoryMount .history-search.next-search{height:55px;min-height:55px;border:1px solid rgba(139,123,184,.28)!important;background:rgba(7,7,19,.46)!important;border-radius:17px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)!important;padding:0!important;gap:0!important;transition:border-color .25s ease,background .25s ease,box-shadow .25s ease,transform .25s ease!important;animation:smkHistorySearchIn .42s ease-out both;}
 @keyframes smkHistorySearchIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
 .smk-unified-app #smkHistoryMount .history-search.next-search:hover{border-color:rgba(183,157,231,.46)!important;background:rgba(16,13,31,.6)!important;}
 .smk-unified-app #smkHistoryMount .history-search.next-search:focus-within{border-color:#a995fa!important;box-shadow:0 0 0 3px rgba(163,127,246,.14),0 0 26px rgba(143,107,224,.11)!important;}
 .smk-unified-app #smkHistoryMount .history-search.next-search svg{width:19px;height:19px;min-width:19px;margin:0 0 0 17px!important;color:#9d99ca;}
 .smk-unified-app #smkHistoryMount .history-search.next-search input{flex:1;min-width:0;width:100%;height:100%;margin:0;border:0!important;background:none!important;box-shadow:none!important;outline:0!important;color:#f2edfa!important;padding:0 13px!important;font-size:14px!important;}
 .smk-unified-app #smkHistoryMount .history-search.next-search input::placeholder{color:#8b839f!important;}
 .smk-unified-app #smkHistoryMount .history-search.next-search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;}
 .smk-unified-app #smkHistoryMount .smk-history-clear{padding:5px 15px;height:100%;border:0;background:none;color:#b7a4d6;font-size:20px;opacity:1;transition:opacity .18s,transform .18s;cursor:pointer;}
 .smk-unified-app #smkHistoryMount #historySearch:placeholder-shown + .smk-history-clear{opacity:0;pointer-events:none;transform:scale(.7);}
 .smk-unified-app #smkHistoryMount .smk-history-clear:hover{color:white;transform:scale(1.14);}
 .smk-unified-app #smkHistoryMount .history-item{background:linear-gradient(120deg,rgba(57,43,75,.32),rgba(12,10,24,.36))!important;border-color:rgba(205,175,234,.20)!important;transition:transform .23s ease,background .23s ease,border-color .23s ease!important;}
 .smk-unified-app #smkHistoryMount .history-item:hover{transform:translateY(-2px);background:linear-gradient(120deg,rgba(80,53,110,.39),rgba(18,13,36,.5))!important;border-color:rgba(201,171,251,.45)!important;}
 /* Radio: the app page itself is glass; the player is an integrated instrument panel. */
 .smk-unified-app #smkRadioMount #radioModal,.smk-unified-app #smkRadioMount #radioModal.active{padding:12px 0 24px!important;background:none!important;box-shadow:none!important;border:0!important;backdrop-filter:none!important;}
 .smk-unified-app #smkRadioMount #radioModal>.custom-alert-card{
   width:min(530px,100%)!important;max-width:530px!important;min-height:390px!important;
   padding:36px clamp(20px,5vw,54px) 26px!important;border:0!important;box-shadow:none!important;
   background:radial-gradient(ellipse at 50% 8%,rgba(151,113,230,.17),transparent 60%)!important;
   backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
   border-radius:18px!important;overflow:visible!important;transform:none!important;
 }
 .smk-unified-app #smkRadioMount #radioModal .custom-alert-title{display:none!important;}
 .smk-unified-app #smkRadioMount #radioStationName{font-size:clamp(27px,3vw,36px)!important;letter-spacing:-.6px!important;line-height:1.3!important;margin-top:18px!important;}
 .smk-unified-app #smkRadioMount #radioStationGenre{font-size:12px!important;letter-spacing:2.7px!important;margin-top:10px!important;color:#bcafd3!important;}
 .smk-unified-app #smkRadioMount #radioVis{height:72px!important;align-items:center!important;justify-content:center!important;gap:8px!important;margin:31px 0 34px!important;}
 .smk-unified-app #smkRadioMount .radio-visualizer .bar{width:8px;border-radius:5px;background:linear-gradient(#d7a7ff,#7fc5ef);box-shadow:0 0 17px rgba(172,143,255,.34);}
 .smk-unified-app #smkRadioMount .radio-control-wrap{gap:22px!important;margin-bottom:31px!important;}
 .smk-unified-app #smkRadioMount .radio-circle-btn.primary{width:73px!important;height:73px!important;border:1px solid rgba(182,161,255,.42)!important;background:linear-gradient(140deg,rgba(134,105,226,.34),rgba(71,79,158,.18))!important;box-shadow:0 0 32px rgba(161,118,236,.15),inset 0 1px rgba(255,255,255,.13)!important;}
 .smk-unified-app #smkRadioMount .radio-circle-btn.secondary{width:47px!important;height:47px!important;background:rgba(124,99,159,.13)!important;}
 .smk-unified-app #smkRadioMount .radio-vol-wrap{margin:0 auto 12px!important;max-width:420px;padding:0 6px!important;}
 /* Real dialogs keep glass, but share one coherent chrome and improved close controls. */
 body .custom-alert-overlay:not(#radioModal) .custom-alert-card,
 body #statsModal .custom-stats-card,
 body #bug-modal .next-bug-card,
 body .smk-core-dialog{
   border-radius:23px!important;border-color:rgba(212,188,239,.27)!important;
   box-shadow:0 22px 75px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.09)!important;
 }
 body .custom-alert-overlay:not(#radioModal) .custom-alert-title{padding-top:18px!important;padding-bottom:17px!important;letter-spacing:.1px!important;text-shadow:none!important;}
 body .custom-alert-overlay:not(#radioModal) .custom-alert-btn,
 body #printModal .print-select-btn {transition:background .22s ease,border-color .22s ease,transform .22s ease,box-shadow .22s ease!important;}
 body .custom-alert-overlay:not(#radioModal) .custom-alert-btn:hover,body #printModal .print-select-btn:hover{transform:translateY(-2px);}
 /* Polish 11: geometrically centered icon instead of offset font glyph.
    Stable scale on hover; calm color change rather than spinning / glowing. */
 body .next-modal-close, body .about-close-btn, body .history-close {
   position: relative !important;
   flex: 0 0 40px !important;
   display: grid !important;
   place-items: center !important;
   width: 40px !important;
   height: 40px !important;
   min-width: 40px !important;
   min-height: 40px !important;
   padding: 0 !important;
   border-radius: 12px !important;
   border: 1px solid rgba(190,158,245,.28) !important;
   background: rgba(123,98,166,.12) !important;
   color: #dac9ee !important;
   font-size: 0 !important; /* visually hides ×; aria-label is preserved */
   line-height: 0 !important;
   box-shadow: inset 0 1px rgba(255,255,255,.07) !important;
   transform: none !important;
   cursor: pointer;
   transition: background .18s ease, border-color .18s ease, color .18s ease !important;
 }
 body .next-modal-close::before, body .next-modal-close::after,
 body .about-close-btn::before, body .about-close-btn::after,
 body .history-close::before, body .history-close::after {
   content: '';
   position: absolute;
   top: 50%; left: 50%;
   width: 17px; height: 2px;
   border-radius: 1px;
   background: currentColor;
   transform-origin: center center;
   pointer-events: none;
 }
 body .next-modal-close::before, body .about-close-btn::before,
 body .history-close::before {
   transform: translate(-50%,-50%) rotate(45deg);
 }
 body .next-modal-close::after, body .about-close-btn::after,
 body .history-close::after {
   transform: translate(-50%,-50%) rotate(-45deg);
 }
 body .next-modal-close:hover, body .about-close-btn:hover,
 body .history-close:hover {
   transform: none !important;
   background: rgba(153,119,193,.22) !important;
   border-color: rgba(204,179,241,.44) !important;
   color: #f2e8ff !important;
   box-shadow: inset 0 1px rgba(255,255,255,.08) !important;
 }
 body .next-modal-close:active, body .about-close-btn:active,
 body .history-close:active {
   transform: none !important;
   background: rgba(123,98,166,.28) !important;
 }
 body .next-modal-close:focus-visible, body .about-close-btn:focus-visible,
 body .history-close:focus-visible {
   outline: 2px solid rgba(187,163,240,.82) !important;
   outline-offset: 3px !important;
 }
}
@media screen and (min-width:1101px){
 /* FLIP: the calculator's hidden original sidebar no longer controls grid width.
    Two normal cards become three on scroll; JS animates the changed geometry. */
 .smk-unified-app #smkCalculatorMount .next-layout #view-alphabetical,
 .smk-unified-app #smkCalculatorMount .next-layout #view-grouped{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important;}
 .smk-unified-app #smkCalculatorMount .next-layout.smk-three #view-alphabetical,
 .smk-unified-app #smkCalculatorMount .next-layout.smk-three #view-grouped{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important;}
}
@media screen and (max-width:900px){
 /* The first three destinations stay visible; all others open with one 'Ещё'. */
 .smk-unified-app .smk-home-sidebar .smk-home-nav{grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:stretch;gap:6px!important;}
 .smk-unified-app .smk-home-nav .smk-home-navitem[data-page="trace"],
 .smk-unified-app .smk-home-nav .smk-home-navitem[data-page="radio"],
 .smk-unified-app .smk-home-nav .smk-home-navitem[data-page="about"],
 .smk-unified-app .smk-home-nav .smk-home-navitem[data-page="updates"],
 .smk-unified-app .smk-home-nav .smk-home-navitem--utility{display:none!important;}
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem[data-page="trace"],
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem[data-page="radio"],
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem[data-page="about"],
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem[data-page="updates"],
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem--utility{display:flex!important;animation:smkMoreTabIn .3s ease both;}
 .smk-unified-app .smk-mobile-more{display:flex!important;align-items:center;flex-direction:column;justify-content:center;gap:5px;min-width:0;min-height:56px;padding:8px 3px!important;border-radius:12px;background:rgba(104,83,144,.19)!important;border:1px solid rgba(176,148,230,.22)!important;color:#cbb6eb;font-size:10px;font-weight:760;line-height:1.25;transition:background .2s,transform .2s,border-color .2s;}
 .smk-unified-app .smk-mobile-more .svg-icon{height:18px;width:18px;transition:transform .23s;}
 .smk-unified-app.smk-menu-expanded .smk-mobile-more{color:#f2e6ff;border-color:rgba(206,167,255,.57)!important;background:rgba(128,95,189,.35)!important;}
 .smk-unified-app.smk-menu-expanded .smk-mobile-more .svg-icon{transform:rotate(90deg);}
 .smk-unified-app .smk-mobile-more:hover{background:rgba(144,100,210,.33)!important;}
 @keyframes smkMoreTabIn{from{opacity:0;transform:translateY(-8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
}
@media screen and (max-width:600px){
 .smk-unified-app .smk-unified-recent{padding:18px 16px 16px;}
 .smk-unified-app #smkRadioMount #radioModal>.custom-alert-card{min-height:340px!important;padding:15px 4px 20px!important;}
 .smk-unified-app #smkRadioMount #radioModal .radio-control-wrap{gap:14px!important;}
 .smk-unified-app #smkHistoryMount .history-tools{flex-direction:column;}
 .smk-unified-app #smkHistoryMount .history-search.next-search{width:100%;}
}
@media (prefers-reduced-motion:reduce){
 .smk-unified-app .smk-page.smk-entering:not([hidden]),.smk-unified-app .smk-history-search,
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem{animation:none!important;}
}

/* ===== workspace-polish-05.css (preserved order) ===== */
/* SMK Tool · Polish 05 · focused visual and navigation corrections.
   Existing computation, history storage, audio, and TRACE physics are unchanged. */
@media screen {
  /* The launch transition now targets the REAL workspace instead of the hidden legacy layout. */
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-home-sidebar{
    animation:smkBootSidebar .82s cubic-bezier(.18,.76,.18,1) .07s backwards!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-home-content{
    animation:smkBootContent .9s cubic-bezier(.18,.78,.2,1) .20s backwards!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-hero{
    animation:smkBootContent .85s cubic-bezier(.18,.78,.2,1) .34s backwards!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-stats,
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-recent{
    animation:smkBootContent .65s cubic-bezier(.18,.78,.2,1) .46s backwards!important;
  }
  @keyframes smkBootSidebar {from{opacity:0;transform:translateX(-24px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
  @keyframes smkBootContent {from{opacity:0;transform:translateY(22px) scale(.988);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}

  /* Last saved calculation: quiet, compact, with explicit open vs archive navigation. */
  .smk-unified-app .smk-unified-recent{
    padding:21px 22px 18px!important;
    background:linear-gradient(140deg,rgba(43,34,64,.34),rgba(12,11,25,.46))!important;
    border-color:rgba(181,151,224,.22)!important;
  }
  .smk-unified-app .smk-unified-recent:before{width:2px!important;opacity:.34!important}
  .smk-unified-app .smk-home-recent-heading{margin-bottom:13px}
  .smk-unified-app .smk-home-recent-title-row strong{font-size:22px!important}
  .smk-unified-app .smk-home-recent-entry time{padding-left:44px;color:#a9a2bc}
  .smk-unified-app .smk-home-recent-summary{margin-top:15px!important}
  .smk-unified-app .smk-recent-actions{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap;margin-top:14px}
  .smk-unified-app .smk-recent-actions>button{margin:0!important;min-height:46px;flex:1 1 160px;padding:11px 14px!important;border-radius:13px!important;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px!important;font-weight:780!important;cursor:pointer;transition:background .22s ease,border-color .22s ease,transform .22s ease!important}
  .smk-unified-app .smk-recent-actions>button[hidden]{display:none!important}
  .smk-unified-app .smk-recent-open-primary{background:linear-gradient(115deg,rgba(167,125,242,.30),rgba(115,112,203,.22))!important;border:1px solid rgba(195,155,252,.48)!important;color:#f3e7ff!important}
  .smk-unified-app .smk-recent-actions .smk-home-recent-open{background:rgba(110,90,148,.08)!important;border:1px solid rgba(185,157,226,.18)!important;color:#c7b9e1!important}
  .smk-unified-app .smk-recent-actions>button:hover{transform:translateY(-2px);border-color:rgba(210,184,255,.66)!important;background-color:rgba(148,108,208,.23)!important}

  /* Radio: remove the oversized radial glow; keep accents localized to controls. */
  .smk-unified-app #smkRadioMount #radioModal>.custom-alert-card{
    background:transparent!important;box-shadow:none!important;filter:none!important;
    min-height:330px!important;padding-top:20px!important;
  }
  .smk-unified-app #smkRadioMount #radioModal>.custom-alert-card:before,
  .smk-unified-app #smkRadioMount #radioModal>.custom-alert-card:after{content:none!important}
  .smk-unified-app #smkRadioMount #radioModal .radio-circle-btn.primary{box-shadow:inset 0 1px rgba(255,255,255,.12),0 5px 17px rgba(92,75,161,.14)!important}
  .smk-unified-app #smkRadioMount .radio-visualizer .bar{box-shadow:0 0 6px rgba(131,154,237,.20)!important}

  /* Dialog hierarchy/spacing consistent with DarkGlass, including printing and validation. */
  body .custom-alert-overlay:not(#radioModal) .custom-alert-card,
  body #historyConfirm .custom-alert-card,
  body #sessionModal .custom-alert-card{
    width:min(92vw,470px)!important;max-width:470px!important;
    padding:22px 24px 24px!important;
    border-radius:23px!important;
    background:linear-gradient(150deg,rgba(39,32,55,.96),rgba(12,12,27,.97))!important;
    border:1px solid rgba(193,167,230,.28)!important;
    box-shadow:0 22px 70px rgba(0,0,0,.47),inset 0 1px 0 rgba(255,255,255,.08)!important;
  }
  body .custom-alert-overlay:not(#radioModal) .custom-alert-title{
    margin:0 0 17px!important;padding:2px 0 17px!important;
    border-bottom:1px solid rgba(185,165,223,.16)!important;
    font-size:clamp(17px,2vw,20px)!important;line-height:1.35!important;
    text-shadow:none!important;letter-spacing:-.3px!important;
    color:#e6d5ff!important;
  }
  body #dateCheckModal .custom-alert-title{color:#ffd577!important}
  body .custom-alert-overlay:not(#radioModal) .custom-alert-text{font-size:14px!important;line-height:1.6!important;color:#c7c0d8!important;margin:8px 0 21px!important}
  body .custom-alert-overlay:not(#radioModal) .custom-alert-btn,
  body #printModal .print-select-btn{border-radius:13px!important;transition:transform .19s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease!important}
  body .custom-alert-overlay.active:not(#radioModal)>.custom-alert-card{animation:smkDialogReveal .27s cubic-bezier(.2,.8,.2,1) both!important}
  @keyframes smkDialogReveal{from{opacity:0;transform:translateY(13px) scale(.974);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
  body #printModal .print-select-btn{min-height:110px!important;text-align:center!important;border:1px solid rgba(193,171,223,.27)!important;background:rgba(127,101,168,.11)!important}
  body #printModal .print-select-btn:hover{transform:translateY(-2px)!important;background:rgba(143,106,193,.22)!important;border-color:rgba(206,174,251,.51)!important}
  body #customAlert .custom-alert-btn{min-height:44px!important;background:linear-gradient(120deg,rgba(132,98,201,.3),rgba(80,86,153,.3))!important;border:1px solid rgba(180,152,235,.5)!important;color:#f0e8ff!important}

  /* TRACE should be an embedded mini-game, not a stretched 520px canvas inside 420px. */
  .smk-unified-app #smkPageTrace:not([hidden]) ~ .smk-page{pointer-events:none}
  .smk-unified-app #smkTraceMount #gameModal.trace-modal,
  .smk-unified-app #smkTraceMount #gameModal.trace-modal.active{
    display:flex!important;min-height:0!important;height:auto!important;
    max-height:none!important;overflow:visible!important;
    justify-content:center!important;align-items:flex-start!important;
    padding:0!important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-shell{
    position:relative!important;
    width:min(100%,760px)!important;max-width:760px!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    display:flex!important;flex-direction:column!important;
    margin:0 auto!important;overflow:visible!important;
    padding:0!important;background:none!important;box-shadow:none!important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-stage{
    width:min(100%,350px,calc((100dvh - 310px)*.6923077))!important;
    min-width:0!important;max-width:100%!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    aspect-ratio:9/13!important;
    flex:none!important;justify-self:center!important;
    border-radius:16px!important;
    margin:0 auto!important;
    background:#090e19!important;
  }
  .smk-unified-app #smkTraceMount #gameModal #gameCanvas{
    display:block!important;width:100%!important;height:100%!important;
    object-fit:fill!important;aspect-ratio:9/13!important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-head{
    border-radius:12px!important;background:rgba(79,60,116,.11)!important;
    margin-bottom:10px!important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-hud{border-radius:12px!important}
  .smk-unified-app #smkTraceMount #gameModal .trace-touch-controls{width:100%;max-width:460px;margin:0 auto;padding-top:8px!important}
  .smk-unified-app #smkTraceMount #gameModal .trace-bottom{width:100%;max-width:460px;margin:0 auto}
  .smk-unified-app #smkTraceMount #gameModal .trace-full-overlay{
    border-radius:17px!important;box-shadow:0 10px 45px rgba(0,0,0,.35);
  }
}
/* A true two-column game workspace on wide screens: tall game on the left,
   HUD / mode / steering / achievements on the right. It fits without stretching. */
@media screen and (min-width:1180px) {
  .smk-unified-app #smkTraceMount #gameModal .trace-shell{
    width:min(100%,820px)!important;max-width:820px!important;
    display:grid!important;grid-template-columns:minmax(0,390px) minmax(0,1fr)!important;
    grid-template-rows:auto auto auto auto 1fr!important;
    grid-template-areas:'top top' 'game hud' 'game options' 'game buttons' 'game achievements'!important;
    gap:9px 18px!important;align-items:start!important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-head{grid-area:top;margin:0!important}
  .smk-unified-app #smkTraceMount #gameModal .trace-stage{
    grid-area:game;align-self:start!important;
    width:min(100%,350px,calc((100dvh - 225px)*.6923077))!important;
    margin:0 auto!important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-hud{
    grid-area:hud;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    padding:10px!important;gap:7px!important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-config{grid-area:options;border:1px solid rgba(180,150,223,.13);border-radius:12px;padding:11px!important;gap:10px!important}
  .smk-unified-app #smkTraceMount #gameModal .trace-touch-controls{grid-area:buttons;max-width:none!important;min-width:0;gap:5px!important;padding:6px 0!important}
  .smk-unified-app #smkTraceMount #gameModal .trace-touch-controls button{min-width:0!important}
  .smk-unified-app #smkTraceMount #gameModal .trace-hint{font-size:9px!important}
  .smk-unified-app #smkTraceMount #gameModal .trace-bottom{grid-area:achievements;max-width:none!important;padding:0!important}
  .smk-unified-app #smkTraceMount #gameModal .trace-full-overlay{grid-area:1/1/-1/-1}
}
@media screen and (max-width:900px) {
 /* Real folding animation: rows collapse rather than instantly display:none. */
 .smk-unified-app .smk-home-sidebar .smk-home-nav{
   display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
   grid-template-rows:64px 0px 0px!important;grid-auto-rows:0px!important;
   row-gap:0!important;column-gap:6px!important;overflow:hidden!important;
   transition:grid-template-rows .43s cubic-bezier(.2,.8,.2,1),row-gap .43s ease!important;
 }
 .smk-unified-app.smk-menu-expanded .smk-home-sidebar .smk-home-nav{
   grid-template-rows:64px 64px 47px!important;row-gap:6px!important;
 }
 .smk-unified-app .smk-home-sidebar .smk-home-navitem,
 .smk-unified-app .smk-home-sidebar .smk-mobile-more{
   min-height:0!important;height:100%!important;min-width:0!important;overflow:hidden!important;
 }
 .smk-unified-app .smk-home-nav .smk-home-navitem[data-page='trace'],
 .smk-unified-app .smk-home-nav .smk-home-navitem[data-page='radio'],
 .smk-unified-app .smk-home-nav .smk-home-navitem[data-page='about'],
 .smk-unified-app .smk-home-nav .smk-home-navitem[data-page='updates'],
 .smk-unified-app .smk-home-nav .smk-home-navitem--utility{
   display:flex!important;visibility:hidden!important;opacity:0!important;
   pointer-events:none!important;transform:translateY(-10px) scale(.94)!important;
   transition:opacity .24s ease,transform .35s cubic-bezier(.2,.85,.25,1),visibility .4s!important;
   animation:none!important;
 }
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem[data-page='trace'],
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem[data-page='radio'],
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem[data-page='about'],
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem[data-page='updates'],
 .smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem--utility{
   visibility:visible!important;opacity:1!important;
   pointer-events:auto!important;transform:none!important;
   transition-delay:.06s!important;animation:none!important;
 }
 .smk-unified-app .smk-home-nav .smk-home-navitem--utility{
   grid-column:1/-1!important;flex-direction:row!important;gap:9px!important;
 }
 .smk-unified-app .smk-home-nav .smk-home-navitem--utility span[data-mobile]::after{font-size:11px!important}
 .smk-unified-app .smk-mobile-more{grid-column:4!important;grid-row:1!important}
 .smk-unified-app .smk-home-nav .smk-home-navitem--utility{grid-row:3!important}
 .smk-unified-app #smkTraceMount #gameModal .trace-stage{
   width:min(100%,350px,calc((100dvh - 355px)*.6923077))!important;
 }
}
@media screen and (max-width:600px){
 .smk-unified-app .smk-unified-recent{padding:17px 15px!important}
 .smk-unified-app .smk-recent-actions{flex-direction:column;gap:7px}
 .smk-unified-app .smk-recent-actions>button{flex:0 0 auto;min-height:42px}
 .smk-unified-app #smkTraceMount #gameModal .trace-stage{
   width:min(100%,350px,calc((100dvh - 365px)*.6923077))!important;
   min-width:min(100%,180px)!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-head{padding:8px 10px!important}
 .smk-unified-app #smkTraceMount #gameModal .trace-hud{padding:5px!important}
 .smk-unified-app #smkTraceMount #gameModal .trace-touch-controls{padding:5px 0!important}
 body .custom-alert-overlay:not(#radioModal) .custom-alert-card{padding:19px 16px!important}
}
@media (prefers-reduced-motion:reduce){
 .next-ui-app.smk-unified-app.app-hidden.app-show .smk-home-sidebar,
 .next-ui-app.smk-unified-app.app-hidden.app-show .smk-home-content,
 .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-hero,
 .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-stats,
 .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-recent,
 body .custom-alert-overlay.active:not(#radioModal)>.custom-alert-card{animation:none!important}
 .smk-unified-app .smk-home-sidebar .smk-home-nav{transition:none!important}
}
/* TRACE has its own useful compact game toolbar: do not repeat the outer page title. */
@media screen {
 .smk-unified-app .smk-home[data-active-page='trace'] .smk-unified-head{display:none!important}
 .smk-unified-app .smk-home[data-active-page='trace'] .smk-home-content{padding-top:20px!important}
}

/* ===== workspace-polish-06.css (preserved order) ===== */
/* SMK Tool 0.7.1 · Workspace Polish 06
   View composition, mobile navigation and dialog chrome only. */
@media screen {
  /* Result action controls are outside the mounted route DOM in the legacy app.
     Hide them explicitly when any other workspace section is active, regardless
     of inline visibility set by history/print/restore code. */
  .next-ui-app.smk-unified-app:not(.smk-workspace-routes) #controlsWrap {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Last calculation: the section label and the name of the route should NOT
     look like two competing headlines. Remove the decorative route icon. */
  .smk-unified-app .smk-unified-recent .smk-home-recent-heading {
    margin: 0 0 17px !important;
    align-items: center;
  }
  .smk-unified-app .smk-unified-recent .smk-home-recent-heading h2 {
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    font-weight: 760 !important;
    letter-spacing: .10em !important;
    text-transform: uppercase;
    color: #b7a6d4 !important;
    opacity: .92;
  }
  .smk-unified-app .smk-unified-recent .smk-home-recent-icon,
  .smk-unified-app .smk-unified-recent .smk-home-recent-route-icon {
    display: none !important;
  }
  .smk-unified-app .smk-unified-recent .smk-home-recent-title-row {
    margin: 0 !important;
    gap: 0 !important;
  }
  .smk-unified-app .smk-unified-recent .smk-home-recent-title-row strong {
    font-size: clamp(21px, 2.4vw, 27px) !important;
    line-height: 1.22 !important;
    font-weight: 820 !important;
    letter-spacing: -.035em !important;
    color: #f0e7ff !important;
    margin: 0 !important;
  }
  .smk-unified-app .smk-unified-recent .smk-home-recent-entry time {
    padding: 0 !important;
    margin: 9px 0 0 !important;
    font-size: 12px !important;
    color: #a79ebd !important;
  }
  .smk-unified-app .smk-unified-recent .smk-home-recent-summary {
    margin-top: 19px !important;
  }

  /* Dialog title belongs to the SAME glass surface as the body, not an
     extra colored strip. Clear earlier dark-glass backgrounds and inline
     offsets; tone down just the title, not the form/buttons below it. */
  body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 0 20px 0 !important;
    padding: 0 0 3px 0 !important;
    min-height: auto !important;
    font-size: clamp(16px, 2.5vw, 19px) !important;
    font-weight: 730 !important;
    line-height: 1.35 !important;
    letter-spacing: .01em !important;
    color: #c8b9e2 !important;
    -webkit-text-fill-color: #c8b9e2 !important;
    opacity: .78 !important;
    text-shadow: none !important;
  }
  body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title .svg-icon {
    width: 19px !important;
    height: 19px !important;
    opacity: .8;
    color: inherit !important;
  }
  body #dateCheckModal .custom-alert-title {color:#e4c37a!important;-webkit-text-fill-color:#e4c37a!important;}
  body #missingItemsModal .custom-alert-title {color:#deb5bb!important;-webkit-text-fill-color:#deb5bb!important;}
}

@media screen and (max-width:900px) {
  /* Utility action spans all four navigation columns in the expanded menu. */
  .smk-unified-app .smk-home-sidebar #smkSidebarBug {
    gap: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px 14px !important;
    text-align: center !important;
  }
  .smk-unified-app .smk-home-sidebar #smkSidebarBug > .svg-icon {
    display: none !important;
  }
  .smk-unified-app .smk-home-sidebar #smkSidebarBug > span[data-mobile] {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    font-size: 0 !important;
  }
  .smk-unified-app .smk-home-sidebar #smkSidebarBug > span[data-mobile]::after {
    content: "Сообщить об ошибке" !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
    font-weight: 760 !important;
    letter-spacing: .01em !important;
  }
}
@media screen and (max-width:600px) {
  .smk-unified-app .smk-unified-recent .smk-home-recent-heading {margin-bottom: 13px !important;}
  .smk-unified-app .smk-unified-recent .smk-home-recent-title-row strong {font-size: 23px !important;}
  body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title {margin-bottom: 17px !important;}
}

/* ===== workspace-polish-07.css (preserved order) ===== */
/* SMK Tool 0.7.1 · Workspace Polish 07
 * Addresses narrow-screen hero action alignment and zoom-safe TRACE stage.
 * Legacy calculation, history and reports are unchanged. */
@media screen {
 /* Same baseline for both hero actions even after browser zoom or wrapping. */
 .smk-unified-app .smk-unified-hero-actions{
   display:flex!important;align-items:stretch!important;justify-content:flex-start!important;
   gap:10px 13px!important;min-width:0;
 }
 .smk-unified-app .smk-unified-hero-actions > button{
   display:inline-flex!important;align-items:center!important;justify-content:center!important;
   min-height:46px!important;margin:0!important;box-sizing:border-box!important;
 }
 .smk-unified-app .smk-unified-hero-actions > button[hidden]{display:none!important}
 .smk-unified-app #smkHomeContinue{padding:11px 15px!important;text-align:center!important;
   white-space:normal!important;line-height:1.35!important;}

 /* Never compress the native 360×520 canvas from viewport-height arithmetic.
    Zoom changes CSS viewport size; scrolling is safe, game distortion is not. */
 .smk-unified-app #smkTraceMount,
 .smk-unified-app #smkTraceMount #gameModal,
 .smk-unified-app #smkTraceMount #gameModal.active{
   position:relative!important;inset:auto!important;overflow:visible!important;
   min-height:0!important;max-height:none!important;height:auto!important;
   width:100%!important;box-sizing:border-box!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-shell{
   width:min(100%,920px)!important;max-width:920px!important;
   height:auto!important;max-height:none!important;min-height:0!important;
   margin:0 auto!important;overflow:visible!important;box-sizing:border-box!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-stage{
   width:min(100%,405px)!important;
   min-width:0!important;max-width:100%!important;
   height:auto!important;min-height:0!important;max-height:none!important;
   aspect-ratio:360 / 520!important;
   flex:0 0 auto!important;
   box-sizing:border-box!important;
   overflow:hidden!important;
   margin:0 auto!important;
   background:#090e19!important;
   contain:layout paint;
 }
 .smk-unified-app #smkTraceMount #gameModal #gameCanvas{
   display:block!important;width:100%!important;height:100%!important;
   min-width:0!important;max-width:100%!important;
   margin:0!important;padding:0!important;
   aspect-ratio:360 / 520!important;
   object-fit:contain!important;object-position:center center!important;
   image-rendering:auto!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-stage-overlay{
   overflow-x:hidden!important;box-sizing:border-box!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-hud,
 .smk-unified-app #smkTraceMount #gameModal .trace-touch-controls,
 .smk-unified-app #smkTraceMount #gameModal .trace-bottom{min-width:0!important;max-width:100%!important;}
 /* Prevent a global app constraint from clipping the enlarged arcade page. */
 .smk-unified-app .smk-home[data-active-page="trace"] .smk-home-content,
 .smk-unified-app #smkPageTrace{min-width:0!important;overflow:visible!important;}
}
@media screen and (min-width:1180px){
 .smk-unified-app #smkTraceMount #gameModal .trace-shell{
   width:min(100%,920px)!important;max-width:920px!important;
   grid-template-columns:minmax(0,440px) minmax(0,1fr)!important;
   gap:11px 21px!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-stage{
   width:min(100%,420px)!important;justify-self:center!important;
 }
}
@media screen and (max-width:1179px){
 .smk-unified-app #smkTraceMount #gameModal .trace-shell{
   width:min(100%,500px)!important;max-width:500px!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-stage{
   width:min(100%,405px)!important;
 }
}
@media screen and (max-width:900px){
 .smk-unified-app #smkTraceMount #gameModal .trace-stage{
   width:min(100%,395px)!important;
 }
}
@media screen and (max-width:600px){
 /* The two hero actions are a tidy full-width vertical group on phones. */
 .smk-unified-app .smk-unified-hero-actions{
   flex-direction:column!important;align-items:stretch!important;gap:8px!important;
 }
 .smk-unified-app .smk-unified-hero-actions > button:not([hidden]){
   width:100%!important;max-width:none!important;min-width:0!important;
   justify-content:space-between!important;padding:12px 16px!important;
 }
 .smk-unified-app #smkHomeContinue:not([hidden]){
   justify-content:center!important;
   background:rgba(133,103,190,.10)!important;
   border:1px solid rgba(185,157,225,.26)!important;
   border-radius:12px!important;
 }
 /* Make the field as tall as the device width allows; scroll for controls. */
 .smk-unified-app #smkTraceMount #gameModal .trace-shell{width:100%!important;max-width:100%!important;}
 .smk-unified-app #smkTraceMount #gameModal .trace-stage{
   width:min(100%,390px)!important;min-width:0!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-touch-controls{width:100%!important;}
}
/* Small effective viewports (including desktop at 175–200% browser zoom):
   use the natural document scroll, not a viewport-driven canvas shrink. */
@media screen and (max-height:640px){
 .smk-unified-app #smkTraceMount #gameModal .trace-stage{
   width:min(100%,375px)!important;min-height:0!important;height:auto!important;
   aspect-ratio:360 / 520!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-shell{
   max-height:none!important;height:auto!important;overflow:visible!important;
 }
}
@media (prefers-reduced-motion: reduce){
 .smk-unified-app .smk-unified-hero-actions > button{transition:none!important}
}

/* ===== workspace-polish-08.css (preserved order) ===== */
/* SMK Tool 0.7.1 · Workspace Polish 08
   Targeted repairs to floating actions, FLIP shell width, modal chrome, hero actions,
   TRACE start screen, and branded splash gradient. No calculation logic changed. */
@media screen {
 /* Splash: same signature lavender→ice-blue gradient as the sidebar SMK Tool. */
 #splash .splash-logo .logo-text {color:#f6f4ff!important;-webkit-text-fill-color:#f6f4ff!important;text-shadow:none!important;}
 #splash .splash-logo .logo-text span {
   font-size:inherit!important;font-weight:900!important;letter-spacing:inherit!important;
   background:linear-gradient(100deg,#ba9dff 0%,#8cd4eb 100%)!important;
   -webkit-background-clip:text!important;background-clip:text!important;
   -webkit-text-fill-color:transparent!important;color:transparent!important;
   filter:none!important;text-shadow:none!important;
 }
 /* Floating results panel exists as a SIBLING of the unified app. */
 body.smk-unified-active:not(.smk-view-routes) #controlsWrap,
 body.smk-unified-active:not(.smk-view-routes) #controlsWrap.show {
   display:none!important;visibility:hidden!important;opacity:0!important;
   pointer-events:none!important;animation:none!important;
 }
 /* Full working width during native FLIP's 3-column state, including app wrapper. */
 .app.next-ui-app.smk-unified-app {width:100%!important;max-width:1365px!important;}
 .app.next-ui-app.smk-unified-app.smk-results-expanded {max-width:100%!important;}
 .smk-unified-app .smk-home-shell {width:100%;}
 .smk-unified-app.smk-results-expanded .smk-home-shell {
   max-width:none!important;width:100%!important;
 }
 .smk-unified-app.smk-results-expanded .smk-home-content,
 .smk-unified-app.smk-results-expanded #smkCalculatorMount,
 .smk-unified-app.smk-results-expanded #smkCalculatorMount .next-main,
 .smk-unified-app.smk-results-expanded #smkCalculatorMount #result,
 .smk-unified-app.smk-results-expanded #smkCalculatorMount #out,
 .smk-unified-app.smk-results-expanded #smkCalculatorMount #view-alphabetical,
 .smk-unified-app.smk-results-expanded #smkCalculatorMount #view-grouped {
   width:100%!important;max-width:none!important;min-width:0!important;
 }
 /* The two hero actions must have the same typographic axis and hover feedback. */
 .smk-unified-app .smk-unified-hero-actions > button:not([hidden]){
   align-items:center!important;justify-content:space-between!important;
   gap:22px!important;line-height:1.35!important;text-align:left!important;
   transition:transform .24s cubic-bezier(.2,.8,.2,1),background .24s ease,
     border-color .24s ease,box-shadow .24s ease,filter .24s ease!important;
 }
 .smk-unified-app .smk-unified-hero-actions .smk-home-continue:not([hidden]){
   border:1px solid rgba(188,153,237,.28)!important;
   background:rgba(139,104,203,.11)!important;
   border-radius:12px!important;padding:13px 18px!important;
   color:#e8d9ff!important;font-weight:800!important;
 }
 .smk-unified-app .smk-unified-hero-actions .smk-home-continue:not([hidden]):hover{
   background:rgba(163,122,233,.27)!important;
   border-color:rgba(211,176,255,.66)!important;
   box-shadow:0 12px 29px rgba(121,88,202,.22)!important;
   transform:translateY(-3px)!important;filter:brightness(1.08)!important;
 }
 .smk-unified-app .smk-unified-hero-actions .smk-home-continue:focus-visible{
   outline:2px solid #c5a9ff!important;outline-offset:3px!important;
 }
 /* Respect game state: [hidden] always wins over overlay layout selectors. */
 .smk-unified-app #smkTraceMount #gameModal .trace-stage-overlay[hidden]{display:none!important;}
 /* TRACE start: give the brand, headline, instructions, and CTA breathing room. */
 .smk-unified-app #smkTraceMount #gameModal .trace-stage-overlay.trace-start{
   flex-direction:column!important;justify-content:center!important;
   align-items:center!important;gap:15px!important;
   padding:25px 22px!important;
   background:linear-gradient(165deg,rgba(9,11,26,.90),rgba(28,17,46,.95))!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-start .trace-start-mark{
   font-size:37px!important;line-height:1.05!important;filter:drop-shadow(0 0 10px rgba(190,148,255,.28));
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-start h2{
   font-size:clamp(25px,2.9vw,36px)!important;line-height:1.14!important;
   margin:0!important;text-wrap:balance!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-start p{
   max-width:310px!important;margin:0!important;font-size:12px!important;
   line-height:1.6!important;color:#bdb2d3!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-start .trace-cta{
   margin:5px 0 0!important;min-height:43px!important;padding:11px 20px!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-start small{
   margin:0!important;padding-top:7px!important;color:#b4a5c9!important;
   font-size:9px!important;line-height:1.45!important;
 }
 /* Real dialogs: transparent title, subtle divider, no colored second card. */
 body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title,
 body #statsModal .custom-alert-title {
   margin:0 0 19px!important;padding:0 3px 15px!important;
   background:transparent!important;background-image:none!important;
   border:0!important;border-bottom:1px solid rgba(206,182,238,.13)!important;
   border-radius:0!important;box-shadow:none!important;
   color:rgba(220,206,238,.74)!important;
   -webkit-text-fill-color:rgba(220,206,238,.74)!important;
   opacity:1!important;text-shadow:none!important;
   font-weight:740!important;letter-spacing:.015em!important;
   text-transform:none!important;
 }
 body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title .svg-icon{
   color:rgba(193,171,225,.78)!important;opacity:.8!important;
 }
 /* Keep warning-specific icons readable while keeping the title itself soft. */
 body #printModal .custom-alert-title,
 body #dateCheckModal .custom-alert-title,
 body #statsModal .custom-alert-title{
   color:rgba(220,206,238,.74)!important;
   -webkit-text-fill-color:rgba(220,206,238,.74)!important;
 }
}
@media screen and (min-width:1101px){
 /* While results use 3 columns, let the CENTERED WORKSPACE occupy the page.
    The sidebar is already above the scroll threshold: it must no longer
    reserve an empty 235px column at the left. */
 .smk-unified-app.smk-results-expanded .smk-home-shell {
   display:grid!important;
   grid-template-columns:minmax(0,1fr)!important;
   gap:0!important;
   max-width:1800px!important;
   margin-inline:auto!important;
 }
 .smk-unified-app.smk-results-expanded .smk-home-sidebar {
   display:none!important;
 }
 .smk-unified-app.smk-results-expanded .smk-home-content {
   grid-column:1/-1!important;
   margin-inline:auto!important;
   width:100%!important;
 }
 .smk-unified-app.smk-results-expanded #smkCalculatorMount #view-alphabetical,
 .smk-unified-app.smk-results-expanded #smkCalculatorMount #view-grouped {
   width:100%!important;
   margin-inline:auto!important;
 }
 .smk-unified-app #smkCalculatorMount .next-layout.smk-three #view-alphabetical,
 .smk-unified-app #smkCalculatorMount .next-layout.smk-three #view-grouped{
   display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:17px!important;
 }
}
@media screen and (max-width:600px){
 .smk-unified-app .smk-unified-hero-actions > button:not([hidden]){
   width:100%!important;max-width:none!important;min-height:46px!important;
   justify-content:space-between!important;padding:13px 17px!important;
 }
 .smk-unified-app .smk-unified-hero-actions .smk-home-continue:not([hidden]){
   justify-content:flex-start!important;text-align:left!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-stage-overlay.trace-start{
   gap:11px!important;padding:19px 15px!important;
 }
 .smk-unified-app #smkTraceMount #gameModal .trace-start h2{font-size:clamp(23px,7vw,30px)!important;}
 .smk-unified-app #smkTraceMount #gameModal .trace-start p{font-size:11px!important;line-height:1.5!important;}
}
@media screen and (max-height:440px){
 .smk-unified-app #smkTraceMount #gameModal .trace-stage-overlay.trace-start{gap:6px!important;padding:9px 11px!important;}
 .smk-unified-app #smkTraceMount #gameModal .trace-start h2{font-size:22px!important;}
}
@media (prefers-reduced-motion:reduce){
 .smk-unified-app .smk-unified-hero-actions > button{transition:none!important;}
}
/* Preserve feedback on the mobile/zoom layout where the old ID selector sets a background. */
.smk-unified-app #smkHomeContinue:not([hidden]):hover,
.smk-unified-app #smkHomeContinue:not([hidden]):focus-visible {
  background:rgba(163,122,233,.27)!important;
  border-color:rgba(211,176,255,.66)!important;
  box-shadow:0 12px 29px rgba(121,88,202,.22)!important;
}
.smk-unified-app #smkHomeContinue:not([hidden]):active{transform:translateY(0) scale(.985)!important;}

/* ===== workspace-polish-09.css (preserved order) ===== */
/* SMK Tool 0.7.1 · Unified Workspace / Polish 09
   Three targeted visual fixes. Does not change calculation logic. */

/* Slightly lighter, genuinely translucent route/date summary. */
@media screen {
  body .next-ui-app .summary-date-badge {
    background: rgba(32, 25, 48, .18) !important;
    border-color: rgba(211, 200, 235, .13) !important;
    box-shadow: 0 8px 26px rgba(0, 0, 0, .14), inset 0 1px rgba(255,255,255,.035) !important;
    -webkit-backdrop-filter: blur(8px) saturate(105%) !important;
    backdrop-filter: blur(8px) saturate(105%) !important;
  }

  /* Polish 11: the header is actual translucent GLASS, not just faded text.
     Full-bleed glass is part of the same card; no separate outline/second border. */
  body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-card,
  body #statsModal .custom-stats-card {
    --smk-modal-pad-x: 24px;
    --smk-modal-pad-top: 22px;
  }
  body #statsModal .custom-stats-card {
    --smk-modal-pad-x: 21px;
    --smk-modal-pad-top: 23px;
  }
  body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title,
  body #statsModal #statsModalTitle {
    box-sizing: border-box !important;
    position: relative !important;
    isolation: isolate !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: calc(100% + 2 * var(--smk-modal-pad-x, 24px)) !important;
    max-width: none !important;
    min-height: 63px !important;
    padding: 16px 22px 17px !important;
    margin:
      calc(-1 * var(--smk-modal-pad-top, 24px))
      calc(-1 * var(--smk-modal-pad-x, 24px))
      22px !important;
    background: linear-gradient(115deg,
        rgba(204, 188, 242, .085) 0%,
        rgba(135, 125, 190, .045) 50%,
        rgba(112, 168, 211, .065) 100%) !important;
    background-color: rgba(94, 78, 128, .025) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(228, 205, 255, .19) !important;
    border-radius: 22px 22px 0 0 !important;
    outline: none !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.11),
                inset 0 -1px 0 rgba(255,255,255,.012) !important;
    -webkit-backdrop-filter: blur(24px) saturate(135%) !important;
    backdrop-filter: blur(24px) saturate(135%) !important;
    color: rgba(226, 211, 246, .80) !important;
    -webkit-text-fill-color: rgba(226, 211, 246, .80) !important;
    opacity: 1 !important;
    text-shadow: none !important;
    font-size: clamp(16px, 2vw, 19px) !important;
    font-weight: 740 !important;
    letter-spacing: .01em !important;
    line-height: 1.35 !important;
    text-transform: none !important;
  }
  /* The sheen is not a second panel and never intercepts click events. */
  body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title::before,
  body #statsModal #statsModalTitle::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(180deg,
      rgba(255,255,255,.038), transparent 70%);
    z-index: -1;
  }
  body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title .svg-icon,
  body #statsModal #statsModalTitle .svg-icon {
    color: rgba(207, 189, 242, .75) !important;
    opacity: .84 !important;
    filter: none !important;
  }
  @media (max-width: 600px) {
    /* The compact dialog uses 19px 16px padding: keep header inside it. */
    body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-card {
      --smk-modal-pad-x: 16px !important;
      --smk-modal-pad-top: 19px !important;
    }
    body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title,
    body #statsModal #statsModalTitle {
      min-height: 55px !important;
      padding: 13px 16px 14px !important;
      font-size: 16px !important;
    }
  }
}

/* Mobile: center the label of BOTH hero actions. Leave the primary arrow
   pinned to the right so it never shifts the label off-center. */
@media screen and (max-width: 600px) {
  .smk-unified-app .smk-unified-hero-actions > .smk-home-primary:not([hidden]),
  .smk-unified-app .smk-unified-hero-actions > .smk-home-continue:not([hidden]),
  .smk-unified-app .smk-unified-hero-actions > #smkHomeContinue:not([hidden]) {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
    padding-left: 34px !important;
    padding-right: 34px !important;
  }
  .smk-unified-app .smk-unified-hero-actions > .smk-home-primary:not([hidden]) > span[aria-hidden] {
    position: absolute !important;
    right: 17px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
  }
}


/* Polish 12 / print choices & actual frosted modal surface.
   A blurred header on top of an almost-opaque parent looked like solid purple.
   So both the parent and the header must be translucent. */
@media screen {
  body .custom-alert-overlay:not(#radioModal):not(#gameModal) > .custom-alert-card {
    background: linear-gradient(145deg,
      rgba(42, 34, 62, .74) 0%,
      rgba(20, 17, 36, .70) 58%,
      rgba(13, 13, 28, .76) 100%) !important;
    -webkit-backdrop-filter: blur(30px) saturate(133%) !important;
    backdrop-filter: blur(30px) saturate(133%) !important;
  }
  /* One continuous glass panel. Header does not introduce another opaque card. */
  body .custom-alert-overlay:not(#radioModal):not(#gameModal) .custom-alert-title {
    background: linear-gradient(110deg,
      rgba(236, 219, 255, .070),
      rgba(155, 140, 206, .020) 53%,
      rgba(116, 166, 224, .055)) !important;
    background-color: rgba(85, 74, 123, .018) !important;
    -webkit-backdrop-filter: blur(24px) saturate(128%) !important;
    backdrop-filter: blur(24px) saturate(128%) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
    border-bottom: 1px solid rgba(226,207,249,.17) !important;
  }

  body #printModal .smk-print-dialog {
    width: min(92vw, 480px) !important;
    max-width: 480px !important;
    padding: 25px 25px 23px !important;
    text-align: center !important;
    overflow: hidden !important;
  }
  body #printModal .smk-print-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 4px;
  }
  body #printModal .print-select-btn {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    min-height: 128px !important;
    padding: 18px 24px !important;
    text-align: center;
    border-radius: 17px !important;
    cursor: pointer;
    overflow: hidden;
    box-shadow: inset 0 1px rgba(255,255,255,.055) !important;
    transform: none !important;
    transition: background .2s ease, border-color .2s ease, box-shadow .2s ease !important;
  }
  body #printModal .print-select-btn::before {
    content: '';
    position: absolute;
    top: 16px; bottom: 16px; left: 0;
    width: 3px;
    border-radius: 0 4px 4px 0;
    opacity: .75;
    background: var(--print-accent);
    box-shadow: 0 0 14px var(--print-glow);
    pointer-events: none;
  }
  body #printModal .print-select-btn.btn-blue {
    --print-accent: #85c9f5;
    --print-glow: rgba(100,188,249,.24);
    background: linear-gradient(120deg, rgba(68, 146, 199, .17), rgba(34, 65, 102, .095)) !important;
    border: 1px solid rgba(121, 192, 237, .36) !important;
  }
  body #printModal .print-select-btn.btn-purple {
    --print-accent: #dda8e8;
    --print-glow: rgba(209,139,236,.23);
    background: linear-gradient(120deg, rgba(151, 88, 171, .16), rgba(91, 54, 127, .11)) !important;
    border: 1px solid rgba(208, 157, 225, .34) !important;
  }
  body #printModal .print-select-btn.btn-blue:is(:hover,:focus-visible) {
    background: linear-gradient(120deg, rgba(69, 152, 214, .26), rgba(49, 99, 158, .15)) !important;
    border-color: rgba(139, 212, 255, .67) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.10), 0 5px 22px rgba(59, 147, 211, .12) !important;
    transform: none !important;
  }
  body #printModal .print-select-btn.btn-purple:is(:hover,:focus-visible) {
    background: linear-gradient(120deg, rgba(175, 102, 197, .24), rgba(103, 67, 148, .17)) !important;
    border-color: rgba(229, 179, 246, .62) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.10), 0 5px 22px rgba(158, 91, 183, .12) !important;
    transform: none !important;
  }
  body #printModal .print-select-btn:focus-visible,
  body #printModal .smk-print-cancel:focus-visible {
    outline: 2px solid rgba(229,211,255,.75);
    outline-offset: 3px;
  }
  body #printModal .smk-print-option-title {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.3;
  }
  body #printModal .btn-blue .smk-print-option-title { color: #b3e1ff !important; }
  body #printModal .btn-purple .smk-print-option-title { color: #edc4f6 !important; }
  body #printModal .smk-print-option-title .svg-icon {
    width: 20px; height: 20px;
    color: currentColor !important;
  }
  body #printModal .smk-print-option-description {
    max-width: 350px;
    color: #b5b5cb;
    font-size: 13px;
    font-weight: 450;
    line-height: 1.45;
  }
  body #printModal .smk-print-option-tag {
    color: #e4deed;
    font-size: 12px;
    font-weight: 760;
    letter-spacing: .01em;
  }
  body #printModal .smk-print-cancel {
    width: 100%;
    min-height: 46px;
    margin-top: 16px;
    border: 1px solid rgba(188,180,211,.23);
    border-radius: 14px;
    background: rgba(18, 17, 33, .19);
    color: #b5afc6;
    font-size: 13px;
    font-weight: 650;
    cursor: pointer;
    transition: background .2s, border-color .2s, color .2s;
  }
  body #printModal .smk-print-cancel:hover {
    background: rgba(110, 105, 155, .18);
    border-color: rgba(198, 190, 226, .40);
    color: #eee8fa;
  }
}
@media screen and (max-width: 600px) {
  body #printModal .smk-print-dialog { padding: 19px 16px 18px !important; }
  body #printModal .print-select-btn { min-height: 112px !important; padding: 14px 12px !important; }
}
@media (prefers-reduced-motion: reduce) {
  body #printModal .print-select-btn,
  body #printModal .smk-print-cancel { transition: none !important; }
}
/* SMK Tool — плавный hover всех кнопок навигации */

.smk-unified-app .smk-home-nav .smk-home-navitem,
.smk-unified-app.smk-menu-expanded .smk-home-nav .smk-home-navitem,
.smk-unified-app .smk-home-nav .smk-mobile-more {
    transition:
        background-color .35s ease,
        border-color .35s ease,
        color .35s ease,
        box-shadow .35s ease,
        opacity .24s ease,
        transform .35s cubic-bezier(.2, .8, .2, 1),
        visibility .4s !important;
}

/* Плавное наведение на «Ещё / Свернуть» */
.smk-unified-app .smk-mobile-more:hover {
    border-color: rgba(196, 169, 255, .5) !important;
    box-shadow: 0 4px 18px rgba(134, 98, 205, .12) !important;
}

/* Плавное наведение на «Сообщить об ошибке» */
.smk-unified-app .smk-home-navitem--utility:hover {
    border-color: rgba(227, 151, 190, .3) !important;
    box-shadow: 0 4px 18px rgba(190, 107, 153, .10) !important;
}

/* Учитываем настройки уменьшения анимации */
@media (prefers-reduced-motion: reduce) {
    .smk-unified-app .smk-home-nav .smk-home-navitem,
    .smk-unified-app .smk-home-nav .smk-mobile-more {
        transition: none !important;
    }
}
/* SMK Tool — высота по содержимому */

@media screen and (min-width: 1101px) {

    .app.next-ui-app.smk-unified-app {
        min-height: 0 !important;
    }

    .smk-unified-app .smk-home-shell {
        min-height: 0 !important;
        height: auto !important;
        align-items: start !important;
    }

    .smk-unified-app .smk-home-sidebar,
    .smk-unified-app .smk-home-content {
        min-height: 0 !important;
        height: auto !important;
    }
}

/* ============================================================
   SMK Tool 0.7.2 | ClearGlass tuning
   One cohesive translucent treatment of the Unified Workspace.
   Applied after the historical polish layers to avoid cascade fights.
   No layout, animation timing, JS or calculator logic is changed.
   ============================================================ */
@media screen {
  /* Exterior glass planes: let the app's existing blue/purple backdrop show through. */
  .smk-unified-app .smk-home-sidebar {
    background-color: transparent !important;
    background-image:
      radial-gradient(ellipse at 2% 4%, rgba(65, 132, 218, .13), transparent 62%),
      linear-gradient(148deg, rgba(18, 30, 57, .62), rgba(9, 13, 28, .56) 58%, rgba(24, 14, 34, .50)) !important;
    border-color: rgba(169, 190, 229, .24) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10),
                0 18px 50px rgba(2, 3, 16, .20) !important;
    -webkit-backdrop-filter: blur(28px) saturate(145%) !important;
    backdrop-filter: blur(28px) saturate(145%) !important;
  }

  .smk-unified-app .smk-home-content {
    background-color: transparent !important;
    background-image:
      radial-gradient(ellipse at 94% 26%, rgba(154, 49, 105, .12), transparent 58%),
      radial-gradient(ellipse at 3% 86%, rgba(37, 120, 210, .16), transparent 64%),
      linear-gradient(145deg, rgba(17, 28, 49, .53), rgba(9, 12, 26, .58) 61%, rgba(23, 13, 33, .49)) !important;
    border-color: rgba(160, 181, 222, .24) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .085),
                0 18px 56px rgba(2, 3, 16, .17) !important;
    -webkit-backdrop-filter: blur(28px) saturate(148%) !important;
    backdrop-filter: blur(28px) saturate(148%) !important;
  }

  /* A little more light passes through the dashboard surfaces. */
  .smk-unified-app .smk-unified-hero {
    background:
      radial-gradient(ellipse at 95% 3%, rgba(142, 92, 207, .16), transparent 58%),
      radial-gradient(ellipse at 3% 110%, rgba(51, 133, 221, .20), transparent 64%),
      linear-gradient(125deg, rgba(27, 40, 73, .53), rgba(12, 16, 36, .54)) !important;
    border-color: rgba(162, 188, 233, .29) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .13),
                0 12px 35px rgba(3, 3, 17, .12) !important;
    -webkit-backdrop-filter: blur(14px) saturate(135%);
    backdrop-filter: blur(14px) saturate(135%);
  }

  .smk-unified-app .smk-unified-stats .smk-home-stat {
    background: linear-gradient(135deg, rgba(35, 56, 88, .31), rgba(11, 13, 32, .35)) !important;
    border-color: rgba(190, 166, 229, .25) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .065) !important;
  }
  .smk-unified-app .smk-unified-stats .smk-home-stat:hover {
    background: linear-gradient(135deg, rgba(59, 84, 122, .39), rgba(24, 23, 46, .37)) !important;
    border-color: rgba(205, 177, 250, .46) !important;
  }

  .smk-unified-app .smk-unified-recent {
    background:
      radial-gradient(ellipse at 95% 0%, rgba(138, 74, 155, .09), transparent 58%),
      linear-gradient(145deg, rgba(32, 52, 77, .34), rgba(10, 12, 29, .34)) !important;
    border-color: rgba(197, 171, 237, .26) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055) !important;
  }

  .smk-unified-app button.smk-home-navitem:not(.is-active) {
    background-color: rgba(34, 28, 55, .22) !important;
    background-image: linear-gradient(115deg, rgba(123, 95, 169, .065), rgba(11, 12, 30, .05)) !important;
    border-color: rgba(200, 177, 235, .07) !important;
  }
  .smk-unified-app button.smk-home-navitem:not(.is-active):hover {
    background-color: rgba(86, 64, 125, .28) !important;
    background-image: linear-gradient(115deg, rgba(150, 115, 204, .14), rgba(19, 18, 42, .09)) !important;
    border-color: rgba(195, 164, 237, .27) !important;
  }

  /* Routes are in the same workspace and should not appear as opaque blocks. */
  .smk-unified-app #smkCalculatorMount #routeButtons .route-btn.next-route {
    background: linear-gradient(135deg, rgba(32, 53, 83, .31), rgba(12, 14, 32, .39)) !important;
    border-color: rgba(191, 170, 231, .24) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
    -webkit-backdrop-filter: blur(9px) saturate(130%) !important;
    backdrop-filter: blur(9px) saturate(130%) !important;
  }
  .smk-unified-app #smkCalculatorMount #routeButtons .route-btn.next-route:hover {
    background: linear-gradient(135deg, rgba(59, 80, 125, .43), rgba(35, 29, 63, .39)) !important;
    border-color: rgba(194, 155, 250, .52) !important;
    box-shadow: 0 10px 24px rgba(10, 6, 28, .16),
                inset 0 1px 0 rgba(255, 255, 255, .10) !important;
  }
  /* Result cards: graphite-blue glass, lightly reflecting the older dark theme. */
  .smk-unified-app #smkCalculatorMount #result .shop-card {
    background: linear-gradient(145deg, rgba(33, 48, 76, .31), rgba(8, 12, 27, .52) 65%, rgba(42, 17, 40, .23)) !important;
    border-color: rgba(160, 184, 223, .22) !important;
    border-top-color: rgba(198, 218, 253, .26) !important;
    -webkit-backdrop-filter: blur(14px) saturate(122%) !important;
    backdrop-filter: blur(14px) saturate(122%) !important;
  }
  .smk-unified-app #smkCalculatorMount #result .shop-card:hover {
    border-color: rgba(172, 197, 235, .40) !important;
  }
}

@media screen and (max-width: 900px) {
  /* The first three tiles reserve a flex line for their captions.
     Give the More/Collapse caption the same flex sizing: otherwise the
     icon + caption group is 5px lower despite identical button heights. */
  .smk-unified-app .smk-home-sidebar .smk-mobile-more {
    padding: 8px 3px 7px !important;
    gap: 5px !important;
    justify-content: center !important;
    align-items: center !important;
    background-color: rgba(77, 56, 117, .27) !important;
    border-color: rgba(198, 164, 243, .29) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .065);
  }
  .smk-unified-app .smk-home-sidebar .smk-mobile-more > .svg-icon {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
  }
  .smk-unified-app .smk-home-sidebar #smkMobileMoreText {
    display: block !important;
    flex: 1 1 auto !important;
    align-self: stretch;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
    text-align: center !important;
  }
  .smk-unified-app.smk-menu-expanded .smk-home-sidebar .smk-mobile-more {
    background-color: rgba(129, 97, 185, .40) !important;
  }
}
@media screen and (max-width: 420px) {
  .smk-unified-app .smk-home-sidebar #smkMobileMoreText { font-size: 9px !important; }
}

/* ==============================================================
   SMK Tool 0.7.2 | Graphite DarkGlass refinement
   Consolidated override for the existing theme layers.
   Keep this section LAST in workspace.css (loaded after other CSS).
   Only visual presentation changes; no app/game logic touched.
   ============================================================== */
@media screen {
  /* The photo remains visible, but loses the strong electric-blue cast. */
  body .bg {
    background:
      linear-gradient(180deg, rgba(5, 5, 11, .54), rgba(4, 4, 10, .76)),
      url('gallery/main-bg.png') center / cover no-repeat !important;
  }

  /* Unified panels: graphite first; purple/blue are very faint reflections. */
  .smk-unified-app .smk-home-sidebar {
    background-color: transparent !important;
    background-image:
      radial-gradient(ellipse at 0% 0%, rgba(99, 85, 137, .075), transparent 65%),
      linear-gradient(148deg, rgba(23, 22, 34, .77), rgba(9, 10, 18, .82) 57%, rgba(16, 13, 23, .77)) !important;
    border-color: rgba(197, 186, 217, .20) !important;
    -webkit-backdrop-filter: blur(26px) saturate(112%) !important;
    backdrop-filter: blur(26px) saturate(112%) !important;
  }
  .smk-unified-app .smk-home-content {
    background-color: transparent !important;
    background-image:
      radial-gradient(ellipse at 95% 13%, rgba(113, 71, 118, .075), transparent 62%),
      radial-gradient(ellipse at 2% 95%, rgba(58, 89, 125, .065), transparent 66%),
      linear-gradient(145deg, rgba(21, 20, 31, .73), rgba(9, 10, 20, .77) 58%, rgba(17, 12, 22, .75)) !important;
    border-color: rgba(198, 186, 222, .20) !important;
    -webkit-backdrop-filter: blur(26px) saturate(114%) !important;
    backdrop-filter: blur(26px) saturate(114%) !important;
  }

  .smk-unified-app .smk-unified-hero {
    background:
      radial-gradient(ellipse at 95% 8%, rgba(117, 80, 155, .11), transparent 64%),
      linear-gradient(125deg, rgba(35, 30, 51, .49), rgba(13, 14, 28, .56)) !important;
    border-color: rgba(197, 180, 223, .24) !important;
  }
  .smk-unified-app .smk-unified-stats .smk-home-stat {
    background: linear-gradient(130deg, rgba(42, 35, 54, .30), rgba(12, 12, 27, .36)) !important;
    border-color: rgba(192, 179, 218, .20) !important;
  }
  .smk-unified-app .smk-unified-stats .smk-home-stat:hover {
    background: linear-gradient(130deg, rgba(72, 57, 89, .36), rgba(22, 21, 42, .39)) !important;
  }
  .smk-unified-app .smk-unified-recent {
    background: linear-gradient(140deg, rgba(39, 33, 52, .30), rgba(11, 12, 25, .37)) !important;
    border-color: rgba(197, 180, 219, .23) !important;
  }
  .smk-unified-app #smkCalculatorMount #routeButtons .route-btn.next-route {
    background: linear-gradient(140deg, rgba(42, 36, 56, .31), rgba(12, 13, 29, .43)) !important;
    border-color: rgba(200, 181, 223, .22) !important;
  }
  .smk-unified-app #smkCalculatorMount #routeButtons .route-btn.next-route:hover {
    background: linear-gradient(140deg, rgba(78, 59, 100, .38), rgba(25, 23, 46, .41)) !important;
    border-color: rgba(200, 168, 235, .45) !important;
  }
  .smk-unified-app #smkCalculatorMount #stepsContainer .next-dropzone {
    background:
      radial-gradient(circle at 50% 0%, rgba(125, 95, 159, .10), transparent 64%),
      rgba(12, 11, 22, .39) !important;
    border-color: rgba(191, 175, 218, .36) !important;
  }
  .smk-unified-app #smkCalculatorMount #result .shop-card {
    background: linear-gradient(145deg, rgba(40, 35, 54, .31), rgba(9, 11, 23, .48) 63%, rgba(40, 22, 41, .21)) !important;
    border-color: rgba(181, 169, 206, .22) !important;
    border-top-color: rgba(217, 202, 231, .28) !important;
  }

  /* "Итоговая статистика": a quiet glass disclosure, not a blue banner. */
  .smk-unified-app #smkCalculatorMount .total-glass {
    background: rgba(15, 13, 25, .30) !important;
    border: 1px solid rgba(192, 179, 215, .22) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
    -webkit-backdrop-filter: blur(16px) saturate(115%) !important;
    backdrop-filter: blur(16px) saturate(115%) !important;
  }
  .smk-unified-app #smkCalculatorMount .total-glass .total-header {
    background: linear-gradient(110deg, rgba(40, 33, 55, .40), rgba(14, 13, 26, .33)) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(194, 180, 219, .13) !important;
    min-height: 55px;
    transition: filter .30s ease, border-color .30s ease !important;
  }
  .smk-unified-app #smkCalculatorMount .total-glass .total-header:hover {
    background: linear-gradient(110deg, rgba(40, 33, 55, .40), rgba(14, 13, 26, .33)) !important;
    filter: brightness(1.17);
    border-bottom-color: rgba(204, 184, 236, .27) !important;
  }
  .smk-unified-app #smkCalculatorMount .total-header span:not(.arrow),
  .smk-unified-app #smkCalculatorMount .total-header .title-text {
    color: #d5cae5 !important;
    font-size: 12px !important;
    font-weight: 790 !important;
    letter-spacing: .16em !important;
    text-shadow: none !important;
  }
  .smk-unified-app #smkCalculatorMount .total-glass.open .total-header .title-text {
    color: #f2eaff !important;
    text-shadow: none !important;
  }
  .smk-unified-app #smkCalculatorMount .total-header .arrow {
    color: #b29cca !important;
    opacity: .76;
    text-shadow: none !important;
  }

  /* Continue (egg step) and Calculate (milk step): same muted-lavender CTA. */
  .smk-unified-app #smkCalculatorMount #stepsContainer .next-actions .next-primary {
    color: #f9f5ff !important;
    background: linear-gradient(110deg, #655a83, #86709f) !important;
    border: 1px solid rgba(205, 182, 232, .43) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .17),
                0 9px 24px rgba(31, 21, 46, .21) !important;
    transition: filter .32s ease, transform .32s ease,
                box-shadow .32s ease, border-color .32s ease !important;
  }
  .smk-unified-app #smkCalculatorMount #stepsContainer .next-actions .next-primary:not(:disabled):hover {
    filter: brightness(1.13);
    border-color: rgba(222, 204, 255, .68) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .23),
                0 12px 26px rgba(66, 43, 94, .24) !important;
  }
  .smk-unified-app #smkCalculatorMount #stepsContainer .next-actions .next-primary:disabled {
    opacity: .50 !important;
    filter: saturate(.70);
    cursor: not-allowed;
  }

  /* "Продолжить работу" on home is a separate button from step-2 Continue. */
  .smk-unified-app .smk-unified-hero-actions #smkHomeContinue:not([hidden]) {
    color: #dfd5ee !important;
    background: linear-gradient(120deg, rgba(83, 70, 108, .27), rgba(35, 31, 55, .20)) !important;
    border: 1px solid rgba(181, 160, 206, .24) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055) !important;
    transition: filter .30s ease, border-color .30s ease,
                box-shadow .30s ease, transform .30s ease !important;
  }
  .smk-unified-app .smk-unified-hero-actions #smkHomeContinue:not([hidden]):hover {
    filter: brightness(1.17);
    border-color: rgba(210, 183, 240, .50) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10),
                0 7px 22px rgba(67, 44, 92, .16) !important;
  }
}

@media screen and (orientation: portrait) {
  body .bg {
    background:
      linear-gradient(180deg, rgba(5, 5, 11, .57), rgba(4, 4, 10, .78)),
      url('gallery/main-bg-mobile.png') center / cover no-repeat !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .smk-unified-app #smkCalculatorMount .total-glass .total-header,
  .smk-unified-app #smkCalculatorMount #stepsContainer .next-actions .next-primary,
  .smk-unified-app .smk-unified-hero-actions #smkHomeContinue:not([hidden]) {
    transition: none !important;
  }
}


/* ===== SMK Tool 0.7.2 · Compact DarkGlass result actions =====
   Retain the native buttons and their handlers. Only visual appearance changes.
   Loaded last to override legacy Next UI / Glass UI button styles.
*/
@media screen {
  body #controlsWrap {
    gap: 5px !important;
    padding: 5px !important;
    max-width: calc(100vw - 24px) !important;
    border-radius: 20px !important;
    background: linear-gradient(145deg,
      rgba(38, 34, 49, .79), rgba(12, 12, 22, .86)) !important;
    border: 1px solid rgba(203, 193, 224, .23) !important;
    border-top-color: rgba(228, 217, 243, .37) !important;
    box-shadow:
      0 16px 44px rgba(0, 0, 0, .42),
      inset 0 1px 0 rgba(255, 255, 255, .075) !important;
    -webkit-backdrop-filter: blur(26px) saturate(120%) !important;
    backdrop-filter: blur(26px) saturate(120%) !important;
  }

  body #controlsWrap .btn-reset,
  body #controlsWrap .btn-save-png,
  body #controlsWrap .btn-print {
    min-height: 42px !important;
    min-width: 108px !important;
    padding: 10px 15px !important;
    gap: 8px !important;
    border-radius: 14px !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    letter-spacing: .01em !important;
    transform: none;
    filter: brightness(1);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
    transition:
      filter .3s ease,
      border-color .3s ease,
      color .3s ease,
      box-shadow .3s ease,
      transform .3s cubic-bezier(.2,.8,.2,1) !important;
  }

  /* Reset: reserved, muted rose — not a bright red warning tile. */
  body #controlsWrap .btn-reset,
  body #controlsWrap .btn-reset:hover {
    color: #e9c6d3 !important;
    background: linear-gradient(115deg,
      rgba(121, 69, 98, .19), rgba(63, 46, 69, .18)) !important;
  }
  body #controlsWrap .btn-reset {
    border: 1px solid rgba(212, 158, 187, .24) !important;
  }
  body #controlsWrap .btn-reset:hover {
    border-color: rgba(230, 176, 206, .52) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07),
                0 5px 17px rgba(119, 70, 105, .12) !important;
    filter: brightness(1.15);
  }

  /* Export: a restrained lavender-blue accent shared with the new navigation. */
  body #controlsWrap .btn-save-png,
  body #controlsWrap .btn-save-png:hover {
    color: #d7d3ff !important;
    background: linear-gradient(115deg,
      rgba(109, 98, 170, .23), rgba(70, 81, 135, .18)) !important;
  }
  body #controlsWrap .btn-save-png {
    border: 1px solid rgba(175, 164, 233, .29) !important;
  }
  body #controlsWrap .btn-save-png:hover {
    border-color: rgba(206, 190, 255, .59) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08),
                0 5px 18px rgba(108, 94, 191, .13) !important;
    filter: brightness(1.17);
  }

  /* Print is sometimes shown in this same floating dock. */
  body #controlsWrap .btn-print,
  body #controlsWrap .btn-print:hover {
    color: #c6d4ec !important;
    background: linear-gradient(115deg,
      rgba(88, 101, 139, .19), rgba(52, 60, 90, .15)) !important;
  }
  body #controlsWrap .btn-print {
    border: 1px solid rgba(160, 182, 224, .23) !important;
  }
  body #controlsWrap .btn-print:hover {
    border-color: rgba(185, 207, 245, .45) !important;
    filter: brightness(1.15);
  }

  body #controlsWrap .btn-reset:hover,
  body #controlsWrap .btn-save-png:hover,
  body #controlsWrap .btn-print:hover {
    transform: translateY(-1px) !important;
  }
  body #controlsWrap .btn-reset:active,
  body #controlsWrap .btn-save-png:active,
  body #controlsWrap .btn-print:active {
    transform: scale(.975) !important;
    filter: brightness(1.04);
  }
  body #controlsWrap button:focus-visible {
    outline: 2px solid rgba(206, 185, 255, .8) !important;
    outline-offset: 3px !important;
  }

  body #controlsWrap button .svg-icon,
  body #controlsWrap button:hover .svg-icon,
  body #controlsWrap .btn-reset:hover .svg-icon {
    width: 16px;
    height: 16px;
    transform: none !important;
    filter: none !important;
    opacity: .91;
    transition: opacity .3s ease !important;
  }
  body #controlsWrap button:hover .svg-icon { opacity: 1; }
}

@media screen and (max-width: 440px) {
  body #controlsWrap {
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 17px !important;
  }
  body #controlsWrap .btn-reset,
  body #controlsWrap .btn-save-png,
  body #controlsWrap .btn-print {
    min-height: 41px !important;
    min-width: 0 !important;
    padding: 9px 11px !important;
    font-size: 11px !important;
    gap: 6px !important;
    border-radius: 12px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body #controlsWrap .btn-reset,
  body #controlsWrap .btn-save-png,
  body #controlsWrap .btn-print {
    transition: none !important;
  }
}


/* SMK Tool 0.7.2 · Mobile usability refinement
   Egg-step order, neutral More toggle and focused TRACE mobile screen. */
.smk-trace-mobile-bar { display: none; }

@media screen and (max-width: 900px) {
  /* Uploaded egg invoice is the primary path; skip is always the second action.
     Only reorder visually: keep the original button handlers unchanged. */
  .smk-unified-app #smkCalculatorMount #step2 .next-actions {
    display: flex !important;
    flex-direction: column !important;
  }
  .smk-unified-app #smkCalculatorMount #step2 #nextEggContinue { order: 1 !important; }
  .smk-unified-app #smkCalculatorMount #step2 .next-actions > .next-secondary { order: 2 !important; }

  /* More is a navigation control, not the currently selected destination. */
  .smk-unified-app .smk-home-sidebar #smkMobileMore,
  .smk-unified-app.smk-menu-expanded .smk-home-sidebar #smkMobileMore {
    background: rgba(25, 29, 44, .42) !important;
    background-image: none !important;
    border: 1px solid rgba(165, 179, 213, .20) !important;
    color: #b8bfd2 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
    transition: background-color .3s ease, border-color .3s ease, color .3s ease, box-shadow .3s ease !important;
  }
  .smk-unified-app .smk-home-sidebar #smkMobileMore:hover,
  .smk-unified-app.smk-menu-expanded .smk-home-sidebar #smkMobileMore:hover {
    background: rgba(58, 62, 84, .48) !important;
    border-color: rgba(187, 198, 224, .40) !important;
    color: #f2effb !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.065) !important;
  }
  .smk-unified-app #smkMobileMore:focus-visible {
    outline: 2px solid rgba(176, 164, 232, .85) !important;
    outline-offset: 3px;
  }

  /* TRACE gets a clean gaming workspace: hide the oversized navigation ONLY
     on this section. Returning to any page restores it automatically. */
  .smk-unified-app #smkHome[data-active-page="trace"] .smk-home-sidebar {
    display: none !important;
  }
  .smk-unified-app #smkHome[data-active-page="trace"] .smk-home-shell {
    padding: 8px 8px 22px !important;
    gap: 0 !important;
  }
  .smk-unified-app #smkHome[data-active-page="trace"] .smk-home-content {
    padding: 10px 10px 20px !important;
    min-height: 0 !important;
  }
  .smk-unified-app #smkPageTrace .smk-trace-mobile-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 11px;
    padding: 0 2px;
  }
  .smk-unified-app #smkPageTrace .smk-trace-mobile-back {
    appearance: none; -webkit-appearance: none;
    display: inline-flex; align-items: center; justify-content: center;
    gap: 8px; min-height: 36px; padding: 7px 13px;
    border-radius: 11px;
    border: 1px solid rgba(169, 159, 203, .24);
    background: rgba(30, 28, 46, .45);
    color: #ddd5f0; font: inherit; font-size: 12px; font-weight: 750;
    cursor: pointer;
    transition: background-color .24s ease, border-color .24s ease, color .24s ease;
  }
  .smk-unified-app #smkPageTrace .smk-trace-mobile-back:hover {
    background: rgba(89, 75, 124, .35);
    border-color: rgba(193, 174, 238, .45);
    color: #fff;
  }
  .smk-unified-app #smkPageTrace .smk-trace-mobile-back:focus-visible {
    outline: 2px solid #b39cec; outline-offset: 2px;
  }
  .smk-unified-app #smkPageTrace .smk-trace-mobile-back span { font-size: 18px; line-height: 1; }
  .smk-unified-app #smkPageTrace .smk-trace-mobile-status {
    font-size: 10px; letter-spacing: .10em; text-transform: uppercase;
    font-weight: 800; color: #9f9aaf; white-space: nowrap;
  }
}
@media (prefers-reduced-motion: reduce) {
  .smk-unified-app #smkMobileMore,
  .smk-unified-app #smkPageTrace .smk-trace-mobile-back {transition: none !important;}
}
/* =========================================================
   SMK 0.7.2 · mobile nav polish
   1) центрируем стрелку "К разделам"
   2) выравниваем оттенок кнопки Trace
   3) даём "Ещё" лёгкую подсветку в раскрытом состоянии
   ========================================================= */
@media screen and (max-width: 900px) {

  /* 1. Кнопка "К разделам" */
  .smk-unified-app #smkPageTrace .smk-trace-mobile-back {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 8px 14px !important;
  }

  .smk-unified-app #smkPageTrace .smk-trace-mobile-back > span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    flex: 0 0 22px !important;
    line-height: 1 !important;
    position: relative;
    top: -1px; /* слегка поднимаем стрелку */
  }


  /* 3. Когда "Ещё" раскрыто — лёгкая подсветка, но не как active-вкладка */
  .smk-unified-app.smk-menu-expanded .smk-home-sidebar #smkMobileMore {
    background: rgba(58, 62, 84, .46) !important;
    background-image: none !important;
    border-color: rgba(181, 191, 222, .34) !important;
    color: #eef1fb !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.05),
      0 8px 24px rgba(74, 81, 118, .14),
      0 0 18px rgba(143, 156, 214, .10) !important;
  }

  .smk-unified-app.smk-menu-expanded .smk-home-sidebar #smkMobileMore:hover {
    background: rgba(68, 73, 98, .54) !important;
    border-color: rgba(194, 202, 232, .44) !important;
    color: #ffffff !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.07),
      0 10px 26px rgba(74, 81, 118, .18),
      0 0 22px rgba(154, 166, 220, .14) !important;
  }
}

/* =============================================================
   SMK 0.7.2 · TRACE screen fit + desktop steering layout
   These selectors intentionally follow the earlier workspace
   rules, which override the legacy standalone trace2.css.
   ============================================================= */
@media screen and (min-width: 1180px) {
  /* Left: game + steering directly underneath. Right: HUD / setup / progress. */
  .smk-unified-app #smkTraceMount #gameModal .trace-shell {
    grid-template-rows: auto auto auto minmax(0,1fr) auto !important;
    grid-template-areas:
      "top top"
      "game hud"
      "game options"
      "game achievements"
      "buttons achievements" !important;
    align-items: start !important;
    column-gap: 21px !important;
    row-gap: 9px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-stage {
    grid-area: game !important;
    width: min(100%,420px) !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-touch-controls {
    grid-area: buttons !important;
    width: min(100%,420px) !important;
    max-width: 420px !important;
    margin: 0 auto !important;
    padding: 2px 0 0 !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-bottom {
    grid-area: achievements !important;
  }
}

@media screen and (max-width: 900px) and (orientation: portrait) {
  /* Reserve room for the mobile back bar, heads-up display, mode/skin
     switches, two steering buttons, achievements and browser safe area.
     The field keeps its original 360:520 proportions instead of cropping. */
  .smk-unified-app #smkHome[data-active-page="trace"] .smk-home-shell {
    padding: 4px 6px 10px !important;
  }
  .smk-unified-app #smkHome[data-active-page="trace"] .smk-home-content {
    padding: 7px 8px 10px !important;
  }
  .smk-unified-app #smkPageTrace .smk-trace-mobile-bar {
    margin-bottom: 6px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-shell {
    width: 100% !important;
    max-width: 100% !important;
    gap: 0 !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-head {
    padding: 6px 9px !important;
    margin-bottom: 5px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-config {
    gap: 4px !important;
    padding: 5px 7px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-config-section {
    gap: 5px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-options button {
    min-height: 27px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-skins button {
    padding: 3px 1px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-hud {
    padding: 5px 3px !important;
    gap: 4px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-hud-stat {
    padding: 4px 2px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-hud-stat strong {
    font-size: 15px !important;
    margin-top: 2px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-stage {
    /* The stage height follows the dynamic viewport, not a fixed 520px.
       The viewport-based width is derived from the game's 360/520 ratio. */
    width: min(100%, 390px, calc(69.23077dvh - 252.6923px)) !important;
    min-width: min(100%, 185px) !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 360 / 520 !important;
    flex: 0 0 auto !important;
    margin: 5px auto 0 !important;
  }
  .smk-unified-app #smkTraceMount #gameModal #gameCanvas {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 360 / 520 !important;
    object-fit: contain !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-stage-overlay.trace-start {
    gap: clamp(3px, 1dvh, 9px) !important;
    padding: 6px 9px !important;
    overflow-y: auto !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-start .trace-start-mark {
    font-size: clamp(22px, 3.5dvh, 32px) !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-start h2 {
    font-size: clamp(20px, 3.5dvh, 30px) !important;
    line-height: 1.08 !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-start p {
    font-size: 10px !important;
    line-height: 1.35 !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-start .trace-cta {
    min-height: 33px !important;
    padding: 6px 12px !important;
    margin: 0 !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-start small {
    padding-top: 0 !important;
    font-size: 8px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-touch-controls {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 5px 1px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-touch-controls button {
    min-height: 37px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-bottom {
    max-width: 100% !important;
    padding: 0 1px 5px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-progress {
    padding: 6px 9px !important;
  }
  .smk-unified-app #smkTraceMount #gameModal .trace-controls-caption {
    margin-top: 4px !important;
  }
}

/* SMK 0.7.2 · TRACE fluid resize + mobile entry performance */
@media screen and (max-width:900px) and (orientation:portrait) {
  /* Setup occupies ~110px. When it disappears the track smoothly reclaims it.
     Width animates; the native 360:520 ratio produces the matching height. */
  .smk-unified-app #smkTraceMount #gameModal .trace-stage {
    width:min(100%,390px,calc(69.23077dvh - 252.6923px))!important;
    transition:width .48s cubic-bezier(.2,.75,.24,1)!important;
  }
  .smk-unified-app #smkTraceMount #gameModal.trace-in-run .trace-stage {
    width:min(100%,390px,calc(69.23077dvh - 176.6923px))!important;
  }
}
/* On shorter mobile viewports preserve natural scrolling rather than clipping
   interactive buttons, even if neither width calculation has room to grow. */
@media screen and (max-width:900px) and (orientation:landscape) {
  .smk-unified-app #smkTraceMount #gameModal .trace-stage {
    transition:width .48s cubic-bezier(.2,.75,.24,1)!important;
  }
}
@media screen and (max-width:900px) {
  /* GPU-friendly tab transition: do not animate a blur over the whole workspace. */
  .smk-unified-app .smk-page.smk-entering:not([hidden]) {
    animation:smkMobilePanelIn .24s cubic-bezier(.2,.76,.3,1) both!important;
    filter:none!important;
  }
  @keyframes smkMobilePanelIn {
    from {opacity:0;transform:translate3d(0,7px,0)}
    to {opacity:1;transform:translate3d(0,0,0)}
  }
  /* Large-area live backdrop blurs are particularly expensive on mid-range phones.
     Keep DarkGlass surfaces and gradients, with a cheaper blur radius. */
  .smk-unified-app .smk-home-sidebar,
  .smk-unified-app .smk-home-content {
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }
}
@media (prefers-reduced-motion:reduce) {
  .smk-unified-app #smkTraceMount #gameModal .trace-stage {transition:none!important;}
  .smk-unified-app .smk-page.smk-entering:not([hidden]) {animation:none!important;}
}

/* SMK 0.7.2 · Mobile splash-to-dashboard smooth paint
   A single opacity transition replaces the former 5 simultaneous nested
   animations (including animated CSS filters on full glass panels).
   The desktop entrance and all normal page transitions are unchanged. */
@media screen and (max-width:900px) {
  .next-ui-app.smk-unified-app.app-hidden {
    transform:none!important;
    transition:opacity .32s ease-out!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show {
    opacity:1!important;
    transform:none!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-home-sidebar,
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-home-content,
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-hero,
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-stats,
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-recent {
    animation:none!important;
    filter:none!important;
    transform:none!important;
    opacity:1!important;
  }
  /* Fullscreen blur on two nested glass panes cost multiple offscreen passes.
     Existing DarkGlass gradients, borders and shadows retain the appearance. */
  .smk-unified-app .smk-home-sidebar,
  .smk-unified-app .smk-home-content {
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
  /* Shorten the expensive double-layer overlap with the splash. */
  #splash.splash-exit {
    transition:opacity .28s ease-out!important;
  }
  #splash.splash-exit .splash-container {
    animation:none!important;
  }
}


/* SMK Tool 0.7.2 · Desktop boot without animation pile-up
   The shell is fully painted under the opaque splash (app.js), so only the
   splash opacity changes on screen. Normal navigation motion is untouched. */
@media screen and (min-width:901px) {
  .next-ui-app.smk-unified-app.app-hidden {
    transition:none!important;
    transform:none!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show {
    opacity:1!important;
    transform:none!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-home-sidebar,
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-home-content,
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-hero,
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-stats,
  .next-ui-app.smk-unified-app.app-hidden.app-show .smk-unified-recent {
    animation:none!important;
    filter:none!important;
    transform:none!important;
    opacity:1!important;
  }
  /* Full-size backdrop blurs require expensive offscreen GPU surfaces on
     the first desktop frame. The existing DarkGlass gradients and shadows
     already supply the visual effect on these two outer shells. */
  .smk-unified-app .smk-home-sidebar,
  .smk-unified-app .smk-home-content {
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  #splash.splash-exit {
    transition:opacity .38s ease-out!important;
  }
  #splash.splash-exit .splash-container {
    animation:none!important;
  }
}


/* SMK Tool 0.7.2 · Visible, GPU-friendly desktop splash exit.
   The old animation was invisible because its opacity/transform keyframes
   were overridden by earlier !important properties AND played under splash.
   Use explicit transition states with equal priority and a delayed trigger. */
@media screen and (min-width:901px) {
  #splash.splash-exit {
    visibility:visible!important;
    opacity:0!important;
    transition:opacity .38s ease-in-out!important;
    pointer-events:none!important;
  }
  /* One pair of lightweight transforms only: no animated filter or blur. */
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-boot-staged .smk-home-sidebar,
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-boot-staged .smk-home-content {
    animation:none!important;
    will-change:transform,opacity;
  }
  /* Stage instantly while the splash is still mostly opaque. */
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-boot-staged:not(.smk-boot-moving) .smk-home-sidebar {
    transition:none!important;
    opacity:0!important;
    transform:translate3d(-28px,0,0)!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-boot-staged:not(.smk-boot-moving) .smk-home-content {
    transition:none!important;
    opacity:0!important;
    transform:translate3d(0,22px,0)!important;
  }
  /* Both important end states supersede the original forced no-motion CSS. */
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-boot-staged.smk-boot-moving .smk-home-sidebar {
    opacity:1!important;
    transform:translate3d(0,0,0)!important;
    transition:transform .64s cubic-bezier(.2,.8,.2,1),opacity .64s ease-out!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-boot-staged.smk-boot-moving .smk-home-content {
    opacity:1!important;
    transform:translate3d(0,0,0)!important;
    transition:transform .72s cubic-bezier(.2,.8,.2,1) .08s,opacity .72s ease-out .08s!important;
  }
}
@media (prefers-reduced-motion:reduce) {
  .next-ui-app.smk-unified-app.smk-boot-staged .smk-home-sidebar,
  .next-ui-app.smk-unified-app.smk-boot-staged .smk-home-content {
    transition:none!important;
    transform:none!important;
    opacity:1!important;
    will-change:auto!important;
  }
}

/* SMK Tool v0.7.2 · Elegant mobile entrance, compositor-only.
   Prepare the dashboard under the splash, then reveal two large panels
   sequentially. Avoid blur, scale and per-card animations during boot. */
@media screen and (max-width:900px) {
  .next-ui-app.smk-unified-app.app-hidden {
    transform:none!important;
    transition:none!important;
  }
  #splash.splash-exit {
    visibility:visible!important;
    opacity:0!important;
    pointer-events:none!important;
    transition:opacity .54s cubic-bezier(.22,.61,.36,1)!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-mobile-boot-staged .smk-home-sidebar,
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-mobile-boot-staged .smk-home-content {
    animation:none!important;
    will-change:opacity,transform;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-mobile-boot-staged:not(.smk-mobile-boot-moving) .smk-home-sidebar {
    opacity:0!important;
    transform:translate3d(0,-14px,0)!important;
    transition:none!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-mobile-boot-staged:not(.smk-mobile-boot-moving) .smk-home-content {
    opacity:0!important;
    transform:translate3d(0,20px,0)!important;
    transition:none!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-mobile-boot-staged.smk-mobile-boot-moving .smk-home-sidebar {
    opacity:1!important;
    transform:translate3d(0,0,0)!important;
    transition:opacity .57s ease-out, transform .62s cubic-bezier(.2,.8,.2,1)!important;
  }
  .next-ui-app.smk-unified-app.app-hidden.app-show.smk-mobile-boot-staged.smk-mobile-boot-moving .smk-home-content {
    opacity:1!important;
    transform:translate3d(0,0,0)!important;
    transition:opacity .67s ease-out .08s, transform .7s cubic-bezier(.2,.8,.2,1) .08s!important;
  }
}
@media (prefers-reduced-motion:reduce) {
  #splash.splash-exit {transition:none!important;visibility:visible!important;opacity:0!important;}
  .next-ui-app.smk-unified-app.smk-mobile-boot-staged .smk-home-sidebar,
  .next-ui-app.smk-unified-app.smk-mobile-boot-staged .smk-home-content {
    opacity:1!important;
    transform:none!important;
    transition:none!important;
    will-change:auto!important;
  }
}


/* ============================================================
   SMK Tool 0.7.2 · Glass Classic Restore
   Возврат более матового и прозрачного glass-стиля из 0.7.1.
   Логика приложения не меняется — только визуальная подача.
============================================================ */
@media screen {
  .smk-unified-app .smk-home-sidebar {
    background:
      radial-gradient(ellipse at 12% 0%, rgba(164, 124, 241, .14), transparent 44%),
      linear-gradient(150deg, rgba(36, 30, 54, .56), rgba(11, 11, 21, .60) 46%, rgba(9, 10, 18, .50)) !important;
    border: 1px solid rgba(224, 216, 247, .16) !important;
    box-shadow:
      0 22px 58px rgba(0, 0, 0, .20),
      inset 0 1px 0 rgba(255, 255, 255, .08),
      inset 0 -1px 0 rgba(132, 116, 174, .08) !important;
    -webkit-backdrop-filter: blur(30px) saturate(118%) !important;
    backdrop-filter: blur(30px) saturate(118%) !important;
  }

  .smk-unified-app .smk-home-content {
    background:
      radial-gradient(ellipse at 100% 0%, rgba(156, 114, 223, .12), transparent 42%),
      radial-gradient(ellipse at 0% 100%, rgba(92, 170, 214, .07), transparent 34%),
      linear-gradient(148deg, rgba(31, 26, 48, .52), rgba(10, 10, 21, .56) 54%, rgba(8, 9, 18, .46)) !important;
    border: 1px solid rgba(219, 212, 241, .16) !important;
    box-shadow:
      0 24px 64px rgba(0, 0, 0, .20),
      inset 0 1px 0 rgba(255, 255, 255, .08),
      inset 0 -1px 0 rgba(130, 116, 174, .07) !important;
    -webkit-backdrop-filter: blur(30px) saturate(118%) !important;
    backdrop-filter: blur(30px) saturate(118%) !important;
  }

  .smk-unified-app .smk-home-navitem,
  .smk-unified-app .smk-home-sidebar .smk-mobile-more,
  .smk-unified-app button.smk-home-navitem {
    background: linear-gradient(145deg, rgba(42, 36, 61, .30), rgba(12, 12, 24, .20)) !important;
    border: 1px solid rgba(222, 214, 247, .10) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
    color: #c8bfdc !important;
    -webkit-backdrop-filter: blur(18px) saturate(115%) !important;
    backdrop-filter: blur(18px) saturate(115%) !important;
  }

  .smk-unified-app .smk-home-navitem:hover,
  .smk-unified-app .smk-home-sidebar .smk-mobile-more:hover,
  .smk-unified-app button.smk-home-navitem:not(.is-active):hover {
    background: linear-gradient(145deg, rgba(88, 70, 123, .28), rgba(20, 17, 35, .22)) !important;
    border-color: rgba(215, 202, 246, .18) !important;
    color: #f3efff !important;
  }

  .smk-unified-app .smk-home-navitem.is-active,
  .smk-unified-app button.smk-home-navitem.is-active,
  .smk-unified-app .smk-home-sidebar .smk-mobile-more.is-active {
    background: linear-gradient(120deg, rgba(176, 141, 246, .28), rgba(96, 83, 149, .12)) !important;
    border-color: rgba(209, 190, 248, .28) !important;
    box-shadow:
      inset 3px 0 0 rgba(198, 171, 255, .95),
      inset 0 1px 0 rgba(255, 255, 255, .08) !important;
    color: #f1e8ff !important;
  }

  .smk-unified-app .smk-unified-hero,
  .smk-unified-app .smk-home-recent,
  .smk-unified-app .smk-home-stat,
  .smk-unified-app .smk-home-tool {
    background:
      radial-gradient(ellipse at 100% 0%, rgba(159, 122, 229, .10), transparent 42%),
      linear-gradient(145deg, rgba(50, 42, 70, .30), rgba(11, 10, 21, .24)) !important;
    border: 1px solid rgba(218, 210, 243, .15) !important;
    box-shadow:
      0 16px 36px rgba(0, 0, 0, .12),
      inset 0 1px 0 rgba(255, 255, 255, .06) !important;
    -webkit-backdrop-filter: blur(22px) saturate(116%) !important;
    backdrop-filter: blur(22px) saturate(116%) !important;
  }

  .smk-unified-app .smk-home-stat:hover,
  .smk-unified-app .smk-home-tool:hover,
  .smk-unified-app .smk-home-recent:hover {
    border-color: rgba(215, 193, 248, .22) !important;
    background:
      radial-gradient(ellipse at 100% 0%, rgba(170, 133, 239, .12), transparent 42%),
      linear-gradient(145deg, rgba(60, 49, 83, .33), rgba(15, 13, 27, .27)) !important;
  }

  .smk-unified-app .smk-home-brandmark,
  .smk-unified-app .smk-home-stat-ico,
  .smk-unified-app .smk-home-tool-icon,
  .smk-unified-app .smk-home-recent-symbol,
  .smk-unified-app .smk-home-recent-icon {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 6px 18px rgba(0,0,0,.10) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    backdrop-filter: blur(14px) !important;
  }

  @media (max-width: 890px) {
    .smk-unified-app .smk-home-sidebar {
      background:
        radial-gradient(ellipse at 12% 0%, rgba(164, 124, 241, .12), transparent 42%),
        linear-gradient(150deg, rgba(35, 29, 52, .52), rgba(11, 11, 21, .54) 48%, rgba(9, 10, 18, .46)) !important;
    }
    .smk-unified-app .smk-home-content {
      background:
        radial-gradient(ellipse at 100% 0%, rgba(156, 114, 223, .10), transparent 40%),
        linear-gradient(148deg, rgba(30, 25, 46, .49), rgba(10, 10, 21, .52) 54%, rgba(8, 9, 18, .43)) !important;
    }
    .smk-unified-app .smk-home-navitem,
    .smk-unified-app button.smk-home-navitem,
    .smk-unified-app .smk-home-sidebar .smk-mobile-more {
      background: linear-gradient(145deg, rgba(40, 34, 59, .26), rgba(11, 11, 23, .16)) !important;
    }
  }
}