.strip {
   position:fixed;
   top:0;
   left:0;
   right:0;
   z-index:var(--z-strip);
   min-height:var(--strip-h);
   background:var(--slate);
   color:var(--on-dark);
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   letter-spacing:0.04em;
}

.strip__inner {
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:var(--s-4);
   height:var(--strip-h);
   padding-inline:calc(var(--frame) + var(--gutter));
   max-width:calc(var(--shell) + var(--gutter) * 2 + var(--frame) * 2);
   margin-inline:auto;
   min-width:0;
}

.strip__group {
   display:flex;
   align-items:center;
   gap:clamp(0.75rem, 2.4vw, 2rem);
   min-width:0;
}

.strip__item,
.strip__link {
   display:inline-flex;
   align-items:center;
   gap:0.5em;
   min-height:44px;
   min-width:0;
   white-space:nowrap;
   overflow:hidden;
   text-overflow:ellipsis;
   color:var(--on-dark-soft);
}

.strip__link {
   color:var(--on-dark);
   text-decoration:none;
   padding-inline:0.15rem;
   transition:color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.strip__link:hover {
   color:var(--signal-bright);
   box-shadow:inset 0 -1px 0 var(--signal-bright);
}

.strip__link:active {
   color:var(--paper);
   box-shadow:inset 0 -2px 0 var(--signal);
}

.strip__link:focus-visible {
   outline:2px solid var(--signal-bright);
   outline-offset:-2px;
   box-shadow:none;
   color:var(--paper);
}

.strip__link .icon {
   width:0.95rem;
   height:0.95rem;
   color:var(--signal-bright);
}

.strip__cta {
   display:inline-flex;
   align-items:center;
   gap:0.45em;
   min-height:32px;
   padding:0.3rem 0.75rem;
   border:1px solid var(--rule-dark);
   color:var(--paper);
   text-decoration:none;
   white-space:nowrap;
   transition:background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}

.strip__cta:hover {
   background:var(--paper);
   border-color:var(--paper);
   color:var(--ink);
}

.strip__cta:active {
   background:var(--mist);
   border-color:var(--mist);
   color:var(--ink);
}

.strip__cta:focus-visible {
   outline:2px solid var(--signal-bright);
   outline-offset:2px;
   color:var(--paper);
}

.strip__cta .icon {
   width:0.85rem;
   height:0.85rem;
}

@media (max-width: 899.98px) {
   .strip__item--city { display: none; }
}

@media (max-width: 639.98px) {
   .strip__link--email { display: none; }
}

@media (max-width: 359.98px) {
   .strip__inner { padding-inline: calc(var(--frame) + 0.75rem); gap: 0.5rem; }
   .strip__cta { padding-inline: 0.55rem; }
}

.site-header {
   position:sticky;
   top:var(--strip-h);
   z-index:var(--z-header);
   background:var(--paper);
   border-bottom:var(--hairline);
   transition:box-shadow var(--dur-base) var(--ease-out), background-color var(--dur-base) var(--ease-out);
}

.site-header__inner {
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:var(--s-5);
   min-height:var(--header-h);
   padding-block:var(--s-3);
   transition:min-height var(--dur-slow) var(--ease-editorial), padding var(--dur-slow) var(--ease-editorial);
}

.site-header.is-condensed {
   box-shadow:0 10px 24px -20px rgba(18, 24, 32, 0.55);
}

.site-header.is-condensed .site-header__inner {
   min-height:3.75rem;
   padding-block:var(--s-2);

}

.site-header.is-condensed .brand img {
   height:1.8rem;
}

.brand {
   display:inline-flex;
   align-items:center;
   flex:none;
   min-height:44px;
   text-decoration:none;
   transition:opacity var(--dur-fast) var(--ease-out);
}

.brand img {
   height:2.1rem;
   width:auto;
   background:none;
   transition:height var(--dur-slow) var(--ease-editorial);
}

.brand:hover { opacity: 0.78; }
.brand:active { opacity: 0.6; }
.brand:focus-visible { outline-offset: 4px; box-shadow: none; }

.nav__list {
   display:flex;
   flex-wrap:wrap;
   align-items:center;
   justify-content:flex-end;
   gap:0 clamp(0.1rem, 0.8vw, 0.6rem);
   margin:0;
   padding:0;
   list-style:none;
}

.nav__list > li {
   min-width:0;
}

.nav__link {
   position:relative;
   display:inline-flex;
   align-items:center;
   min-height:44px;
   padding:0.5rem 0.6rem;
   font-family:var(--tohu-1a4);
   font-size:0.98rem;
   font-weight:600;
   letter-spacing:0.005em;
   color:var(--ink);
   text-decoration:none;
   transition:color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
}

.nav__link::after {
   content:"";
   position:absolute;
   left:0.6rem;

   right:0.6rem;

   bottom:0.45rem;
   height:1px;
   background:var(--signal);
   transform:scaleX(0);
   transform-origin:left center;
   transition:transform var(--dur-base) var(--ease-out);
}

.nav__link:hover {
   color:var(--signal-text);
   background:var(--paper-deep);
}

.nav__link:hover::after {
   transform:scaleX(1);
}

.nav__link:active {
   background:var(--mist);
   color:var(--ink);
}

.nav__link:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:0;
   box-shadow:none;
}

.nav__link[aria-current="page"] {
   color:var(--ink);
}

.nav__link[aria-current="page"]::after {
   transform:scaleX(1);
   height:2px;
   background:var(--ink);
}

.nav__link--accent {
   color:var(--signal-text);
}

.nav__index {
   display:none;
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   font-weight:400;
   color:var(--steel-ink);
   margin-right:0.9rem;
   min-width:1.5rem;
}

.nav__foot {
   display:none;
}

