/* Component interaction styles (hover / focus / checked / disabled).
   Components set these classes; tokens come from tokens/*.css. */
.tn-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:40px;padding:0 24px;border:1px solid transparent;border-radius:0;font:inherit;font-family:var(--font-sans);font-size:16px;font-weight:var(--weight-regular);line-height:1;letter-spacing:var(--tracking-default);white-space:nowrap;cursor:pointer;text-decoration:none;box-sizing:border-box;transition:background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard)}
.tn-btn--sm{height:32px;padding:0 16px;font-size:14px;gap:8px}
.tn-btn--lg{height:46px}
.tn-btn--block{display:flex;width:100%}
.tn-btn--primary{background:var(--color-highlight-yellow);color:var(--color-pure-black)}
.tn-btn--primary:hover{background:var(--color-white);box-shadow:inset 0 0 0 1px var(--color-soft-black)}
.tn-btn--secondary{background:var(--color-white);color:var(--color-pure-black)}
.tn-btn--secondary:hover{background:var(--color-highlight-yellow)}
.tn-btn--dark{background:var(--color-soft-black);color:var(--color-white)}
.tn-btn--dark:hover{background:var(--color-highlight-yellow);color:var(--color-pure-black)}
.tn-btn--outline{background:transparent;color:currentColor;border-color:currentColor}
.tn-btn--outline:hover{background:var(--color-highlight-yellow);color:var(--color-pure-black);border-color:var(--color-highlight-yellow)}
.tn-btn--ghost{background:transparent;color:currentColor;padding:0 8px}
.tn-btn--ghost:hover{text-decoration:underline;text-underline-offset:.2em}
.tn-btn:active{box-shadow:inset 0 0 0 999px rgba(30,36,38,.08)}
.tn-btn:focus-visible,.tn-iconbtn:focus-visible,.tn-arrowlink:focus-visible,.tn-navlink:focus-visible,.tn-menuitem:focus-visible,.tn-tab:focus-visible,.tn-page:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.tn-btn[disabled],.tn-btn[aria-disabled="true"],.tn-iconbtn[disabled]{opacity:.4;cursor:not-allowed;pointer-events:none}
.tn-cta{display:inline-flex;gap:var(--space-3);align-items:stretch}
.tn-cta__arrow{display:inline-flex;align-items:center;justify-content:center;width:46px;background:var(--color-highlight-yellow);color:var(--color-pure-black)}
.tn-cta__arrow svg{transition:transform var(--duration-fast) var(--ease-standard)}
.tn-cta:hover .tn-cta__arrow svg{transform:translateX(3px)}
.tn-cta:hover .tn-btn--secondary{background:var(--color-highlight-yellow)}

