:root{--black: #000000;--white: #ffffff;--gray-50: #fafafa;--gray-100: #f4f4f5;--gray-200: #e4e4e7;--gray-500: #71717a;--gray-800: #27272a;--red: #b91c1c;--green: #15803d;--radius: 0;color:var(--black);background:var(--white);font-family:Helvetica,Arial,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:var(--white);color:var(--black)}button,input{font:inherit}button{background:var(--white);border:1px solid var(--black);border-radius:var(--radius);color:var(--black);cursor:pointer;font-size:.9rem;font-weight:750;min-height:2.75rem;padding:.58rem .85rem;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s ease}button:hover:not(:disabled){background:var(--gray-100)}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,input:focus-visible,[role=button]:focus-visible{outline:2px solid var(--black);outline-offset:2px}button.primary{background:var(--black);border-color:var(--black);color:var(--white)}button.primary:hover:not(:disabled){background:var(--gray-800);border-color:var(--gray-800)}h1,p{margin-top:0}.shell{box-sizing:border-box;display:grid;align-content:start;gap:1.25rem;min-height:100vh;padding:clamp(1.25rem,3vw,2.5rem)}.hero{margin:0 auto;max-width:1500px;padding-top:clamp(2rem,8vw,6rem);text-align:center;width:100%}.hero h1{font-size:clamp(2.75rem,8vw,7rem);font-weight:900;letter-spacing:-.08em;line-height:.9;margin-bottom:.35rem}.lede{color:var(--gray-500);font-size:clamp(1rem,1.4vw,1.18rem);line-height:1.65;margin-left:auto;margin-right:auto;max-width:42rem}.tool-panel{background:var(--white);border-bottom:1px solid var(--black);border-top:1px solid var(--black);display:grid;gap:1rem;margin:0 auto;max-width:48rem;padding:1rem .25rem;width:100%}.url-form,.result-panel{align-items:end;display:grid;gap:.75rem;grid-template-columns:minmax(0,1fr) auto}.field-group{display:grid;gap:.35rem;min-width:0}.field-group label{font-size:.86rem;font-weight:800}.input-wrap{position:relative}.url-input{background:var(--white);border:1px solid var(--black);border-radius:var(--radius);color:var(--black);display:block;min-height:2.75rem;overflow:hidden;padding:.68rem 2.5rem .68rem .75rem;text-overflow:ellipsis;white-space:nowrap;width:100%}.url-input::placeholder{color:var(--gray-500)}.clear-control{align-items:center;color:var(--gray-500);cursor:pointer;display:flex;inset:0 0 0 auto;justify-content:center;position:absolute;width:2.5rem}.clear-control:hover{color:var(--black)}.fetch-button{min-width:10.75rem}.status{border:1px solid currentColor;font-size:.92rem;font-weight:800;padding:.75rem}.error{color:var(--red)}.result-panel{align-items:center;column-gap:.5rem;grid-template-columns:minmax(0,1fr) repeat(2,2.75rem) auto;row-gap:.75rem}.result-input{padding-right:.75rem}.icon-button{align-items:center;display:inline-flex;height:2.75rem;justify-content:center;padding:0;width:2.75rem}.icon{display:block;height:1.35rem;width:1.35rem}.success-icon{color:var(--green)}.copied{color:var(--green);font-size:.88rem;font-weight:800;padding-left:.25rem;white-space:nowrap}.spin{animation:spin .9s linear infinite}.embed-panel{background:var(--gray-100);border:1px solid var(--black);display:flex;justify-content:center;min-height:22rem;overflow:auto;padding:1.25rem}.embed-panel .tiktok-embed{margin:0 auto!important}.embed-loading{font-size:1rem;font-weight:800;min-height:1.5rem;position:relative}.invalid-embed{color:var(--red);font-weight:800}.loading-dots:after{animation:dots 1.2s steps(3,end) infinite;content:"."}.dev-signature{color:var(--black);display:grid;gap:.12rem;justify-items:start;margin:0;padding-top:1rem;text-align:left}.dev-signature small{color:var(--gray-500);font-family:Courier New,Courier,monospace;font-size:.62rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}@media (min-width: 1200px){.dev-signature{bottom:clamp(1rem,2vw,1.5rem);left:clamp(1.25rem,3vw,2.5rem);padding-top:0;position:fixed}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes dots{0%{content:"."}33%{content:".."}66%{content:"..."}to{content:"."}}@media (max-width: 640px){.shell{padding:1.25rem}.hero{padding-top:2rem}.hero h1{font-size:clamp(2.55rem,16vw,4.5rem)}.url-form,.result-panel{align-items:stretch;grid-template-columns:1fr}.fetch-button{min-width:0;width:100%}.result-panel{grid-template-columns:repeat(2,minmax(0,1fr))}.result-input,.copied{grid-column:1 / -1}.result-panel .icon-button{width:100%}}