.nav-toggle {
   display:none;
   align-items:center;
   gap:0.55rem;
   min-height:44px;
   min-width:44px;
   padding:0.55rem 0.9rem;
   background:transparent;
   border:var(--hairline-ink);
   border-radius:0;
   font-family:var(--tohu-fae);
   font-size:var(--step--1);
   letter-spacing:0.06em;
   text-transform:uppercase;
   color:var(--ink);
   transition:background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.nav-toggle .icon {
   width:1.15rem;
   height:1.15rem;
}

.nav-toggle__close { display: none; }

.nav-toggle:hover {
   background:var(--ink);
   color:var(--paper);
}

.nav-toggle:active {
   background:var(--slate);
   color:var(--paper);
   box-shadow:var(--shadow-press);
}

.nav-toggle:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:3px;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__open { display: none; }
.nav-toggle[aria-expanded="true"] .nav-toggle__close { display: inline; }

@media (max-width: 899.98px) {
   .nav-toggle {
      display:inline-flex;
   }

   .nav {
      position:fixed;
      top:calc(var(--strip-h) + var(--header-h));
      left:var(--frame);
      right:var(--frame);
      bottom:var(--frame);
      z-index:var(--z-sheet);
      background:var(--paper);
      border-top:var(--hairline-ink);
      overflow-y:auto;
      overscroll-behavior:contain;
      padding:var(--s-5) var(--gutter) var(--s-7);
      visibility:hidden;
      opacity:0;
      transform:translateY(-0.5rem);
      transition:opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out), visibility 0s linear var(--dur-base);
   }

   .site-header.is-condensed .nav {
      top:calc(var(--strip-h) + 3.75rem);
   }

   .nav.is-open {
      visibility:visible;
      opacity:1;
      transform:none;
      transition:opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out), visibility 0s;
   }

   html:not(.js) .nav {
      position:static;
      visibility:visible;
      opacity:1;
      transform:none;
      padding:0 0 var(--s-4);
      border-top:0;
      width:100%;
   }

   html:not(.js) .site-header__inner {
      flex-wrap:wrap;
   }

   html:not(.js) .nav-toggle {
      display:none;
   }

   .nav__list {
      flex-direction:column;
      align-items:stretch;
      gap:0;
   }

   .nav__list > li {
      border-bottom:var(--hairline);
   }

   .nav__link {
      width:100%;
      min-height:3.5rem;
      padding:0.75rem 0.25rem;
      font-family:var(--tohu-3a3);
      font-size:clamp(1.45rem, 6vw, 2rem);
      font-weight:500;
      letter-spacing:-0.01em;
   }

   .nav__link::after {
      left:0.25rem;
      right:auto;
      width:2.5rem;
      bottom:0.6rem;
   }

   .nav__index {
      display:inline-block;
   }

   .nav__foot {
      display:grid;
      gap:var(--s-2);
      margin-top:var(--s-6);
      font-family:var(--tohu-fae);
      font-size:var(--step--1);
      color:var(--steel-ink);
   }

   .nav__foot a {
      display:inline-flex;
      align-items:center;
      gap:0.5rem;
      min-height:44px;
      color:var(--ink);
      text-decoration:none;
   }

   .nav__foot a:hover { color: var(--signal-text); }
   .nav__foot a:active { color: var(--ink-soft); }
}

html.nav-open,
html.nav-open body {
   overflow:hidden;
}

@media (min-width: 900px) and (max-width: 1099.98px) {
   .nav__link {
      padding-inline:0.42rem;
      font-size:0.93rem;
   }
   .nav__link::after { left: 0.42rem; right: 0.42rem; }
}

.btn {
   position:relative;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   gap:0.65rem;
   min-height:48px;
   max-width:100%;
   padding:0.85rem 1.4rem;
   border:var(--hairline-ink);
   border-radius:0;
   background:transparent;
   color:var(--ink);
   font-family:var(--tohu-1a4);
   font-size:1rem;
   font-weight:600;
   line-height:1.2;
   letter-spacing:0.01em;
   text-align:center;
   text-decoration:none;
   overflow-wrap:anywhere;
   cursor:pointer;
   transform:translate3d(var(--mx, 0px), var(--my, 0px), 0);
   transition:background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), transform var(--dur-slow) var(--ease-magnetic);
}

.btn::after {
   content:"";
   position:absolute;
   left:1.4rem;
   right:1.4rem;
   bottom:0.55rem;
   height:1px;
   background:currentColor;
   opacity:0;
   transform:scaleX(0.3);
   transform-origin:left center;
   transition:transform var(--dur-base) var(--ease-out), opacity var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
}

.btn .icon {
   width:1.05rem;
   height:1.05rem;
   transition:transform var(--dur-base) var(--ease-out);
}

.btn:hover {
   background:var(--mist);
   color:var(--ink);
   box-shadow:var(--shadow-lift);
}

.btn:hover::after {
   opacity:1;
   transform:scaleX(1);
   background:var(--signal);
}

.btn:hover .icon--trail {
   transform:translateX(3px);
}

.btn:active {
   background:var(--rule);
   box-shadow:var(--shadow-press);
}

.btn:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:3px;
   box-shadow:none;
}

.btn--primary {
   background:var(--ink);
   border-color:var(--ink);
   color:var(--paper);
}

.btn--primary:hover {
   background:var(--slate);
   border-color:var(--slate);
   color:var(--paper);
}

.btn--primary:active {
   background:var(--slate-deep);
   border-color:var(--slate-deep);
   color:var(--paper);
}

.btn--light {
   border-color:var(--rule-dark);
   color:var(--on-dark);
}

.btn--light:hover {
   background:var(--paper);
   border-color:var(--paper);
   color:var(--ink);
}

.btn--light:active {
   background:var(--mist);
   color:var(--ink);
}

.btn--light:focus-visible {
   outline-color:var(--signal-bright);
}

.btn--solid-light {
   background:var(--paper);
   border-color:var(--paper);
   color:var(--ink);
}

.btn--solid-light:hover {
   background:var(--mist);
   border-color:var(--mist);
   color:var(--ink);
}

.btn--solid-light:active {
   background:var(--rule);
}

.btn--small {
   min-height:44px;
   padding:0.6rem 1rem;
   font-size:var(--step--1);
}

.btn--small::after {
   left:1rem;
   right:1rem;
   bottom:0.4rem;
}

.btn--block {
   width:100%;
}

.btn[disabled],
.btn[aria-disabled="true"] {
   opacity:0.55;
   cursor:not-allowed;
   box-shadow:none;
}

.btn-row {
   display:flex;
   flex-wrap:wrap;
   gap:var(--s-3);
   align-items:center;
}

.btn-row > * {
   min-width:0;
}