.tn-iconbtn{display:inline-flex;align-items:center;justify-content:center;flex:none;border:1px solid transparent;border-radius:0;padding:0;cursor:pointer;background:transparent;color:currentColor;transition:background-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard)}
.tn-iconbtn--accent{background:var(--color-highlight-yellow);color:var(--color-pure-black)}
.tn-iconbtn--accent:hover{background:var(--color-white);box-shadow:inset 0 0 0 1px var(--color-soft-black)}
.tn-iconbtn--dark{background:var(--color-soft-black);color:#999EA1}
.tn-iconbtn--dark:hover{color:var(--color-white)}
.tn-iconbtn--light{background:var(--color-white);color:var(--color-pure-black)}
.tn-iconbtn--light:hover{background:var(--color-highlight-yellow)}
.tn-iconbtn--outline{border-color:currentColor}
.tn-iconbtn--outline:hover,.tn-iconbtn--ghost:hover{background:var(--color-highlight-yellow);color:var(--color-pure-black);border-color:var(--color-highlight-yellow)}

.tn-arrowlink{display:inline-flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-size:16px;line-height:1.25;cursor:pointer}
.tn-arrowlink--block{display:flex;justify-content:space-between;width:100%}
.tn-arrowlink svg{transition:transform var(--duration-fast) var(--ease-standard);flex:none}
.tn-arrowlink:hover{background:none;color:inherit}
.tn-arrowlink:hover .tn-arrowlink__text{background:var(--color-highlight-yellow);color:var(--color-pure-black);box-shadow:0 0 0 .14em var(--color-highlight-yellow)}
.tn-arrowlink:hover svg{transform:translateX(3px)}

.tn-navlink{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;color:inherit;text-decoration:none;font-size:16px;line-height:1.25;padding:4px 0;cursor:pointer;background:none;border:0;font-family:inherit;letter-spacing:inherit}
.tn-navlink__label{text-decoration:none;text-underline-offset:5px;text-decoration-thickness:1px}
.tn-navlink:hover{background:none;color:inherit}
.tn-navlink:hover .tn-navlink__label,.tn-navlink[aria-current="page"] .tn-navlink__label,.tn-navlink[aria-expanded="true"] .tn-navlink__label{text-decoration-line:underline}
.tn-hex{display:inline-block;flex:none;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:var(--color-highlight-yellow)}

.tn-menuitem{display:grid;grid-template-columns:32px 1fr;column-gap:29px;color:var(--text-inverse,#fff);text-decoration:none;cursor:pointer}
.tn-menuitem:hover{background:none;color:inherit}
.tn-menuitem__icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:var(--color-white);transition:color var(--duration-fast) var(--ease-standard)}
.tn-menuitem__body{padding-bottom:24px;border-bottom:1px solid var(--color-b-20)}
.tn-menuitem__title{font-size:24px;line-height:1.1;font-weight:var(--weight-regular);color:var(--color-white);margin:0 0 14px}
.tn-menuitem__desc{font-size:14px;line-height:20px;color:var(--color-web-gray-text);margin:0;max-width:280px;transition:color var(--duration-fast) var(--ease-standard)}
.tn-menuitem__icon{position:relative}
.tn-menuitem__glyph{position:absolute;inset:1px;width:30px;height:30px;transition:opacity var(--duration-fast) var(--ease-standard)}
.tn-menuitem__glyph--on{opacity:0}
.tn-menuitem:hover .tn-menuitem__glyph--on,.tn-menuitem[data-active="true"] .tn-menuitem__glyph--on{opacity:1}
.tn-menuitem:hover .tn-menuitem__icon,.tn-menuitem[data-active="true"] .tn-menuitem__icon{color:var(--color-highlight-yellow)}
.tn-menuitem:hover .tn-menuitem__desc,.tn-menuitem[data-active="true"] .tn-menuitem__desc{color:var(--color-white)}

.tn-tabs{display:flex;gap:var(--space-8);border-bottom:1px solid var(--border-subtle)}
.tn-tab{position:relative;background:none;border:0;padding:12px 0 13px;font-family:inherit;font-size:16px;letter-spacing:inherit;color:var(--text-secondary);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.tn-tab:hover{color:var(--text-primary)}
.tn-tab[aria-selected="true"]{color:var(--text-primary)}
.tn-tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--text-primary)}

.tn-pagination{display:inline-flex;align-items:center;gap:var(--space-7)}
.tn-page{width:18px;height:18px;padding:0;border:0;background:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.tn-page::before{content:"";width:12px;height:12px;background:var(--tn-dot,var(--text-primary));transition:transform var(--duration-fast) var(--ease-standard)}
.tn-page:hover::before{transform:scale(1.15)}
.tn-page[aria-current="true"]::before{width:18px;height:20px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}

.tn-field{display:flex;flex-direction:column;gap:6px;font-family:var(--font-sans)}
.tn-field__label{font-size:14px;font-weight:var(--weight-medium);color:var(--text-primary)}
.tn-field__hint{font-size:12px;line-height:1.25;color:var(--text-tertiary);display:flex;gap:6px;align-items:center}
.tn-field__error{font-size:14px;line-height:1.25;color:var(--color-pure-black);display:flex;gap:8px;align-items:center}
[data-theme="dark"] .tn-field__error{color:var(--color-white)}
.tn-control{position:relative;display:flex;align-items:center}
.tn-input{width:100%;height:44px;box-sizing:border-box;border:1px solid var(--border-default);border-radius:0;background:var(--surface-page);color:var(--text-primary);padding:0 14px;font-family:var(--font-sans);font-size:16px;letter-spacing:var(--tracking-default);outline:none;transition:border-color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard);appearance:none;-webkit-appearance:none}
.tn-input::placeholder{color:var(--text-tertiary)}
.tn-input:hover{border-color:var(--border-strong)}
.tn-input:focus{border-color:var(--border-strong);box-shadow:inset 0 0 0 1px var(--border-strong)}
[data-theme="dark"] .tn-input:focus{border-color:var(--color-highlight-yellow);box-shadow:inset 0 0 0 1px var(--color-highlight-yellow)}
.tn-input[aria-invalid="true"]{border-color:var(--border-strong);box-shadow:inset 0 0 0 1px var(--border-strong)}
.tn-input:disabled{opacity:.45;cursor:not-allowed}
.tn-input--icon{padding-left:42px}
.tn-select{padding-right:42px;cursor:pointer}
.tn-control__icon{position:absolute;pointer-events:none;color:var(--text-secondary);display:flex}

.tn-check{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-sans);font-size:16px;color:var(--text-primary);cursor:pointer;line-height:1.25}
.tn-check input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.tn-check__box{width:20px;height:20px;flex:none;box-sizing:border-box;border:1px solid var(--border-default);background:var(--surface-page);display:inline-flex;align-items:center;justify-content:center;color:var(--color-pure-black);transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}
.tn-check__box svg{opacity:0}
.tn-check:hover .tn-check__box{border-color:var(--border-strong)}
.tn-check input:checked+.tn-check__box,.tn-check input:indeterminate+.tn-check__box{background:var(--color-highlight-yellow);border-color:var(--border-strong)}
[data-theme="dark"] .tn-check input:checked+.tn-check__box{border-color:var(--color-highlight-yellow)}
.tn-check input:checked+.tn-check__box svg,.tn-check input:indeterminate+.tn-check__box svg{opacity:1}
.tn-check input:focus-visible+.tn-check__box,.tn-check input:focus-visible+.tn-radio__hex,.tn-check input:focus-visible+.tn-switch{outline:2px solid var(--focus-ring);outline-offset:2px}
.tn-check input:disabled~*{opacity:.45}
.tn-check:has(input:disabled){cursor:not-allowed}
.tn-radio__hex{width:22px;height:24px;flex:none;position:relative;background:var(--border-default);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.tn-radio__hex::before{content:"";position:absolute;inset:1.4px 1.2px;background:var(--surface-page);clip-path:inherit}
.tn-radio__hex::after{content:"";position:absolute;inset:6px 5.5px;background:var(--color-pure-black);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);opacity:0}
.tn-check:hover .tn-radio__hex{background:var(--border-strong)}
.tn-check input:checked+.tn-radio__hex{background:var(--border-strong)}
.tn-check input:checked+.tn-radio__hex::before{background:var(--color-highlight-yellow)}
.tn-check input:checked+.tn-radio__hex::after{opacity:1}
[data-theme="dark"] .tn-check input:checked+.tn-radio__hex{background:var(--color-highlight-yellow)}
.tn-switch{width:40px;height:22px;flex:none;box-sizing:border-box;border:1px solid var(--border-default);background:var(--surface-page);position:relative;transition:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}
.tn-switch::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;background:var(--border-default);transition:transform var(--duration-base) var(--ease-standard),background-color var(--duration-fast)}
.tn-check:hover .tn-switch{border-color:var(--border-strong)}
.tn-check input:checked+.tn-switch{background:var(--color-highlight-yellow);border-color:var(--border-strong)}
.tn-check input:checked+.tn-switch::after{transform:translateX(18px);background:var(--color-pure-black)}
[data-theme="dark"] .tn-check input:checked+.tn-switch{border-color:var(--color-highlight-yellow)}

