@media (min-width:761px) and (max-width:1799px){
  .tool-rail{
    left:14px;
    width:136px;
    padding:10px;
    border:1px solid rgba(190,205,232,.8);
    border-radius:24px;
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,250,255,.95));
    box-shadow:
      0 20px 48px rgba(38,60,107,.14),
      0 3px 10px rgba(57,84,137,.07),
      inset 0 1px 0 rgba(255,255,255,.92);
    backdrop-filter:blur(20px) saturate(125%);
    isolation:isolate;
    transition:
      width .3s cubic-bezier(.2,.8,.2,1),
      border-color .22s ease,
      box-shadow .22s ease;
  }

  .tool-rail::after{
    content:"";
    position:absolute;
    z-index:-1;
    top:14%;
    right:-7px;
    width:15px;
    height:72%;
    border-radius:50%;
    background:linear-gradient(180deg,rgba(103,135,235,.34),rgba(120,91,220,.06),rgba(239,139,81,.24));
    filter:blur(11px);
    opacity:.48;
    animation:rail-aura 5.6s ease-in-out infinite;
  }

  .tool-rail:hover,
  .tool-rail:focus-within{
    width:188px;
    border-color:rgba(148,174,232,.88);
    box-shadow:
      0 24px 62px rgba(38,60,107,.18),
      0 5px 14px rgba(57,84,137,.08),
      inset 0 1px 0 rgba(255,255,255,.96);
  }

  .tool-rail-title{
    display:flex;
    align-items:center;
    gap:7px;
    min-height:29px;
    padding:0 8px 9px;
    border-bottom:1px solid rgba(216,225,240,.82);
  }

  .tool-rail-title::before{
    content:"";
    flex:0 0 7px;
    width:7px;
    height:7px;
    border-radius:50%;
    background:linear-gradient(145deg,#5476e8,#83a0f2);
    box-shadow:0 0 0 4px rgba(84,118,232,.11);
  }

  .tool-rail-title span,
  .tool-rail-title small{
    display:block;
    white-space:nowrap;
  }

  .tool-rail-title span{
    color:#586681;
    font-size:10px;
    font-weight:850;
    letter-spacing:.06em;
  }

  .tool-rail-title small{
    max-width:0;
    overflow:hidden;
    color:#98a3b6;
    font-size:7px;
    letter-spacing:.1em;
    opacity:0;
    transition:max-width .25s ease,opacity .18s ease;
  }

  .tool-rail:hover .tool-rail-title small,
  .tool-rail:focus-within .tool-rail-title small{
    max-width:78px;
    opacity:1;
  }

  .tool-rail-more{
    display:none;
  }

  .tool-rail nav{
    gap:5px;
    margin-top:8px;
  }

  .tool-rail-item{
    position:relative;
    min-height:52px;
    flex-direction:row;
    justify-content:flex-start;
    gap:9px;
    padding:6px 8px;
    border-radius:14px;
    color:#61708b;
    animation:dock-item-in .42s both;
    transition:
      transform .17s ease,
      color .17s ease,
      border-color .17s ease,
      background .17s ease,
      box-shadow .17s ease,
      padding .25s ease;
  }

  .tool-rail-item:nth-child(2){animation-delay:.035s}
  .tool-rail-item:nth-child(3){animation-delay:.07s}
  .tool-rail-item:nth-child(4){animation-delay:.105s}
  .tool-rail-item:nth-child(5){animation-delay:.14s}

  .tool-rail:hover .tool-rail-item,
  .tool-rail:focus-within .tool-rail-item{
    gap:11px;
    padding-right:10px;
  }

  .tool-rail-item:hover{
    border-color:rgba(184,201,235,.68);
    background:rgba(240,245,255,.88);
    color:#304465;
    transform:translateX(2px);
    box-shadow:0 6px 14px rgba(52,77,126,.08);
  }

  .tool-rail-item:focus-visible{
    outline:3px solid rgba(74,108,220,.2);
    outline-offset:2px;
  }

  .tool-rail-item.is-active{
    border-color:rgba(149,174,229,.58);
    background:linear-gradient(145deg,rgba(239,244,255,.96),rgba(247,250,255,.98));
    color:#315edb;
    box-shadow:
      0 5px 13px rgba(64,98,181,.1),
      inset 0 0 0 1px rgba(255,255,255,.75);
  }

  .tool-rail-item.is-active::after{
    content:"";
    position:absolute;
    top:13px;
    right:-4px;
    width:3px;
    height:26px;
    border-radius:4px;
    background:linear-gradient(180deg,#5f7fe6,#8aa5f2,#5f7fe6);
    background-size:100% 220%;
    box-shadow:0 3px 8px rgba(63,98,194,.28);
    animation:active-beam 1.9s ease-in-out infinite;
  }

  .tool-rail-icon{
    position:relative;
    overflow:hidden;
    flex:0 0 36px;
    width:36px;
    height:36px;
    border-radius:12px;
    font-size:16px;
    box-shadow:
      0 6px 13px rgba(49,94,219,.16),
      inset 0 1px 0 rgba(255,255,255,.22);
    transition:transform .18s ease,box-shadow .18s ease;
  }

  .tool-rail-icon::before{
    content:"";
    position:absolute;
    top:-55%;
    left:-85%;
    width:42%;
    height:210%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);
    transform:rotate(18deg);
    transition:left .44s cubic-bezier(.2,.8,.2,1);
  }

  .tool-rail-item:hover .tool-rail-icon::before{
    left:145%;
  }

  .tool-rail-item:hover .tool-rail-icon{
    transform:scale(1.05) rotate(-2deg);
    box-shadow:
      0 9px 18px rgba(49,94,219,.22),
      inset 0 1px 0 rgba(255,255,255,.25);
  }

  .tool-rail-item.is-active .tool-rail-icon{
    animation:active-icon-breathe 2.8s ease-in-out infinite;
  }

  .tool-rail-copy{
    display:block;
    min-width:0;
    flex:1;
    text-align:left;
  }

  .tool-rail-copy strong{
    display:block;
    overflow:hidden;
    color:inherit;
    font-size:10px;
    font-weight:850;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .tool-rail-copy small{
    display:block;
    max-height:0;
    margin-top:0;
    overflow:hidden;
    color:#8a95aa;
    font-size:8px;
    line-height:1.3;
    opacity:0;
    text-overflow:ellipsis;
    white-space:nowrap;
    transition:max-height .2s ease,margin-top .2s ease,opacity .16s ease;
  }

  .tool-rail:hover .tool-rail-copy small,
  .tool-rail:focus-within .tool-rail-copy small{
    max-height:13px;
    margin-top:2px;
    opacity:1;
  }

  .tool-rail-icon-purple{
    background:linear-gradient(145deg,#7954d7,#a678e9);
    font-size:12px;
    font-weight:900;
  }

  .tool-rail-icon-green{
    background:linear-gradient(145deg,#168d82,#4db7a4);
    font-size:17px;
    font-weight:900;
  }

  .tool-rail-icon-sudoku,
  .sudoku-icon{
    background:linear-gradient(145deg,#e58c2f,#f4b84d);
  }

  .tool-rail-icon-prompt{
    background:linear-gradient(145deg,#ed7a4e,#f4a05f);
  }

  @keyframes rail-aura{
    0%,100%{transform:translateY(-5%) scale(.92);opacity:.34}
    50%{transform:translateY(8%) scale(1.12);opacity:.62}
  }

  @keyframes dock-item-in{
    from{opacity:0;transform:translateX(-8px)}
    to{opacity:1;transform:translateX(0)}
  }

  @keyframes active-beam{
    0%,100%{background-position:50% 0;box-shadow:0 3px 8px rgba(63,98,194,.22)}
    50%{background-position:50% 100%;box-shadow:0 4px 12px rgba(63,98,194,.4)}
  }

  @keyframes active-icon-breathe{
    0%,100%{filter:saturate(1);box-shadow:0 7px 14px rgba(49,94,219,.17),inset 0 1px 0 rgba(255,255,255,.24)}
    50%{filter:saturate(1.1) brightness(1.035);box-shadow:0 10px 21px rgba(49,94,219,.27),0 0 0 4px rgba(94,125,226,.07),inset 0 1px 0 rgba(255,255,255,.27)}
  }
}

@media (min-width:761px) and (max-width:1799px) and (max-height:680px){
  .tool-rail{
    width:126px;
    padding:8px;
  }

  .tool-rail:hover,
  .tool-rail:focus-within{
    width:178px;
  }

  .tool-rail-title{
    display:none;
  }

  .tool-rail nav{
    gap:3px;
    margin-top:0;
  }

  .tool-rail-item{
    min-height:46px;
    padding:5px 7px;
  }

  .tool-rail-icon{
    flex-basis:32px;
    width:32px;
    height:32px;
  }

  .tool-rail-item.is-active::after{
    top:11px;
    height:24px;
  }
}

@media (prefers-reduced-motion:reduce){
  .tool-rail,
  .tool-rail-item,
  .tool-rail-icon,
  .tool-rail::after,
  .tool-rail-item.is-active::after{
    animation:none;
    transition:none;
  }
}