.link-arrow {
   display:inline-flex;
   align-items:center;
   gap:0.5rem;
   min-height:44px;
   padding-block:0.4rem;
   font-weight:600;
   color:var(--ink);
   text-decoration:none;
   box-shadow:inset 0 -1px 0 var(--rule);
   transform:translate3d(var(--mx, 0px), var(--my, 0px), 0);
   transition:color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), transform var(--dur-slow) var(--ease-magnetic);
}

.link-arrow .icon {
   width:1rem;
   height:1rem;
   transition:transform var(--dur-base) var(--ease-out);
}

.link-arrow:hover {
   color:var(--signal-text);
   box-shadow:inset 0 -2px 0 var(--signal);
}

.link-arrow:hover .icon {
   transform:translateX(3px);
}

.link-arrow:active {
   color:var(--ink);
   box-shadow:inset 0 -2px 0 var(--ink);
}

.link-arrow:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:3px;
   box-shadow:inset 0 -2px 0 var(--signal);
}

.link-arrow--light {
   color:var(--on-dark);
   box-shadow:inset 0 -1px 0 var(--rule-dark);
}

.link-arrow--light:hover {
   color:var(--signal-bright);
   box-shadow:inset 0 -2px 0 var(--signal-bright);
}

.link-arrow--light:active {
   color:var(--paper);
}

[data-magnetic] {
   will-change:auto;
}

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
   .btn,
   .link-arrow,
   [data-magnetic] {
      --mx:0px;
      --my:0px;
   }
}

.tag {
   display:inline-flex;
   align-items:center;
   gap:0.4rem;
   min-height:28px;
   padding:0.2rem 0.6rem;
   border:var(--hairline);
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   letter-spacing:0.06em;
   text-transform:uppercase;
   color:var(--steel-ink);
   max-width:100%;
   overflow-wrap:anywhere;
}

.tag--signal {
   border-color:var(--signal);
   color:var(--signal-text);
}

.rotator {
   display:inline-block;
   position:relative;
   vertical-align:bottom;
   color:var(--signal-text);
   font-style:italic;
   font-weight:400;
   max-width:100%;
}

.rotator__slot {
   display:inline-grid;
   vertical-align:bottom;
   overflow:hidden;
   padding-bottom:0.08em;
   margin-bottom:-0.08em;
   max-width:100%;
}

.rotator__word {
   grid-area:1 / 1;
   white-space:nowrap;
   max-width:100%;
   padding-right:0.06em;
}

.rotator__word:not(:first-child) {
   display:none;
}

.rotator.is-live .rotator__slot {
   width:var(--rotator-w, auto);
   transition:width var(--dur-rotate) var(--ease-editorial);
}

.rotator.is-live .rotator__word {
   display:block;
   opacity:0;
   transform:translateY(105%);
   transition:transform var(--dur-rotate) var(--ease-editorial), opacity var(--dur-rotate) var(--ease-out);
}

.rotator.is-live .rotator__word.is-active {
   opacity:1;
   transform:translateY(0);
}

.rotator.is-live .rotator__word.is-leaving {
   opacity:0;
   transform:translateY(-105%);
}

.rotator__rule {
   position:absolute;
   left:0;
   right:0.06em;
   bottom:0.02em;
   height:2px;
   background:var(--signal);
   transform-origin:left center;
}

@media (prefers-reduced-motion: reduce) {
   .rotator.is-live .rotator__word { display: none; transition: none; }
   .rotator.is-live .rotator__word:first-child { display: block; opacity: 1; transform: none; }
   .rotator.is-live .rotator__slot { width: auto; }
}

.word-index {
   display:flex;
   flex-wrap:wrap;
   gap:0.25rem 1.25rem;
   margin:0;
   padding:0;
   list-style:none;
   font-family:var(--tohu-fae);
   font-size:var(--step--1);
   color:var(--steel-ink);
}

.word-index li {
   display:inline-flex;
   gap:0.45rem;
   min-width:0;
}

.word-index li::before {
   content:attr(data-n);
   color:var(--rule);
}

.word-index .is-current {
   color:var(--signal-text);
}

.tabs {
   position:relative;
}

.tabs__rail {
   position:sticky;
   top:calc(var(--strip-h) + 3.75rem);
   z-index:5;
   display:flex;
   gap:0;
   overflow-x:auto;
   scrollbar-width:none;
   background:var(--mist);
   border-top:var(--hairline);
   border-bottom:var(--hairline);
}

.tabs__rail::-webkit-scrollbar {
   display:none;
}

.tabs__rail-inner {
   display:flex;
   width:min(var(--shell), 100% - var(--gutter) * 2);
   margin-inline:auto;
   min-width:max-content;
}

.tabs__tab {
   position:relative;
   flex:0 0 auto;
   display:inline-flex;
   align-items:baseline;
   gap:0.6rem;
   min-height:3.5rem;
   padding:0.95rem clamp(0.9rem, 2.2vw, 1.75rem);
   background:transparent;
   border:0;
   border-right:var(--hairline);
   border-radius:0;
   color:var(--steel-ink);
   font-family:var(--tohu-1a4);
   font-size:1rem;
   font-weight:600;
   text-decoration:none;
   white-space:nowrap;
   transition:background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}

.tabs__tab:first-child {
   border-left:var(--hairline);
}

.tabs__tab::after {
   content:"";
   position:absolute;
   left:0;
   right:0;
   bottom:-1px;
   height:3px;
   background:var(--signal);
   transform:scaleX(0);
   transform-origin:left center;
   transition:transform var(--dur-base) var(--ease-out);
}

.tabs__num {
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   font-weight:400;
   color:var(--ink-soft);
}

.tabs__tab:hover {
   background:var(--paper-deep);
   color:var(--ink);
}

.tabs__tab:active {
   background:var(--rule-soft);
   color:var(--ink);
}

.tabs__tab:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:-2px;
   box-shadow:none;
}

.tabs__tab[aria-selected="true"],
.tabs__tab.is-active {
   background:var(--paper);
   color:var(--ink);
}

.tabs__tab[aria-selected="true"]::after,
.tabs__tab.is-active::after {
   transform:scaleX(1);
}

.tabs__tab[aria-selected="true"] .tabs__num {
   color:var(--signal-text);
}

.tabs__panel {
   padding-block:var(--section-pad);
}

.tabs__panel + .tabs__panel {
   border-top:var(--hairline);
}

.js .tabs.is-ready .tabs__panel + .tabs__panel {
   border-top:0;
}

