.ytt{--ytt-pri:#7357ff;--ytt-acc:#24d9f5;--ytt-ink:#20243a;font:inherit;color:var(--ytt-ink)}
.ytt *{box-sizing:border-box}
.ytt__label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ytt__row{display:flex;gap:.6rem;flex-wrap:wrap}
.ytt__input{flex:1 1 260px;min-width:0;min-height:52px;padding:0 1rem;font:inherit;border:2px solid #d9dcec;border-radius:14px;background:#fff;color:var(--ytt-ink);transition:border-color .2s,box-shadow .2s}
.ytt__input:focus{outline:none;border-color:var(--ytt-pri);box-shadow:0 0 0 4px rgba(115,87,255,.18)}
.ytt__btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 1.3rem;font:inherit;font-weight:600;border:0;border-radius:14px;cursor:pointer;text-decoration:none;transition:transform .2s,box-shadow .2s,opacity .2s}
.ytt__btn--go{color:#fff;background:linear-gradient(135deg,var(--ytt-pri),#477bff 60%,var(--ytt-acc))}
.ytt__btn--go:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(115,87,255,.35)}
.ytt__btn--clear,.ytt__btn--ghost{color:var(--ytt-ink);background:#eef0fa}
.ytt__btn--ghost{min-height:42px;font-size:.9rem}
.ytt__btn:focus-visible{outline:3px solid var(--ytt-acc);outline-offset:2px}
.ytt__btn[disabled]{opacity:.7;cursor:progress}
.ytt__btn.is-loading::after{content:"";width:16px;height:16px;margin-left:.6rem;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:ytt-spin .7s linear infinite}
.ytt__trust{margin:.7rem 0 0;font-size:.85rem;opacity:.75}
.ytt__status{min-height:1.5rem;margin-top:.6rem;font-size:.95rem}
.ytt__status.is-error{color:#c0264b;font-weight:600}
.ytt__grid{display:grid;align-items:start;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));margin-top:1rem}
.ytt__card{background:#fff;border:1px solid #e3e6f4;border-radius:16px;overflow:hidden;box-shadow:0 6px 20px rgba(16,20,38,.06);transition:transform .25s,box-shadow .25s}
.ytt__card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(16,20,38,.12)}
.ytt__img{display:block;width:100%;height:auto;background:#eef0fa}
.ytt__body{padding:1rem}
.ytt__q{margin:0 0 .15rem;font-size:1.05rem}
.ytt__dim{margin:0 0 .5rem;font-size:.9rem;opacity:.8}
.ytt__note{margin:0 0 .6rem;font-size:.8rem;opacity:.7}
.ytt__id{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin:1rem 0 0;font-weight:600}.ytt__id code{background:#eef0fa;color:#20243a;padding:.25rem .6rem;border-radius:8px;font-size:1rem}.ytt__id .ytt__btn{min-height:36px}
.ytt__best{margin:1rem 0 0;padding:.7rem 1rem;border-radius:12px;background:rgba(36,217,245,.14);border:1px solid rgba(36,217,245,.45);font-size:1.02rem}
.ytt__note--top{color:inherit;opacity:.9;margin:1rem 0 0;font-size:.9rem}
.ytt__url{width:100%;margin:0 0 .7rem;padding:.55rem .7rem;font:.78rem ui-monospace,Menlo,monospace;border:1px solid #d9dcec;border-radius:10px;background:#f7f8fc;color:#20243a}
.ytt__acts{display:flex;flex-wrap:wrap;gap:.5rem}
.ytt__acts .ytt__btn{flex:1 1 auto}
@keyframes ytt-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ytt *{animation:none!important;transition:none!important}}