.tn-card{box-sizing:border-box;border-radius:0;display:flex;flex-direction:column;position:relative}
.tn-card--light{background:var(--color-white);color:var(--color-pure-black);border:1px solid var(--color-y-30)}
.tn-card--dark{background:var(--color-soft-black);color:var(--color-white);border:1px solid var(--color-b-30)}
.tn-card--raised{background:var(--color-b-10);color:var(--color-white);border:1px solid transparent}
.tn-card--accent{background:var(--color-highlight-yellow);color:var(--color-pure-black);border:1px solid transparent}
.tn-card--subtle{background:var(--color-y-10);color:var(--color-pure-black);border:1px solid transparent}
.tn-card--interactive{cursor:pointer;transition:border-color var(--duration-fast) var(--ease-standard)}
.tn-card--interactive:hover{border-color:var(--color-highlight-yellow)}
.tn-card--light.tn-card--interactive:hover,.tn-card--subtle.tn-card--interactive:hover{border-color:var(--color-soft-black)}

.tn-badge{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;box-sizing:border-box;font-family:var(--font-sans);font-size:12px;font-weight:var(--weight-medium);letter-spacing:var(--tracking-caption);line-height:1;white-space:nowrap;border:1px solid transparent}
.tn-badge--neutral{background:var(--color-y-20);color:var(--color-pure-black)}
.tn-badge--dark{background:var(--color-soft-black);color:var(--color-white)}
.tn-badge--accent{background:var(--color-highlight-yellow);color:var(--color-pure-black)}
.tn-badge--outline{background:transparent;color:currentColor;border-color:currentColor}
.tn-tag{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:4px 10px;box-sizing:border-box;font-family:var(--font-sans);font-size:14px;line-height:1.15;letter-spacing:var(--tracking-default);border:1px solid transparent}
.tn-tag--accent{background:var(--color-highlight-yellow);color:var(--color-pure-black)}
.tn-tag--neutral{background:var(--color-y-10);color:var(--color-pure-black);border-color:var(--color-y-30)}
.tn-tag--dark{background:var(--color-b-10);color:var(--color-white);border-color:var(--color-b-20)}
.tn-tag__remove{display:inline-flex;border:0;background:none;padding:0;margin-right:-2px;color:inherit;cursor:pointer;opacity:.7}
.tn-tag__remove:hover{opacity:1}