.tabs__panel:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:-6px;
}

.panel-head {
   display:grid;
   gap:var(--s-3);
   margin-bottom:clamp(2rem, 5vw, 3.5rem);
   max-width:48rem;
}

.figure {
   margin:0;
   min-width:0;
}

.figure__frame {
   position:relative;
   overflow:hidden;
   background:var(--mist);
   border:var(--hairline);
}

.figure__frame img {
   width:100%;
   height:100%;
   object-fit:cover;
}

.figure__caption {
   display:grid;
   grid-template-columns:auto minmax(0, 1fr);
   gap:0.25rem 1rem;
   padding-top:0.75rem;
   margin-top:0.75rem;
   border-top:var(--hairline-ink);
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   line-height:1.55;
   color:var(--steel-ink);
}

.figure__no {
   color:var(--ink);
   font-weight:500;
   letter-spacing:0.06em;
   text-transform:uppercase;
}

.figure__text {
   min-width:0;
}

.ledger {
   display:grid;
   margin:0;
   border-top:var(--hairline-ink);
}

.ledger__row {
   display:grid;
   grid-template-columns:minmax(0, 11rem) minmax(0, 1fr);
   gap:var(--s-2) var(--s-5);
   padding-block:1rem;
   border-bottom:var(--hairline);
   align-items:baseline;
}

.ledger__key,
.ledger dt {
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   letter-spacing:0.08em;
   text-transform:uppercase;
   color:var(--steel-ink);
}

.ledger__value,
.ledger dd {
   margin:0;
   min-width:0;
}

.ledger__figure {
   font-family:var(--tohu-3a3);
   font-size:var(--tohu-d72);
   line-height:1;
   letter-spacing:-0.02em;
}

@media (max-width: 479.98px) {
   .ledger__row { grid-template-columns: 1fr; }
}

.service-list {
   margin:0;
   padding:0;
   list-style:none;
   border-top:var(--hairline-ink);
}

.service-row {
   position:relative;
   border-bottom:var(--hairline);
}

.service-row__link {
   display:grid;
   grid-template-columns:3.25rem minmax(0, 1fr) auto;
   grid-template-areas:
      "num name price"
      "num desc thumb";
   gap:0.35rem clamp(1rem, 3vw, 2.5rem);
   align-items:baseline;
   padding:clamp(1.25rem, 3vw, 2rem) 0.5rem;
   color:inherit;
   text-decoration:none;
   transition:background-color var(--dur-base) var(--ease-out), padding var(--dur-slow) var(--ease-editorial);
}

.service-row__num {
   grid-area:num;
   font-family:var(--tohu-fae);
   font-size:var(--step--1);
   color:var(--steel-ink);
}

.service-row__name {
   grid-area:name;
   font-family:var(--tohu-3a3);
   font-size:var(--tohu-69d);
   font-weight:500;
   line-height:1.04;
   letter-spacing:-0.022em;
   min-width:0;
   overflow-wrap:break-word;
   transition:color var(--dur-fast) var(--ease-out);
}

.service-row__desc {
   grid-area:desc;
   max-width:54ch;
   color:var(--ink-soft);
}

.service-row__price {
   grid-area:price;
   justify-self:end;
   font-family:var(--tohu-fae);
   font-size:var(--step--1);
   color:var(--ink);
   white-space:nowrap;
}

.service-row__price small {
   display:block;
   font-size:var(--step--2);
   color:var(--steel-ink);
   text-align:right;
}

.service-row__thumb {
   grid-area:thumb;
   justify-self:end;
   width:clamp(5.5rem, 14vw, 8rem);
   aspect-ratio:4 / 3;
   object-fit:cover;
   border:var(--hairline);
}

.service-row__link:hover {
   background:var(--paper-deep);
}

.service-row__link:hover .service-row__name {
   color:var(--signal-text);
}

.service-row__link:active {
   background:var(--mist);
}

.service-row__link:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:-2px;
   box-shadow:none;
}

@media (max-width: 639.98px) {
   .service-row__link {
      grid-template-columns:2.25rem minmax(0, 1fr);
      grid-template-areas:
         "num name"
         "num desc"
         "num price"
         "num thumb";
   }
   .service-row__price { justify-self: start; white-space: normal; }
   .service-row__price small { text-align: left; }
   .service-row__thumb { justify-self: start; width: 100%; max-width: 20rem; margin-top: 0.5rem; }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
   .js .has-preview .service-row__thumb {
      display:none;
   }
   .js .has-preview .service-row__link {
      grid-template-areas:
         "num name price"
         "num desc price";
   }
}

.hover-preview {
   position:fixed;
   top:0;
   left:0;
   z-index:var(--z-preview);
   width:clamp(14rem, 22vw, 20rem);
   aspect-ratio:4 / 3;
   pointer-events:none;
   overflow:hidden;
   background:var(--mist);
   box-shadow:var(--shadow-panel);
   opacity:0;
   visibility:hidden;
   transform:translate3d(var(--px, -50%), var(--py, -50%), 0) scale(0.94);
   transition:opacity var(--dur-base) var(--ease-out), visibility 0s linear var(--dur-base);
}

.hover-preview.is-visible {
   opacity:1;
   visibility:visible;
   transition:opacity var(--dur-base) var(--ease-out), visibility 0s;
}

.hover-preview img {
   position:absolute;
   inset:0;
   width:100%;
   height:100%;
   object-fit:cover;
   opacity:0;
   transition:opacity var(--dur-base) var(--ease-out);
}

.hover-preview img.is-active {
   opacity:1;
}

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
   .hover-preview { display: none !important; }
}

.index-list {
   display:grid;
   grid-template-columns:repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
   margin:0;
   padding:0;
   list-style:none;
   border-top:var(--hairline);
}

.index-list li {
   border-bottom:var(--hairline);
   min-width:0;
}

.index-list a {
   display:flex;
   align-items:baseline;
   justify-content:space-between;
   gap:1rem;
   min-height:44px;
   padding:0.85rem 0.25rem;
   color:var(--ink);
   text-decoration:none;
   transition:background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}

.index-list__name {
   min-width:0;
}

.index-list__price {
   flex:none;
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   color:var(--steel-ink);
}

.index-list a:hover {
   background:var(--paper-deep);
   color:var(--signal-text);
}

