/* «Тон в тон»: a designer's table in warm light, a paint fan deck, sample chips, a workshop order sheet and a tape measure. */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(/s/4dcaa895/cormorant-garamond-500.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(/s/05eb5ec6/cormorant-garamond-600.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400;font-display:swap;src:url(/s/91450228/manrope-400.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:600;font-display:swap;src:url(/s/e54e72cb/manrope-600.woff2) format("woff2")}

:root{
  --paper:#f2eadc;--paper-2:#ebdfca;--card:#fbf7ef;--chalk:#fbf6ec;
  --ink:#34291f;--ink-2:#5e4d3f;--ink-3:#7a6656;
  --line:#dccdb6;--line-2:#c9b597;
  --brass:#a67c3d;--tape:#e3b54a;--tape-2:#c99a2e;--case:#6b4a1c;
  --stamp-done:#8e3b2c;--stamp-wip:#395768;
  --fm:#d9c7a8;--fd:#5e4d3f;--fi:#34291f;--ft:#efe4d2;
  --c1:#f1e6d4;--c2:#e2cfae;--c3:#c9ad82;--c4:#7a6656;
  --f-head:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --f-text:"Manrope","Segoe UI",Roboto,Arial,sans-serif;
  --gut:16px;--max:1200px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;font-variant-numeric:lining-nums}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--paper);color:var(--ink);font:400 17px/1.7 var(--f-text);overflow-wrap:break-word}
body>main{flex:1 0 auto}
img,svg{max-width:100%}
img{display:block;height:auto}
a{color:var(--ink);text-decoration-thickness:1px;text-underline-offset:.22em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:6px}
h1,h2,h3{margin:0;font-family:var(--f-head);font-weight:600;line-height:1.1;color:var(--ink);text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0}
button{font:inherit;color:inherit;cursor:pointer}
a,button{-webkit-tap-highlight-color:rgba(52,41,31,.12)}
.tt-wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.tt-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.tt-sprite{position:absolute;width:0;height:0;overflow:hidden}
.tt-skip{position:absolute;left:12px;top:-90px;z-index:70;padding:10px 16px;border-radius:10px;background:var(--ink);color:var(--chalk);font-weight:600;text-decoration:none}
.tt-skip:focus{top:10px;color:var(--chalk)}
.tt-lead{font-size:18px;line-height:1.62;color:var(--ink-2);max-width:62ch}
.tt-sub{color:var(--ink-2);max-width:66ch;margin-top:12px}
.tt-dot{display:inline-block;width:12px;height:12px;border-radius:3px;background:var(--fm);box-shadow:inset 0 -4px 0 var(--fd);flex:none}
.tt-chip{display:inline-block;flex:none;width:18px;height:22px;border-radius:4px;background:linear-gradient(var(--c1) 0 33%,var(--c2) 33% 66%,var(--c3) 66%);box-shadow:inset 0 0 0 1px rgba(52,41,31,.12)}
.is-soon>.tt-chip{background:repeating-linear-gradient(45deg,rgba(52,41,31,.14) 0 3px,transparent 3px 7px),linear-gradient(var(--s1) 0 33%,var(--s2) 33% 66%,var(--s3) 66%)}
.tt-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 20px;border-radius:12px;border:2px solid var(--ink);
  background:var(--ink);color:var(--chalk);font-weight:600;text-decoration:none;line-height:1.2;text-align:center}
.tt-btn:hover{background:#4a3b2d;border-color:#4a3b2d;color:var(--chalk)}
.tt-btn-line{background:transparent;color:var(--ink)}
.tt-btn-line:hover{background:var(--card);color:var(--ink)}

/* ---------------------------------------------------------------- header */
.tt-top{position:relative;z-index:30;background:var(--paper);border-bottom:1px solid var(--line)}
.tt-top-in{max-width:var(--max);margin:0 auto;padding:8px var(--gut);display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;min-height:64px}
.tt-brand{display:flex;align-items:center;gap:12px;margin-right:auto;color:var(--ink);text-decoration:none;padding:2px 0}
.tt-brand:hover{color:var(--ink)}
.tt-logo{width:42px;height:42px;flex:none}
.tt-brand-tx{display:flex;flex-direction:column;line-height:1.1}
.tt-brand-n{font:600 26px/1 var(--f-head)}
.tt-brand-s{font-size:12.5px;line-height:1.3;color:var(--ink-2);margin-top:3px}
.tt-menu{display:none;align-items:center;gap:10px;min-height:44px;padding:8px 14px;border-radius:10px;border:1.5px solid var(--line-2);background:var(--card);font-weight:600;font-size:15px}
.tt-menu-i{position:relative;width:18px;height:12px;border-top:2px solid currentColor;border-bottom:2px solid currentColor}
.tt-menu-i::after{content:"";position:absolute;left:0;right:0;top:3px;border-top:2px solid currentColor}
.tt-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:4px 6px}
.tt-nav a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:6px 10px;border-radius:10px;color:var(--ink);text-decoration:none;font-weight:600;font-size:15px}
.tt-nav a:hover{background:var(--card)}
.tt-nav a[aria-current="page"]{background:var(--card);box-shadow:inset 0 -3px 0 var(--fd)}
.tt-nav-about a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--ink)}
@media (scripting: enabled) and (max-width: 979.98px){
  .tt-menu{display:inline-flex}
  .tt-nav{display:none;flex-basis:100%;padding:4px 0 10px}
  .tt-top.is-open .tt-nav{display:block}
  .tt-nav ul{flex-direction:column;gap:2px}
  .tt-nav a{display:flex;font-size:16px}
}
@media (max-width: 559.98px){.tt-brand{flex:1;min-width:0;gap:10px}.tt-brand-s{font-size:11.5px;max-width:24ch}.tt-brand-n{font-size:24px}.tt-logo{width:38px;height:38px}}
@media (max-width: 379.98px){.tt-brand-s{max-width:19ch;font-size:11px}.tt-menu{padding:8px 11px}.tt-menu-i{display:none}.tt-logo{width:34px;height:34px}}