.tn-toast{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;width:min(400px,100%);box-sizing:border-box;padding:16px 16px 16px 18px;background:var(--color-soft-black);color:var(--color-white);font-family:var(--font-sans);font-size:14px;line-height:20px}
.tn-toast__icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:var(--color-highlight-yellow);color:var(--color-pure-black);margin-top:-2px}
.tn-toast__title{font-size:16px;line-height:20px;font-weight:var(--weight-medium);margin:0 0 2px}
.tn-toast__action{color:var(--color-highlight-yellow);background:none;border:0;padding:0;font:inherit;cursor:pointer;margin-top:8px;text-decoration:underline;text-underline-offset:.2em}
.tn-tooltip{position:absolute;z-index:var(--z-overlay);background:var(--color-soft-black);color:var(--color-white);font-family:var(--font-sans);font-size:12px;line-height:16px;letter-spacing:var(--tracking-default);padding:6px 10px;white-space:nowrap;pointer-events:none}
.tn-dialog-scrim{position:fixed;inset:0;background:var(--surface-scrim);display:flex;align-items:center;justify-content:center;z-index:var(--z-overlay);padding:24px}
.tn-dialog{position:relative;background:var(--color-white);color:var(--color-pure-black);width:min(560px,100%);box-sizing:border-box;padding:40px;font-family:var(--font-sans)}
.tn-dialog__title{font-size:32px;line-height:1.1;font-weight:var(--weight-regular);margin:0 48px 16px 0}
.tn-dialog__body{font-size:16px;line-height:1.25;color:var(--text-secondary)}
.tn-dialog__actions{display:flex;gap:var(--space-4);margin-top:32px;justify-content:flex-start}