.index-list a:active {
   background:var(--mist);
}

.index-list a:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:-2px;
   box-shadow:none;
}

.case {
   display:grid;
   gap:var(--s-4);
   padding-block:var(--s-6);
   border-top:var(--hairline-ink);
   min-width:0;
}

.case__head {
   display:flex;
   flex-wrap:wrap;
   align-items:baseline;
   justify-content:space-between;
   gap:var(--s-2) var(--s-4);
}

.case__title {
   font-size:var(--tohu-d72);
}

.case__steps {
   display:grid;
   grid-template-columns:repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
   gap:var(--s-4) var(--s-6);
   margin:0;
}

.case__steps > div {
   min-width:0;
}

.case__steps dt {
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   letter-spacing:0.1em;
   text-transform:uppercase;
   color:var(--signal-text);
   margin-bottom:0.35rem;
}

.case__steps dd {
   margin:0;
   color:var(--ink-soft);
}

.steps {
   display:grid;
   grid-template-columns:repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
   margin:0;
   padding:0;
   list-style:none;
   border-top:var(--hairline-ink);
   counter-reset:step;
}

.steps__item {
   display:grid;
   gap:var(--s-2);
   align-content:start;
   padding:var(--s-5) var(--s-5) var(--s-5) 0;
   border-bottom:var(--hairline);
   min-width:0;
}

.steps__no {
   font-family:var(--tohu-fae);
   font-size:var(--step--1);
   color:var(--signal-text);
}

.steps__title {
   font-family:var(--tohu-3a3);
   font-size:var(--tohu-24e);
   line-height:1.1;
}

.steps__time {
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   color:var(--steel-ink);
}

@media (min-width: 900px) {
   .steps__item + .steps__item {
      padding-left:var(--s-5);
      border-left:var(--hairline);
   }
}

.spec-table {
   width:100%;
   border-top:var(--hairline-ink);
   font-size:var(--step--1);
}

.spec-table caption {
   caption-side:top;
   text-align:left;
   padding-bottom:0.75rem;
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   letter-spacing:0.1em;
   text-transform:uppercase;
   color:var(--steel-ink);
}

.spec-table th,
.spec-table td {
   padding:0.85rem 0.9rem 0.85rem 0;
   text-align:left;
   vertical-align:top;
   border-bottom:var(--hairline);
}

.spec-table thead th {
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   font-weight:500;
   letter-spacing:0.08em;
   text-transform:uppercase;
   color:var(--steel-ink);
   border-bottom-color:var(--ink);
}

.spec-table tbody th {
   font-weight:600;
   color:var(--ink);
}

.spec-table td.num,
.spec-table .price {
   font-family:var(--tohu-fae);
   white-space:nowrap;
}

.spec-table tbody tr {
   transition:background-color var(--dur-fast) var(--ease-out);
}

.spec-table tbody tr:hover {
   background:var(--paper-deep);
}

@media (max-width: 639.98px) {
   .spec-table--stack thead,
   .bose8e6 > .spec-table--stack > thead { display: none; }
   .spec-table--stack tr { display: grid; padding-block: 0.75rem; border-bottom: var(--hairline); }
   .spec-table--stack th,
   .spec-table--stack td { display: block; padding: 0.15rem 0; border: 0; white-space: normal; }
   .bose8e6 > .spec-table--stack { min-width: 0; }
   .bose8e6 > .spec-table--stack,
   .bose8e6 > .spec-table--stack > tbody { display: block; }
   .bose8e6 > .spec-table--stack tr { display: grid; }
   .bose8e6 > .spec-table--stack th,
   .bose8e6 > .spec-table--stack td { display: block; }
   .spec-table--stack td[data-label]::before {
      content:attr(data-label);
      display:block;
      font-family:var(--tohu-fae);
      font-size:var(--step--2);
      letter-spacing:0.08em;
      text-transform:uppercase;
      color:var(--steel-ink);
   }
}

.form {
   display:grid;
   gap:var(--s-5);
   min-width:0;
}

.form__grid {
   display:grid;
   grid-template-columns:repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
   gap:var(--s-5) var(--s-5);
}

.form__grid > * {
   min-width:0;
}

.field {
   display:grid;
   gap:0.4rem;
   min-width:0;
}

.field--full {
   grid-column:1 / -1;
}

.field__label,
.field > label,
.fieldset__legend {
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   font-weight:500;
   letter-spacing:0.08em;
   text-transform:uppercase;
   color:var(--ink);
}

.field__opt {
   color:var(--steel-ink);
   text-transform:none;
   letter-spacing:0.02em;
}

.field__hint {
   font-size:var(--step--1);
   color:var(--steel-ink);
}

.field__input,
.field input:not([type="checkbox"]):not([type="radio"]),
.field select,
.field textarea {
   width:100%;
   min-height:48px;
   padding:0.7rem 0.85rem;
   background:#fbfbfa;
   border:1px solid var(--rule);
   border-bottom-color:var(--ink);
   border-radius:var(--radius-input);
   color:var(--ink);
   font-family:var(--tohu-1a4);
   font-size:1rem;
   line-height:1.4;
   appearance:none;
   transition:border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
}

.field textarea {
   min-height:8.5rem;
   resize:vertical;
}

.field select {
   padding-right:2.5rem;
   background-image:linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%);
   background-position:calc(100% - 1.15rem) 50%, calc(100% - 0.8rem) 50%;
   background-size:0.35rem 0.35rem;
   background-repeat:no-repeat;
}

.field input::placeholder,
.field textarea::placeholder {
   color:var(--steel);
}

.field__input:hover,
.field input:not([type="checkbox"]):not([type="radio"]):hover,
.field select:hover,
.field textarea:hover {
   border-color:var(--steel);
   border-bottom-color:var(--ink);
   background-color:#fff;
}

.field__input:focus-visible,
.field input:not([type="checkbox"]):not([type="radio"]):focus-visible,
.field select:focus-visible,
.field textarea:focus-visible,
.field__input:focus,
.field input:not([type="checkbox"]):not([type="radio"]):focus,
.field select:focus,
.field textarea:focus {
   outline:none;
   border-color:var(--signal);
   background-color:#fff;
   box-shadow:0 0 0 1px var(--signal), 0 0 0 4px var(--signal-wash);
}