/* ---------------------------------------------------------------- crumbs */
.tt-crumbs{padding:18px 0 14px;font-size:14.5px;color:var(--ink-2)}
.tt-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:2px 0}
.tt-crumbs li{display:inline;min-width:0}
@media (max-width: 767.98px){.tt-art-page .tt-crumbs li:last-child{display:block;flex-basis:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.tt-art-page .tt-crumbs li:last-child::before{display:none}}
.tt-crumbs li+li::before{content:"›";margin:0 9px;color:var(--ink-3)}
.tt-crumbs a{color:var(--ink-2)}

/* ---------------------------------------------------------------- home: hero, table, fan, room, card */
.tt-hero{padding-top:28px}
.tt-hero-tx{display:grid;gap:14px;align-items:end;padding-bottom:22px}
.tt-hero h1{font-size:clamp(40px,2.4vw + 26px,62px);line-height:1.02;letter-spacing:-.01em;max-width:17ch}
@media (min-width: 1000px){.tt-hero-tx{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:40px}.tt-hero .tt-lead{padding-bottom:8px}}
.tt-stage{position:relative;background:
  radial-gradient(ellipse 70% 90% at 22% 0%,rgba(255,244,222,.95),rgba(255,244,222,0) 70%),
  radial-gradient(ellipse 60% 70% at 100% 100%,rgba(196,160,112,.18),rgba(196,160,112,0) 70%),
  repeating-linear-gradient(91deg,rgba(150,108,62,.045) 0 1px,transparent 1px 22px,rgba(150,108,62,.03) 22px 23px,transparent 23px 57px),
  linear-gradient(180deg,#eedfc6,#e7d4b6);
  border-top:1px solid #e0cdae;border-bottom:1px solid #d9c3a1}
.tt-stage-in{max-width:1280px;margin:0 auto;padding:22px var(--gut) 34px;display:grid;gap:26px}
.tt-deck-side{min-width:0;display:flex;flex-direction:column;align-items:center}
.tt-fams{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;max-width:720px}
.tt-fam-b{display:flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:8px 12px;border-radius:12px;border:1.5px solid rgba(52,41,31,.28);
  background:var(--fm);color:var(--ink);font-weight:600;font-size:15px;line-height:1.2;box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 6px 14px -10px rgba(70,45,20,.55)}
.tt-fam-b .tt-dot{background:var(--fd);box-shadow:inset 0 -4px 0 rgba(0,0,0,.18)}
.tt-fam-b:hover{filter:brightness(1.04)}
.tt-fam-b[aria-pressed="true"]{background:var(--fd);border-color:var(--fd);color:var(--chalk)}
.tt-fam-b[aria-pressed="true"] .tt-dot{background:var(--chalk);box-shadow:none}
@media (min-width: 640px){.tt-fams{grid-template-columns:repeat(4,auto);justify-content:center}}
.tt-fan{position:relative;width:calc(100% + 2 * var(--gut));margin:8px calc(-1 * var(--gut)) 0;max-width:none}
.tt-fan-svg{display:block;width:100%;height:auto;overflow:visible;touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
.tt-strip{cursor:pointer;outline:none;transition:opacity .35s ease}
.tt-fan.is-ready .tt-fan-svg{cursor:grab}
.tt-fan.is-drag .tt-fan-svg,.tt-fan.is-drag .tt-strip{cursor:grabbing}
.tt-st-card{fill:#fbf6ec;stroke:#d3c2a6;stroke-width:1.5}
.tt-strip.is-on .tt-st-card{stroke:#a8916d}
.tt-st-num{font:600 48px/1 var(--f-text);fill:#fbf6ec;pointer-events:none}
.is-soon .tt-st-num{fill:var(--ink)}
.tt-st-lock{color:var(--ink);pointer-events:none}
.tt-st-ring{fill:none;stroke:var(--ink);stroke-width:6;opacity:0}
.tt-strip:focus-visible .tt-st-ring{opacity:1}
.tt-st-veil{fill:#efe4d2;opacity:0;pointer-events:none;transition:opacity .35s ease}
.tt-fan.is-gathered .tt-strip:not(.is-member) .tt-st-veil{opacity:.7}
.tt-steps{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:6px}
.tt-step{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:9px 13px;border-radius:12px;border:1.5px solid rgba(52,41,31,.35);background:var(--card);font-weight:600;font-size:14.5px;white-space:nowrap}
.tt-step:hover{background:#fffdf8}
.tt-step-i{width:9px;height:9px;border-left:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(45deg);margin-left:3px}
.tt-step[data-step="1"] .tt-step-i{transform:rotate(-135deg);margin:0 3px 0 0}
.tt-hint{margin-top:10px;font-size:14px;line-height:1.5;color:var(--ink-2);text-align:center;max-width:58ch}
.tt-room-side{min-width:0;display:flex;flex-direction:column;gap:16px}
.tt-room{position:relative;border-radius:18px;overflow:hidden;background:#efe6d6;box-shadow:0 1px 0 #fff inset,0 22px 40px -26px rgba(70,45,20,.7),0 0 0 1px rgba(110,80,40,.18)}
.tt-room-svg{display:block;width:100%;height:auto}
.tt-wall{fill:var(--c1);transition:fill .7s ease}
.tt-front{fill:var(--c3);transition:fill .7s ease}
.tt-soft{fill:var(--c2);transition:fill .7s ease}
.tt-handle{fill:#9a8f82}
.tt-furn{opacity:0;transition:opacity .45s ease}
.tt-room[data-fam="1"] .tt-furn-1,.tt-room[data-fam="2"] .tt-furn-2,.tt-room[data-fam="3"] .tt-furn-3,.tt-room[data-fam="4"] .tt-furn-4{opacity:1}
.tt-cards{display:grid}
.tt-card{grid-area:1/1;display:flex;flex-direction:column;gap:6px;padding:18px 20px 20px;border-radius:18px;background:var(--card);
  box-shadow:0 0 0 1px rgba(110,80,40,.16),0 20px 36px -28px rgba(70,45,20,.7);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s linear .3s}
.tt-card.is-on{opacity:1;visibility:visible;transition:opacity .3s ease}
.tt-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tt-card-no{font:600 30px/1 var(--f-head);font-variant-numeric:lining-nums}
.tt-card-chip{width:72px;height:26px;border-radius:6px;background:linear-gradient(90deg,var(--c1) 0 25%,var(--c2) 25% 50%,var(--c3) 50% 75%,var(--c4) 75%);box-shadow:inset 0 0 0 1px rgba(52,41,31,.12)}
.tt-card.is-soon .tt-card-chip{background:repeating-linear-gradient(45deg,rgba(52,41,31,.14) 0 3px,transparent 3px 7px),linear-gradient(90deg,var(--s1) 0 25%,var(--s2) 25% 50%,var(--s3) 50% 75%,var(--s4) 75%)}
.tt-card-fam{display:flex;align-items:center;gap:8px;font-weight:600;font-size:15px;color:var(--fi)}
.tt-card-place{font-size:14.5px;color:var(--ink-2)}
.tt-card-t{font:600 25px/1.15 var(--f-head);margin-top:4px}
.tt-card-x{font-size:15.5px;line-height:1.6;color:var(--ink-2)}
.tt-card-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-top:8px}
.tt-card-d{font-size:14.5px;color:var(--ink-2)}
.tt-card-soon{display:flex;align-items:center;gap:10px;margin-top:6px;font:600 24px/1.2 var(--f-head)}
.tt-card-lock{width:20px;height:24px;flex:none;color:var(--ink)}
.tt-card-batch{font-size:14.5px;color:var(--ink-2)}
.tt-card-wash{display:block;height:58px;margin-top:12px;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(52,41,31,.1);
  background:repeating-linear-gradient(45deg,rgba(52,41,31,.12) 0 4px,transparent 4px 10px),linear-gradient(90deg,var(--s1) 0 25%,var(--s2) 25% 50%,var(--s3) 50% 75%,var(--s4) 75%)}
.tt-all{padding:6px 0 28px}
.tt-all-h{font:600 24px/1.2 var(--f-head);margin-bottom:10px}
.tt-all-l{list-style:none;display:grid;gap:6px}
.tt-all-l li{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:8px 12px;border-radius:10px;background:rgba(251,247,239,.85)}
.tt-all-no{font-weight:600;font-variant-numeric:tabular-nums;min-width:2ch}
.tt-all-fam{font-size:14px;color:var(--fi);font-weight:600}
.tt-all-d{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2);font-size:15px}
.tt-all-lock{width:12px;height:15px;color:var(--ink-2)}
@media (scripting: enabled){.tt-all{display:none}}
@media (scripting: none){.tt-fams,.tt-steps,.tt-hint{display:none}.tt-card:not(.is-on){display:none}}
@media (min-width: 640px){.tt-fan{width:100%;margin:10px 0 0}}
@media (min-width: 1000px){.tt-fan{width:min(100%,max(560px,calc((100vh - 420px) * 1.45)))}}
@media (min-width: 1000px){
  .tt-stage-in{grid-template-columns:minmax(0,1.62fr) minmax(330px,1fr);gap:34px;align-items:start;padding-top:26px}
  .tt-room-side{padding-top:6px}
  .tt-all-l{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------------------------------------------------------------- «Стол образцов» */
.tt-desk{padding:58px 0 18px}
.tt-desk h2,.tt-order h2{font-size:clamp(34px,1.6vw + 26px,48px)}
.tt-desk-in{display:grid;gap:22px;margin-top:24px}
.tt-mats{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tt-mat{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:8px;width:100%;padding:10px 10px 12px;border-radius:16px;border:1.5px solid var(--line);
  background:var(--card);text-align:center;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;box-shadow:0 14px 24px -22px rgba(70,45,20,.8)}
.tt-mat:hover{transform:translateY(-2px);border-color:var(--line-2)}
.tt-mat[aria-pressed="true"]{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink),0 18px 28px -20px rgba(70,45,20,.85);transform:translateY(-3px);background:#fffdf8}
.tt-mat-pic{display:block;border-radius:10px;background:#efe5d4}
.tt-mat-svg{display:block;width:100%;height:auto}
.tt-mat-n{font-weight:600;font-size:15.5px;line-height:1.25}
.tt-mat-out{position:relative;padding:18px 18px 20px;border-radius:18px;background:var(--card);box-shadow:0 0 0 1px rgba(110,80,40,.16)}
.tt-mat-h{font:600 26px/1.15 var(--f-head);margin-bottom:10px}
.tt-mat-list ul{list-style:none;display:grid;gap:8px}
.tt-mat-list li{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:4px 10px}
.tt-mat-no{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14.5px;white-space:nowrap}
.tt-mat-lock{width:12px;height:15px;color:var(--ink-2)}
.tt-mat-list li.is-soon>span:last-child{color:var(--ink-2);font-size:15px}
.tt-mat-list+.tt-mat-list{margin-top:22px}
.tt-mat-empty{display:none;color:var(--ink-2)}
@media (scripting: enabled){.tt-mat-list{display:none;margin:0}.tt-mat-list+.tt-mat-list{margin-top:0}.tt-mat-out:not(.is-live) .tt-mat-list:first-of-type{display:block}}
.tt-mat-out.is-live .tt-mat-list.is-on{display:block;animation:tt-rise .28s ease both}
.tt-mat-out.is-live.is-empty .tt-mat-empty{display:block}
@keyframes tt-rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (min-width: 700px){.tt-mats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width: 1000px){.tt-desk-in{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:start;gap:30px}}

/* ---------------------------------------------------------------- «График партий» */
.tt-order{padding:46px 0 70px}
.tt-sheet{margin-top:24px;border-radius:6px;background:#fdfaf3;
  box-shadow:0 0 0 1px rgba(110,80,40,.2),0 26px 44px -34px rgba(70,45,20,.8);padding:0 0 10px}
.tt-sheet-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 18px;padding:16px 20px 14px;border-bottom:2px solid var(--ink)}
.tt-sheet-t{font:600 26px/1.15 var(--f-head)}
.tt-sheet-n{font-size:14px;color:var(--ink-2)}
.tt-batches{list-style:none;display:grid}
.tt-batch{position:relative;padding:18px 20px 20px;border-bottom:1px dashed var(--line-2)}
.tt-batch:last-child{border-bottom:0}
.tt-batch-head{position:relative;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;padding-right:128px;min-height:58px}
.tt-batch-no{font:600 30px/1.1 var(--f-head);margin:0}
.tt-batch-when{font-weight:600;font-size:15px;color:var(--ink-2)}
.tt-stamp{position:absolute;right:0;top:-2px;transform:rotate(-7deg);font:600 17px/1 var(--f-text);padding:9px 12px;border:3px double currentColor;border-radius:8px;
  color:var(--stamp-done);background:rgba(253,250,243,.7)}
.tt-batch.is-wip .tt-stamp{color:var(--stamp-wip)}
.tt-pos-l{list-style:none;display:grid;margin-top:12px;border-top:1px solid #e6dac6}
.tt-pos{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:4px 10px;padding:7px 0;border-bottom:1px solid #e6dac6;line-height:1.45}
.tt-pos-no{font-weight:600;font-size:14.5px;white-space:nowrap}
.tt-pos.is-soon{grid-template-columns:auto auto auto minmax(0,1fr)}
.tt-pos-fam{font-size:14.5px;color:var(--fi);font-weight:600}
.tt-pos-d{display:inline-flex;align-items:center;gap:6px;font-size:14.5px;color:var(--ink-2)}
.tt-pos-lock{width:12px;height:15px;color:var(--ink-2)}
.tt-sheet.is-waiting .tt-batch:not(.is-stamped) .tt-stamp{opacity:0}
.tt-batch.is-stamped .tt-stamp{animation:tt-stamp .46s cubic-bezier(.2,.9,.3,1.25) both}
@keyframes tt-stamp{0%{opacity:0;transform:scale(1.9) rotate(-18deg)}60%{opacity:1}100%{opacity:1;transform:scale(1) rotate(-7deg)}}
@media (min-width: 900px){
  .tt-batches{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tt-batch{border-bottom:1px dashed var(--line-2)}
  .tt-batch:nth-child(odd){border-right:1px dashed var(--line-2)}
  .tt-batch:nth-last-child(-n+2){border-bottom:0}
}
@media (max-width: 420px){.tt-pos.is-soon{grid-template-columns:auto auto minmax(0,1fr)}.tt-pos.is-soon .tt-pos-d{grid-column:3}.tt-batch-head{padding-right:112px}}

/* ---------------------------------------------------------------- article: the sample card, the photo, the tape */
.tt-art-page{padding-bottom:64px}
.tt-swatch{position:relative;border-radius:22px;background:var(--card);padding:40px 18px 20px;box-shadow:0 0 0 1px rgba(110,80,40,.16),0 26px 44px -36px rgba(70,45,20,.8)}
.tt-swatch::before{content:"";position:absolute;left:50%;top:12px;width:22px;height:22px;margin-left:-11px;border-radius:50%;background:var(--paper);
  border:3px solid #c8a15c;box-shadow:inset 0 2px 3px rgba(60,40,20,.4),0 1px 0 rgba(255,255,255,.7),0 0 0 1px rgba(110,80,40,.25)}
.tt-swatch-plate{display:grid;grid-template-columns:minmax(0,2.4fr) repeat(3,minmax(0,1fr));gap:6px;height:64px}
.tt-swatch-plate span{border-radius:8px;box-shadow:inset 0 0 0 1px rgba(52,41,31,.1)}
.tt-plate-main{background:var(--c3)}
.tt-plate-s:nth-child(2){background:var(--c1)}
.tt-plate-s:nth-child(3){background:var(--c2)}
.tt-plate-s:nth-child(4){background:var(--c4)}
.tt-swatch-body{display:grid;gap:18px;margin-top:18px}
.tt-swatch-top{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-bottom:10px}
.tt-swatch-no{font:600 26px/1 var(--f-head);font-variant-numeric:lining-nums}
.tt-fam-link{display:inline-flex;align-items:center;gap:8px;min-height:32px;font-weight:600;font-size:15px;color:var(--fi)}
.tt-swatch h1{font-size:clamp(34px,2.4vw + 24px,56px);line-height:1.06;letter-spacing:-.005em}
.tt-swatch-lead{margin-top:14px;font-size:17.5px;line-height:1.62;color:var(--ink-2);max-width:62ch}
.tt-swatch-side{display:grid;gap:6px;padding-top:14px;border-top:1.5px solid var(--ink);font-size:15px;color:var(--ink-2);align-content:start}
.tt-side-d{font-weight:600;color:var(--ink)}
@media (min-width: 900px){
  .tt-swatch{padding:46px 34px 30px}
  .tt-swatch-plate{height:118px;gap:8px}
  .tt-swatch-body{grid-template-columns:minmax(0,1fr) 240px;gap:40px;margin-top:26px}
  .tt-swatch-side{margin-top:6px}
}
.tt-photo{margin-top:22px}
.tt-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px;background:#e6d8c2}
@media (min-width: 768px){.tt-photo img{aspect-ratio:16/9}}
.tt-col{max-width:46rem;margin:0 auto}
.tt-tape{position:sticky;top:0;z-index:25;margin:28px 0 8px;background:var(--paper);padding:8px 0;box-shadow:0 10px 12px -12px rgba(70,45,20,.35)}
.tt-tape-bar{display:flex;align-items:center;gap:12px}
.tt-tape-case{position:relative;flex:none;display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:8px 14px 8px 12px;border-radius:14px 10px 10px 14px;border:0;
  background:linear-gradient(180deg,#7a5524,#5e4019);color:#fbf1dc;font-weight:600;font-size:15px;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 6px 12px -8px rgba(40,25,10,.8)}
.tt-tape-case:hover{background:linear-gradient(180deg,#86602b,#684820)}
.tt-tape-case-i{width:14px;height:14px;border-radius:50%;background:#e3b54a;box-shadow:inset 0 0 0 3px #c9992e}
.tt-tape-case[aria-expanded="true"] .tt-tape-case-i{background:#fbf1dc}
.tt-tape-track{position:relative;flex:1;min-width:0;height:34px}
.tt-tape-track::before{content:"";position:absolute;left:0;right:0;top:15px;height:4px;border-radius:2px;background:#ddcfb8}
.tt-tape-blade{position:absolute;left:0;top:7px;width:0;min-width:12px;height:20px;border-radius:0 3px 3px 0;
  background:repeating-linear-gradient(90deg,rgba(52,41,31,.55) 0 1px,transparent 1px 6px),linear-gradient(180deg,#f0c75c,#dcae3d);
  background-size:100% 6px,100% 100%;background-repeat:no-repeat;background-position:0 0,0 0;box-shadow:inset 0 -1px 0 rgba(90,60,10,.3)}
.tt-tape-hook{position:absolute;right:-4px;top:-3px;width:5px;height:26px;border-radius:1px;background:#6b5a48}
.tt-ticks{list-style:none;position:absolute;inset:0;display:flex;justify-content:space-between}
.tt-ticks li{position:relative;width:0}
.tt-tick{position:absolute;left:-12px;top:0;width:24px;height:34px;display:block;color:var(--ink)}
.tt-tick::before{content:"";position:absolute;left:11px;top:2px;width:2px;height:30px;border-radius:1px;background:var(--ink)}
.tt-tick-n{display:none}
.tt-tick.is-passed::before{background:#7a5524}
.tt-tick.is-now::before{width:4px;left:10px;background:var(--stamp-done)}
.tt-tape.is-live .tt-ticks{display:block}
.tt-tape.is-live .tt-ticks li{position:absolute;top:0}
.tt-tape-list{list-style:none;margin-top:8px;padding:10px;border-radius:14px;background:var(--card);box-shadow:0 0 0 1px rgba(110,80,40,.18),0 22px 36px -24px rgba(70,45,20,.75)}
.tt-tape-list a{display:flex;gap:12px;align-items:baseline;padding:7px 10px;border-radius:8px;color:var(--ink);text-decoration:none;line-height:1.35}
.tt-tape-list a:hover{background:var(--paper)}
.tt-tape-list a[aria-current="location"]{background:var(--paper);box-shadow:inset 3px 0 0 var(--stamp-done)}
.tt-tape-k{flex:none;min-width:1.6em;font-weight:600;color:var(--ink-3);font-variant-numeric:tabular-nums}
@media (scripting: enabled){.tt-tape-list{display:none;position:absolute;left:0;right:0;top:100%;max-height:min(62vh,520px);overflow:auto}.tt-tape.is-open .tt-tape-list{display:block}}
@media (min-width: 768px){
  .tt-tape-track{height:44px}
  .tt-tape-track::before{top:25px}
  .tt-tape-blade{top:17px}
  .tt-tick{height:44px}
  .tt-tick::before{top:12px;height:30px}
  .tt-tick-n{display:block;position:absolute;left:0;right:0;top:-4px;text-align:center;font-size:11.5px;font-weight:600;line-height:1;color:var(--ink-2)}
  .tt-tick.is-now .tt-tick-n{color:var(--stamp-done)}
}
@media (scripting: none){.tt-tape{position:static;box-shadow:none}.tt-tape-case{display:none}}

/* ---------------------------------------------------------------- article text */
.tt-text{padding-top:14px}
.tt-text>p,.tt-text>ul,.tt-faq>p{margin:0 0 1.05em}
.tt-text h2{font-size:clamp(29px,1vw + 24px,38px);line-height:1.12;margin:1.6em 0 .55em;scroll-margin-top:84px}
.tt-text h3{font:600 18px/1.4 var(--f-text);margin:1.3em 0 .35em;scroll-margin-top:84px}
.tt-text a{color:var(--fi);text-decoration-color:color-mix(in srgb,var(--fi) 55%,transparent)}
.tt-text a:hover{text-decoration-color:currentColor}
.tt-text ul{list-style:none;padding:0}
.tt-text li{position:relative;padding-left:26px;margin:0 0 .5em}
.tt-text li::before{content:"";position:absolute;left:2px;top:.56em;width:12px;height:12px;border-radius:3px;background:var(--c3);box-shadow:inset 0 -4px 0 var(--c4)}
.tt-tbl{margin:1.4em 0 1.6em}
.tt-tbl table{width:100%;border-collapse:separate;border-spacing:0;font-size:15.5px;line-height:1.55;background:var(--card);border-radius:14px;overflow:hidden;box-shadow:0 0 0 1px rgba(110,80,40,.18)}
.tt-tbl th{text-align:left;font-weight:600;padding:12px 14px;background:var(--ft);border-bottom:2px solid var(--c3);vertical-align:bottom}
.tt-tbl td{padding:12px 14px;vertical-align:top;border-top:1px solid #eadfcd}
.tt-tbl tbody tr:first-child td{border-top:0}
.tt-tbl td:first-child{font-weight:600}
@media (max-width: 639.98px){
  .tt-tbl table,.tt-tbl tbody,.tt-tbl tr,.tt-tbl td{display:block;width:100%}
  .tt-tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .tt-tbl table{background:transparent;box-shadow:none;border-radius:0}
  .tt-tbl tbody{display:grid;gap:10px}
  .tt-tbl tr{background:var(--card);border-radius:12px;box-shadow:0 0 0 1px rgba(110,80,40,.18);padding:4px 0 6px;overflow:hidden}
  .tt-tbl td{border-top:0;padding:6px 14px}
  .tt-tbl td:first-child{background:var(--ft);border-bottom:2px solid var(--c3);padding:9px 14px;margin-bottom:4px}
  .tt-tbl td+td::before{content:attr(data-th);display:block;font-size:13px;font-weight:600;color:var(--ink-3)}
}
.tt-faq{margin:2.4em 0 1.6em;padding:4px 20px 8px;border-radius:18px;background:var(--card);box-shadow:0 0 0 1px rgba(110,80,40,.16);border-top:8px solid var(--c3)}
.tt-faq h2{margin-top:.8em}
.tt-faq h3{padding-top:.2em;border-top:1px solid #eadfcd}
.tt-faq h2+h3{border-top:0}
.tt-before{margin:30px 0 0;padding:20px 20px 22px;border-radius:16px;background:var(--ft);box-shadow:inset 4px 0 0 var(--fd)}
.tt-before h2{font-size:30px;margin-bottom:8px}
.tt-before-note{line-height:1.65}
.tt-near{margin-top:48px}
.tt-near h2{font-size:clamp(30px,1vw + 24px,38px)}
.tt-near-l{list-style:none;display:grid;gap:12px;margin-top:16px}
.tt-near-i{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;gap:2px 14px;align-items:start;padding:14px;border-radius:16px;background:var(--card);box-shadow:0 0 0 1px rgba(110,80,40,.16)}
.tt-near-sw{grid-row:1/span 3;display:grid;grid-template-rows:repeat(3,1fr);width:46px;height:64px;border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(52,41,31,.12)}
.tt-near-sw i:nth-child(1){background:var(--c1)}.tt-near-sw i:nth-child(2){background:var(--c2)}.tt-near-sw i:nth-child(3){background:var(--c3)}
.tt-near-i.is-soon .tt-near-sw{background:repeating-linear-gradient(45deg,rgba(52,41,31,.14) 0 3px,transparent 3px 7px)}
.tt-near-i.is-soon .tt-near-sw i:nth-child(1){background:var(--s1)}.tt-near-i.is-soon .tt-near-sw i:nth-child(2){background:var(--s2)}.tt-near-i.is-soon .tt-near-sw i:nth-child(3){background:var(--s3)}
.tt-near-i.is-soon .tt-near-sw i{opacity:.82}
.tt-near-no{font:600 22px/1.1 var(--f-head);font-variant-numeric:lining-nums}
.tt-near-a{font-weight:600;line-height:1.4;color:var(--ink)}
a.tt-near-a{color:var(--fi)}
.tt-near-d{display:inline-flex;align-items:center;gap:6px;font-size:14.5px;color:var(--ink-2)}
.tt-near-lock{width:12px;height:15px;color:var(--ink-2)}
@media (min-width: 900px){.tt-near-l{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------------------------------------------------------------- family */
.tt-fam-page{padding-bottom:70px}
.tt-fam-head{padding:6px 0 4px}
.tt-fam-head h1{font-size:clamp(42px,3vw + 26px,72px);line-height:1.02}
.tt-fam-head .tt-lead{margin-top:14px}
.tt-band{display:flex;gap:6px;height:112px;margin:26px 0 30px;padding:8px;border-radius:18px;background:var(--card);box-shadow:0 0 0 1px rgba(110,80,40,.16)}
.tt-band-i{position:relative;flex:1;display:flex;align-items:flex-end;justify-content:flex-start;padding:8px 10px;border-radius:10px;
  background:linear-gradient(180deg,var(--c3) 0 70%,var(--c4) 70%)}
.tt-band-i.is-soon{background:repeating-linear-gradient(45deg,rgba(52,41,31,.13) 0 4px,transparent 4px 10px),linear-gradient(180deg,var(--s3) 0 70%,var(--s4) 70%)}
.tt-band-no{font:600 22px/1 var(--f-text);color:var(--chalk)}
.tt-band-i.is-soon .tt-band-no{color:var(--ink)}
.tt-band-lock{position:absolute;right:10px;top:10px;width:16px;height:20px;color:var(--ink)}
.tt-fam-list{list-style:none;display:grid;gap:0}
.tt-fam-i{display:grid;grid-template-columns:112px minmax(0,1fr);gap:16px;padding:20px 0;border-top:1px solid var(--line-2)}
.tt-fam-i:last-child{border-bottom:1px solid var(--line-2)}
.tt-fam-ph{position:relative;border-radius:12px;overflow:hidden;background:repeating-linear-gradient(45deg,rgba(52,41,31,.08) 0 4px,transparent 4px 10px),linear-gradient(var(--s1),var(--s3));aspect-ratio:4/3;align-self:start}
.tt-fam-img{width:100%;height:100%;object-fit:cover}
.tt-fam-lock{position:absolute;left:50%;top:50%;width:24px;height:29px;margin:-14px 0 0 -12px;color:var(--ink)}
.tt-fam-no{display:flex;align-items:center;gap:9px;font:600 22px/1 var(--f-head);font-variant-numeric:lining-nums;margin-bottom:8px}
.tt-fam-t{font:600 clamp(24px,.8vw + 20px,30px)/1.15 var(--f-head)}
.tt-fam-t a{color:var(--ink);text-decoration-color:color-mix(in srgb,var(--fd) 60%,transparent)}
.tt-fam-x{margin-top:8px;color:var(--ink-2);font-size:16px;line-height:1.6}
.tt-fam-m{margin-top:8px;font-size:14.5px;color:var(--ink-2)}
.tt-fam-i.is-soon .tt-fam-t{font-size:24px}
@media (min-width: 768px){.tt-fam-i{grid-template-columns:240px minmax(0,1fr);gap:28px;padding:26px 0}.tt-band{height:150px}.tt-band-no{font-size:28px}}

/* ---------------------------------------------------------------- about */
.tt-about-page{padding-bottom:70px}
.tt-about-head{padding:6px 0 0}
.tt-about-head h1{font-size:clamp(42px,3vw + 26px,72px);line-height:1.02}
.tt-about-head .tt-lead{margin-top:14px}
.tt-deck{list-style:none;display:grid;gap:16px;margin:30px 0 26px}
.tt-deck-i{position:relative;padding:0 0 20px;border-radius:18px;background:var(--card);box-shadow:0 0 0 1px rgba(110,80,40,.16),0 20px 34px -30px rgba(70,45,20,.8);overflow:hidden}
.tt-deck-sw{display:block;height:64px;margin-bottom:16px;background:linear-gradient(90deg,var(--c3) 0 58%,var(--c1) 58% 72%,var(--c2) 72% 86%,var(--c4) 86%)}
.tt-deck-i h2{font-size:30px;padding:0 20px}
.tt-deck-i p{padding:0 20px;margin-top:8px;color:var(--ink-2);line-height:1.62}
.tt-about-after{max-width:66ch;font-size:17.5px;padding:18px 20px;border-radius:14px;background:var(--ft);box-shadow:inset 4px 0 0 var(--ink)}
@media (min-width: 700px){.tt-deck{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width: 1100px){.tt-deck{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------------------------------------------------------------- 404 */
.tt-nf{padding:40px 0 80px}
.tt-nf-in{display:grid;gap:24px;align-items:center}
.tt-nf-art{max-width:460px;width:100%;margin:0 auto}
.tt-nf-svg{display:block;width:100%;height:auto}
.tt-nf-tx h1{font-size:clamp(40px,2.6vw + 26px,64px);line-height:1.04}
.tt-nf-tx .tt-lead{margin-top:14px}
.tt-nf-go{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.tt-nf-k{margin-top:26px;font-weight:600}
.tt-nf-fams{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.tt-nf-fams a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 14px;border-radius:12px;background:var(--card);box-shadow:0 0 0 1px rgba(110,80,40,.18);color:var(--ink);text-decoration:none;font-weight:600}
.tt-nf-fams a:hover{background:var(--ft)}
@media (min-width: 900px){.tt-nf-in{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px}}

/* ---------------------------------------------------------------- footer */
.tt-foot{background:#2f251c;color:#efe4d2}
.tt-foot-in{max-width:var(--max);margin:0 auto;padding:30px var(--gut) 36px;display:grid;gap:20px}
.tt-foot-note{max-width:60ch;line-height:1.6}
.tt-foot-c{margin-top:8px;color:#cdbda4;font-size:14.5px}
.tt-foot-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:4px 18px}
.tt-foot-nav a{display:inline-flex;align-items:center;min-height:40px;color:#f6e7c9}
.tt-foot-nav a:hover{color:#fff}
.tt-foot :focus-visible{outline-color:#f6e7c9}
@media (min-width: 900px){.tt-foot-in{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:40px}}

@media (min-width: 640px){:root{--gut:24px}}
@media (min-width: 1100px){:root{--gut:32px}}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

/* generated by build.py: the tones and the families */
[data-tone="1"]{--c1:#f5e3d0;--c2:#e4c6a8;--c3:#c7a17a;--c4:#866541;--s1:#f8eddf;--s2:#f1e0cd;--s3:#e4d0b9;--s4:#c6b59f}
[data-tone="2"]{--c1:#f5e4c5;--c2:#e5c894;--c3:#c9a35c;--c4:#876620;--s1:#f8eeda;--s2:#f1e1c4;--s3:#e4d1ab;--s4:#c7b590}
[data-tone="3"]{--c1:#f6e5c0;--c2:#e5c98a;--c3:#c9a44c;--c4:#886600;--s1:#f9eed8;--s2:#f1e2c0;--s3:#e4d1a4;--s4:#c7b582}
[data-tone="4"]{--c1:#fae1cd;--c2:#ecc3a3;--c3:#d19d72;--c4:#8e6039;--s1:#fbedde;--s2:#f4dfcb;--s3:#e8ceb5;--s4:#cab29b}
[data-tone="5"]{--c1:#fbe2c3;--c2:#edc590;--c3:#d39e55;--c4:#8f6115;--s1:#fbedda;--s2:#f5e0c3;--s3:#e9cea8;--s4:#cab38b}
[data-tone="6"]{--c1:#e4e8da;--c2:#c9d0b8;--c3:#a5ae8e;--c4:#687054;--s1:#f1f0e4;--s2:#e4e5d5;--s3:#d4d6c2;--s4:#b9baa8}
[data-tone="7"]{--c1:#e0ead8;--c2:#c1d3b5;--c3:#9bb28b;--c4:#607350;--s1:#eff1e3;--s2:#e1e6d3;--s3:#d0d7c0;--s4:#b5bba6}
[data-tone="8"]{--c1:#dbebe3;--c2:#b9d4c7;--c3:#90b3a2;--c4:#557466;--s1:#edf1e8;--s2:#dde7db;--s3:#cbd8cb;--s4:#b0bcb0}
[data-tone="9"]{--c1:#e8e8d2;--c2:#cfcfab;--c3:#adad7d;--c4:#6f6f44;--s1:#f2f0e0;--s2:#e7e4cf;--s3:#d8d5ba;--s4:#bcb9a0}
[data-tone="10"]{--c1:#e0e9e0;--c2:#c1d1c3;--c3:#9bb09d;--c4:#5f7161;--s1:#eff0e7;--s2:#e1e5da;--s3:#d0d6c8;--s4:#b5baad}
[data-tone="11"]{--c1:#f8e1d4;--c2:#e9c3ad;--c3:#cd9d81;--c4:#8b6147;--s1:#faede1;--s2:#f3dfd0;--s3:#e6cebc;--s4:#c9b3a2}
[data-tone="12"]{--c1:#ffddcf;--c2:#f7bda6;--c3:#df9477;--c4:#99583e;--s1:#fdebdf;--s2:#f9dccc;--s3:#eecab7;--s4:#cfaf9e}
[data-tone="13"]{--c1:#ffddd5;--c2:#f5bdaf;--c3:#dc9584;--c4:#97594a;--s1:#fdebe2;--s2:#f8dcd1;--s3:#edcabd;--s4:#ceafa3}
[data-tone="14"]{--c1:#fde0cb;--c2:#f0c19f;--c3:#d79a6c;--c4:#935e33;--s1:#fcecdd;--s2:#f6dec9;--s3:#ebcdb2;--s4:#ccb299}
[data-tone="15"]{--c1:#f8e0dd;--c2:#e8c1be;--c3:#cd9b97;--c4:#8a5f5c;--s1:#faece5;--s2:#f2ded7;--s3:#e6cdc6;--s4:#c8b2ab}
[data-tone="16"]{--c1:#dae9f2;--c2:#b8d0df;--c3:#8eaec2;--c4:#547081;--s1:#ecf0ef;--s2:#dde5e6;--s3:#cad6d9;--s4:#b0babc}
[data-tone="17"]{--c1:#dce7f5;--c2:#bccee5;--c3:#95abc9;--c4:#596d87;--s1:#edeff0;--s2:#dfe4e9;--s3:#cdd4dc;--s4:#b2b8bf}
[data-tone="18"]{--c1:#d9eaed;--c2:#b7d2d8;--c3:#8db0b8;--c4:#527279;--s1:#ecf1ec;--s2:#dce6e3;--s3:#cad6d5;--s4:#afbbb8}
[data-tone="19"]{--c1:#e1e6f3;--c2:#c4cce0;--c3:#9ea9c3;--c4:#626b82;--s1:#efefef;--s2:#e2e3e7;--s3:#d1d3da;--s4:#b6b7bc}
[data-tone="20"]{--c1:#d8ebeb;--c2:#b4d3d4;--c3:#88b2b3;--c4:#4e7475;--s1:#ebf1ec;--s2:#dbe6e1;--s3:#c7d7d2;--s4:#adbcb6}
[data-fam="1"]{--fm:#dcb77f;--fd:#825b0c;--fi:#6f4b00;--ft:#f6e5cd}
[data-fam="2"]{--fm:#b3c4a7;--fd:#586a4b;--fi:#48583c;--ft:#e3ebde}
[data-fam="3"]{--fm:#e9ae98;--fd:#8e5138;--fi:#79412b;--ft:#fce1d7}
[data-fam="4"]{--fm:#a6c3d4;--fd:#48687b;--fi:#395768;--ft:#ddeaf2}