.field__error {
   display:none;
   align-items:flex-start;
   gap:0.4rem;
   font-size:var(--step--1);
   font-weight:600;
   color:var(--danger);
}

.field.is-invalid .field__error,
.field__error:not(:empty) {
   display:flex;
}

.field.is-invalid input:not([type="checkbox"]),
.field.is-invalid select,
.field.is-invalid textarea,
.field [aria-invalid="true"] {
   border-color:var(--danger);
   background-color:var(--danger-wash);
}

.check {
   display:grid;
   grid-template-columns:1.4rem minmax(0, 1fr);
   gap:0.75rem;
   align-items:start;
   min-height:44px;
   font-size:var(--step--1);
   line-height:1.5;
   color:var(--ink-soft);
   cursor:pointer;
}

.check input {
   width:1.4rem;
   height:1.4rem;
   margin:0.1rem 0 0;
   border:1px solid var(--ink);
   border-radius:var(--radius-input);
   background:#fbfbfa;
   appearance:none;
   display:grid;
   place-content:center;
   cursor:pointer;
   transition:background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.check input[type="radio"] {
   border-radius:50%;
}

.check input::before {
   content:"";
   width:0.7rem;
   height:0.7rem;
   background:var(--paper);
   clip-path:polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
   transform:scale(0);
   transition:transform var(--dur-fast) var(--ease-out);
}

.check input[type="radio"]::before {
   clip-path:circle(50%);
   width:0.55rem;
   height:0.55rem;
}

.check input:checked {
   background:var(--ink);
}

.check input:checked::before {
   transform:scale(1);
}

.check input:hover {
   border-color:var(--signal);
   box-shadow:0 0 0 3px var(--signal-wash);
}

.check input:active {
   background:var(--mist);
}

.check input:checked:active {
   background:var(--slate);
}

.check input:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:3px;
}

.check a {
   text-decoration-color:var(--signal);
}

.field.is-invalid .check input {
   border-color:var(--danger);
   background-color:var(--danger-wash);
}

.fieldset {
   border:0;
   padding:0;
   margin:0;
   min-width:0;
}

.choice-row {
   display:flex;
   flex-wrap:wrap;
   gap:var(--s-2);
   margin-top:0.5rem;
}

.choice {
   position:relative;
   min-width:0;
}

.choice input {
   position:absolute;
   opacity:0;
   inset:0;
   width:100%;
   height:100%;
   margin:0;
   cursor:pointer;
}

.choice span {
   display:inline-flex;
   align-items:center;
   min-height:44px;
   padding:0.55rem 1rem;
   border:1px solid var(--rule);
   background:#fbfbfa;
   font-size:var(--step--1);
   font-weight:600;
   transition:background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}

.choice input:hover + span {
   border-color:var(--ink);
   background:#fff;
}

.choice input:active + span {
   background:var(--mist);
}

.choice input:checked + span {
   background:var(--ink);
   border-color:var(--ink);
   color:var(--paper);
}

.choice input:focus-visible + span {
   outline:2px solid var(--signal);
   outline-offset:3px;
}

.hp {
   position:absolute !important;
   left:-10000px !important;
   top:auto !important;
   width:1px !important;
   height:1px !important;
   overflow:hidden !important;
}

.form__foot {
   display:flex;
   flex-wrap:wrap;
   align-items:center;
   justify-content:space-between;
   gap:var(--s-4);
}

.form__note {
   font-size:var(--step--1);
   color:var(--steel-ink);
   max-width:44ch;
}

.form__status {
   padding:0.85rem 1rem;
   border-left:3px solid var(--signal);
   background:var(--signal-wash);
   font-size:var(--step--1);
}

.form__status:empty {
   display:none;
}

.form__status.is-error {
   border-left-color:var(--danger);
   background:var(--danger-wash);
   color:var(--danger);
}

.form.is-sending .btn[type="submit"] {
   opacity:0.7;
   cursor:progress;
}

.site-footer {
   background:var(--slate);
   color:var(--on-dark);
   padding-top:clamp(3rem, 7vw, 5.5rem);
   font-size:var(--step--1);
}

.site-footer a {
   color:var(--on-dark);
   text-decoration-color:var(--rule-dark);
}

.site-footer a:hover {
   color:var(--signal-bright);
   text-decoration-color:var(--signal-bright);
}

.site-footer a:active {
   color:var(--paper);
}

.site-footer a:focus-visible {
   outline-color:var(--signal-bright);
   box-shadow:none;
}

.footer__top {
   display:grid;
   grid-template-columns:minmax(0, 1.4fr) repeat(3, minmax(0, 1fr));
   gap:var(--s-6) clamp(1.5rem, 4vw, 3.5rem);
   padding-bottom:clamp(2.5rem, 5vw, 4rem);
}

.footer__top > * {
   min-width:0;
}

.footer__brand img {
   height:2.6rem;
   width:auto;
   background:none;
}

.footer__brand {
   display:inline-flex;
   min-height:44px;
   align-items:center;
   transition:opacity var(--dur-fast) var(--ease-out);
}

.footer__brand:hover { opacity: 0.8; }
.footer__brand:active { opacity: 0.6; }

.footer__statement {
   margin-top:var(--s-4);
   font-family:var(--tohu-3a3);
   font-size:var(--tohu-24e);
   line-height:1.2;
   letter-spacing:-0.01em;
   max-width:22ch;
   color:var(--on-dark);
}

.footer__statement em {
   color:var(--signal-bright);
}

.footer__title {
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   font-weight:500;
   letter-spacing:var(--tracking-meta);
   text-transform:uppercase;
   color:var(--on-dark-soft);
   padding-bottom:0.75rem;
   margin-bottom:0.5rem;
   border-bottom:1px solid var(--rule-dark);
}

.footer__list {
   margin:0;
   padding:0;
   list-style:none;
}

.footer__list a {
   display:inline-flex;
   align-items:center;
   gap:0.5rem;
   min-height:44px;
   padding-block:0.25rem;
   text-decoration:none;
   overflow-wrap:anywhere;
}

.footer__list .icon {
   width:1rem;
   height:1rem;
   color:var(--signal-bright);
}

.footer__address {
   line-height:1.6;
   color:var(--on-dark-soft);
   padding-block:0.5rem;
}

.footer__legal {
   border-top:1px solid var(--rule-dark);
   padding-block:var(--s-4) calc(var(--s-4) + var(--chat-clear, 0px));
}

.footer__legal-inner {
   display:flex;
   flex-wrap:wrap;
   align-items:center;
   justify-content:space-between;
   gap:var(--s-2) var(--s-5);
}

.footer__legal-list {
   display:flex;
   flex-wrap:wrap;
   gap:0 var(--s-4);
   margin:0;
   padding:0;
   list-style:none;
}

.footer__legal-list a,
.footer__legal-list button {
   display:inline-flex;
   align-items:center;
   min-height:44px;
   padding:0;
   background:none;
   border:0;
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   letter-spacing:0.04em;
   color:var(--on-dark-soft);
   text-decoration:none;
   cursor:pointer;
   transition:color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.footer__legal-list a:hover,
.footer__legal-list button:hover {
   color:var(--signal-bright);
   box-shadow:inset 0 -1px 0 var(--signal-bright);
}

.footer__legal-list a:active,
.footer__legal-list button:active {
   color:var(--paper);
   box-shadow:inset 0 -2px 0 var(--paper);
}

.footer__legal-list button:focus-visible {
   outline:2px solid var(--signal-bright);
   outline-offset:3px;
}

.footer__copy {
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   color:var(--on-dark-soft);
}

@media (max-width: 1023.98px) {
   .footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); }
   .footer__intro { grid-column: 1 / -1; }
}

@media (max-width: 559.98px) {
   .footer__top { grid-template-columns: 1fr; }
}

.consent {
   position:fixed;
   left:calc(var(--frame) + 0.5rem);
   right:calc(var(--frame) + 0.5rem);
   bottom:calc(var(--frame) + 0.5rem);
   z-index:var(--z-consent);
   max-width:60rem;
   margin-inline:auto;
   max-height:20vh;
   overflow-y:auto;
   background:var(--ink);
   color:var(--on-dark);
   border-top:2px solid var(--signal);
   box-shadow:0 18px 40px -18px rgba(0, 0, 0, 0.6);
}

.consent__inner {
   display:flex;
   flex-wrap:wrap;
   align-items:center;
   justify-content:space-between;
   gap:0.6rem 1.25rem;
   padding:0.75rem 1rem;
}

.consent__text {
   flex:1 1 22rem;
   min-width:0;
   margin:0;
   font-size:var(--step--1);
   line-height:1.45;
}

.consent__text a {
   color:var(--signal-bright);
   text-decoration-color:currentColor;
}

.consent__text a:hover {
   color:var(--paper);
}

.consent__actions {
   display:flex;
   flex-wrap:wrap;
   gap:0.5rem;
   flex:0 0 auto;
}

.consent__btn {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   min-height:44px;
   padding:0.5rem 1.1rem;
   border:1px solid var(--rule-dark);
   border-radius:0;
   background:transparent;
   color:var(--on-dark);
   font-family:var(--tohu-1a4);
   font-size:var(--step--1);
   font-weight:600;
   transition:background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}

.consent__btn:hover {
   background:var(--slate);
   border-color:var(--on-dark-soft);
}

.consent__btn:active {
   background:var(--slate-deep);
}

.consent__btn:focus-visible {
   outline:2px solid var(--signal-bright);
   outline-offset:2px;
}

.consent__btn--accept {
   background:var(--paper);
   border-color:var(--paper);
   color:var(--ink);
}

.consent__btn--accept:hover {
   background:var(--signal-bright);
   border-color:var(--signal-bright);
   color:var(--ink);
}

.consent__btn--accept:active {
   background:var(--mist);
   border-color:var(--mist);
   color:var(--ink);
}

@media (max-width: 479.98px) {
   .consent__inner { padding: 0.6rem 0.75rem; gap: 0.5rem; }
   .consent__text { flex-basis: 100%; font-size: 0.8125rem; }
   .consent__actions { width: 100%; }
   .consent__btn { flex: 1 1 0; padding-inline: 0.6rem; }
}

.chat {
   --chat-bottom:calc(var(--frame) + 1rem + var(--consent-h, 0px));
}

.chat__launcher {
   position:fixed;
   right:calc(var(--frame) + 1rem);
   bottom:var(--chat-bottom);
   z-index:var(--z-chat);
   display:inline-flex;
   align-items:center;
   gap:0.6rem;
   min-height:52px;
   min-width:52px;
   padding:0.7rem 1.1rem;
   background:var(--ink);
   color:var(--paper);
   border:1px solid var(--ink);
   border-radius:0;
   box-shadow:0 0 0 3px var(--paper), 0 16px 30px -16px rgba(18, 24, 32, 0.7);
   font-family:var(--tohu-1a4);
   font-size:var(--step--1);
   font-weight:600;
   transition:background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), transform var(--dur-fast) var(--ease-out), bottom var(--dur-slow) var(--ease-editorial);
}

.chat__launcher .icon {
   width:1.25rem;
   height:1.25rem;
   color:var(--signal-bright);
}

.chat__launcher:hover {
   background:var(--slate);
   border-color:var(--slate);
   box-shadow:0 0 0 3px var(--signal), 0 20px 34px -16px rgba(18, 24, 32, 0.75);
   transform:translateY(-2px);
}

.chat__launcher:active {
   background:var(--slate-deep);
   border-color:var(--slate-deep);
   box-shadow:0 0 0 3px var(--paper), 0 6px 12px -8px rgba(18, 24, 32, 0.7);
   transform:translateY(1px);
}

.chat__launcher:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:5px;
}

.chat__launcher[aria-expanded="true"] {
   background:var(--slate);
}

.chat__badge {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   min-width:1.4rem;
   min-height:1.4rem;
   padding:0 0.35rem;
   background:var(--signal);
   color:var(--ink);
   font-family:var(--tohu-fae);
   font-size:0.75rem;
   font-weight:500;
   line-height:1;
}

.chat__badge:empty,
.chat__badge[data-count="0"] {
   display:none;
}

@media (max-width: 479.98px) {
   .chat__launcher-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
   .chat__launcher { padding: 0.7rem; justify-content: center; }
}

.chat__panel {
   position:fixed;
   right:calc(var(--frame) + 1rem);
   bottom:calc(var(--chat-bottom) + 4.25rem);
   z-index:var(--z-chat);
   display:flex;
   flex-direction:column;
   width:min(24rem, calc(100vw - var(--frame) * 2 - 2rem));
   height:min(34rem, calc(100vh - var(--strip-h) - var(--chat-bottom) - 6rem));
   min-height:18rem;
   background:var(--paper);
   border:var(--hairline-ink);
   box-shadow:var(--shadow-panel);
}

.chat__panel[hidden] {
   display:none;
}

.chat__head {
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:var(--s-3);
   padding:0.65rem 0.65rem 0.65rem 1rem;
   background:var(--slate);
   color:var(--on-dark);
}

.chat__title {
   font-family:var(--tohu-3a3);
   font-size:var(--tohu-543);
   font-weight:500;
   line-height:1.2;
   color:var(--on-dark);
}

.chat__sub {
   display:block;
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   color:var(--on-dark-soft);
}

.chat__close {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   flex:none;
   width:44px;
   min-height:44px;
   background:transparent;
   border:1px solid var(--rule-dark);
   color:var(--on-dark);
   transition:background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}

.chat__close:hover {
   background:var(--slate-deep);
   border-color:var(--on-dark-soft);
}

.chat__close:active {
   background:var(--ink);
}

.chat__close:focus-visible {
   outline:2px solid var(--signal-bright);
   outline-offset:2px;
}

.chat__log {
   flex:1 1 auto;
   overflow-y:auto;
   overscroll-behavior:contain;
   display:flex;
   flex-direction:column;
   gap:0.6rem;
   padding:1rem;
   background:var(--paper);
}

.chat__msg {
   max-width:85%;
   padding:0.6rem 0.8rem;
   font-size:var(--step--1);
   line-height:1.45;
   overflow-wrap:anywhere;
}

.chat__msg--staff,
.chat__msg--greeting {
   align-self:flex-start;
   background:var(--mist);
   border-left:2px solid var(--signal);
}

.chat__msg--me {
   align-self:flex-end;
   background:var(--ink);
   color:var(--paper);
}

.chat__msg.is-pending {
   opacity:0.6;
}

.chat__msg.is-failed {
   background:var(--danger-wash);
   color:var(--danger);
   border:1px solid var(--danger);
}

.chat__meta {
   display:block;
   margin-top:0.25rem;
   font-family:var(--tohu-fae);
   font-size:0.6875rem;
   opacity:0.75;
}

.chat__retry {
   min-height:32px;
   margin-top:0.35rem;
   padding:0.2rem 0.6rem;
   background:transparent;
   border:1px solid currentColor;
   color:inherit;
   font-size:var(--step--2);
   font-weight:600;
   transition:background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}

.chat__retry:hover { background: var(--danger); color: var(--paper); }
.chat__retry:active { background: var(--ink); color: var(--paper); }
.chat__retry:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }

.chat__intro {
   display:grid;
   gap:0.75rem;
   padding:1rem;
   border-top:var(--hairline);
   background:var(--paper-deep);
}

.chat__intro .field input:not([type="checkbox"]) {
   min-height:44px;
}

.chat__form {
   display:flex;
   gap:0.5rem;
   padding:0.65rem;
   border-top:var(--hairline);
   background:var(--paper);
}

.chat__input {
   flex:1 1 auto;
   min-width:0;
   min-height:44px;
   max-height:7rem;
   padding:0.6rem 0.75rem;
   border:1px solid var(--rule);
   border-bottom-color:var(--ink);
   border-radius:var(--radius-input);
   background:#fbfbfa;
   font-size:var(--step--1);
   resize:none;
   transition:border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.chat__input:hover {
   border-color:var(--steel);
}

.chat__input:focus {
   outline:none;
   border-color:var(--signal);
   box-shadow:0 0 0 1px var(--signal), 0 0 0 4px var(--signal-wash);
}

.chat__send {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   flex:none;
   min-width:48px;
   min-height:44px;
   padding:0.5rem 0.85rem;
   background:var(--ink);
   border:1px solid var(--ink);
   color:var(--paper);
   font-weight:600;
   font-size:var(--step--1);
   transition:background-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.chat__send:hover {
   background:var(--slate);
   box-shadow:inset 0 -2px 0 var(--signal);
}

.chat__send:active {
   background:var(--slate-deep);
   box-shadow:var(--shadow-press);
}

.chat__send:focus-visible {
   outline:2px solid var(--signal);
   outline-offset:2px;
}

.chat__send[disabled] {
   opacity:0.5;
   cursor:not-allowed;
}

.chat__error {
   padding:0 1rem 0.5rem;
   font-size:var(--step--2);
   font-weight:600;
   color:var(--danger);
}

.chat__error:empty {
   display:none;
}

@media (max-width: 479.98px) {
   .chat__panel {
      left:calc(var(--frame) + 0.5rem);
      right:calc(var(--frame) + 0.5rem);
      width:auto;
      bottom:calc(var(--chat-bottom) + 4rem);
   }
}

.notice {
   display:grid;
   grid-template-columns:auto minmax(0, 1fr);
   gap:0.75rem;
   padding:1rem 1.15rem;
   border:var(--hairline);
   border-left:3px solid var(--signal);
   background:var(--paper-deep);
   font-size:var(--step--1);
}

.notice .icon {
   color:var(--signal-text);
   margin-top:0.2rem;
}

.band {
   background:var(--slate);
   color:var(--on-dark);
   padding-block:var(--section-pad);
}

.band h2 {
   color:var(--on-dark);
}

.band__inner {
   display:flex;
   flex-wrap:wrap;
   align-items:flex-end;
   justify-content:space-between;
   gap:var(--s-6);
}

.band__inner > * {
   min-width:0;
}

.breadcrumb {
   display:flex;
   flex-wrap:wrap;
   gap:0.25rem 0.5rem;
   margin:0;
   padding:0;
   list-style:none;
   font-family:var(--tohu-fae);
   font-size:var(--step--2);
   color:var(--steel-ink);
}

.breadcrumb li + li::before {
   content:"/";
   margin-right:0.5rem;
   color:var(--rule);
}

.breadcrumb a {
   display:inline-flex;
   align-items:center;
   min-height:44px;
   text-decoration:none;
}

.breadcrumb a:hover { color: var(--signal-text); }
.breadcrumb a:active { color: var(--ink); }