@import"https://fonts.googleapis.com/css2?family=Chivo:ital,wght@0,300..900;1,300..900&family=Chivo+Mono:ital,wght@0,100..900;1,100..900&display=swap";:root{--bg-color: oklch(.98 .01 80);--ink-black: oklch(.1 0 0);--pure-white: oklch(1 0 0);--ink-gray: oklch(.4 0 0);--highlight-yellow: oklch(.93 .18 105);--error-red: oklch(.6 .25 25);--success-green: oklch(.75 .15 140);--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 40px;--space-3xl: 48px;--border-thick: 3px solid var(--ink-black);--border-thin: 1px solid var(--ink-black)}*{box-sizing:border-box}body{margin:0;padding:0;background-color:var(--bg-color);color:var(--ink-black);font-family:Chivo,sans-serif;line-height:1.4;-webkit-font-smoothing:antialiased}::selection{background-color:var(--highlight-yellow);color:var(--ink-black)}h1{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:900;text-transform:uppercase;line-height:.9;letter-spacing:-.04em;margin:0 0 var(--space-lg) 0}h2{font-size:clamp(1.5rem,4vw,2.5rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;margin:0 0 var(--space-md) 0}.desc{font-size:1.125rem;font-weight:400;color:var(--ink-gray);max-width:60ch;margin-bottom:var(--space-lg)}.step-marker{display:block;font-family:Chivo Mono,monospace;font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding-bottom:var(--space-sm);margin-bottom:var(--space-md);border-bottom:var(--border-thick)}.app-container{min-height:100vh;padding:var(--space-2xl) var(--space-lg);max-width:1200px;margin:0 auto}.header{margin-bottom:var(--space-3xl);padding-bottom:var(--space-3xl);border-bottom:var(--border-thick)}.section-block{margin-bottom:var(--space-3xl);position:relative}@media (min-width: 768px){.section-block.split{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-xl)}}.step-col{display:flex;flex-direction:column}.col-header{height:190px}.input-area{width:100%;background-color:var(--pure-white);border:var(--border-thick);padding:var(--space-lg);color:var(--ink-black);font-family:Chivo Mono,monospace;font-size:.875rem;line-height:1.5;transition:transform .1s,box-shadow .1s;box-shadow:6px 6px 0 0 var(--ink-black)}.input-area:focus{outline:none;transform:translate(2px,2px);box-shadow:4px 4px 0 0 var(--ink-black)}.code-block{height:240px;overflow-y:auto;resize:vertical;margin-bottom:var(--space-md)}.upload-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-md);border:var(--border-thick);background-color:var(--pure-white);cursor:pointer;box-shadow:6px 6px 0 0 var(--ink-black);transition:all .1s;height:160px;margin-bottom:var(--space-md);text-align:center}.upload-zone:hover{transform:translate(2px,2px);box-shadow:4px 4px 0 0 var(--ink-black);background-color:var(--highlight-yellow)}.upload-icon{margin-bottom:var(--space-xs);color:var(--ink-black)}.upload-title{font-weight:800;font-size:1.25rem;letter-spacing:-.02em;margin-bottom:var(--space-xs)}.upload-subtitle{font-size:.875rem;font-weight:500;color:var(--ink-gray)}.file-list-container{flex-grow:1;display:flex;flex-direction:column}.file-list,.file-list-empty{flex-grow:1;display:flex;flex-direction:column;border:var(--border-thick);background-color:var(--pure-white);box-shadow:6px 6px 0 0 var(--ink-black)}.file-list-empty{align-items:center;justify-content:center;color:var(--ink-gray);font-family:Chivo Mono,monospace;font-size:.875rem;text-transform:uppercase;font-weight:700}.file-item{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md);border-bottom:var(--border-thin);font-family:Chivo Mono,monospace;font-size:.875rem;font-weight:600}.file-item:last-child{border-bottom:none}.file-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}.file-item button{background:var(--ink-black);color:var(--pure-white);border:var(--border-thin);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;border-radius:0}.file-item button:hover{background:var(--error-red)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-md) var(--space-2xl);font-family:Chivo,sans-serif;font-weight:800;font-size:1rem;text-transform:uppercase;letter-spacing:.05em;border:var(--border-thick);background-color:var(--pure-white);color:var(--ink-black);cursor:pointer;box-shadow:6px 6px 0 0 var(--ink-black);transition:all .1s}.btn-full{width:100%}.btn:hover:not(:disabled){transform:translate(2px,2px);box-shadow:4px 4px 0 0 var(--ink-black)}.btn:active:not(:disabled){transform:translate(6px,6px);box-shadow:0 0 0 0 var(--ink-black)}.btn-primary{background-color:var(--highlight-yellow)}.btn:disabled{background-color:#e5e5e5;color:var(--ink-gray);box-shadow:2px 2px 0 0 var(--ink-black);transform:translate(4px,4px);cursor:not-allowed}.alert{padding:var(--space-md) var(--space-lg);display:flex;align-items:flex-start;gap:var(--space-md);border:var(--border-thick);font-weight:700;font-size:1rem;margin-bottom:var(--space-lg);box-shadow:6px 6px 0 0 var(--ink-black)}.alert-error{background-color:var(--error-red);color:var(--pure-white)}.alert-success{background-color:var(--success-green);color:var(--ink-black)}.hidden{display:none!important}.spinner{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}::-webkit-scrollbar{width:14px;height:14px;background:var(--bg-color);border-left:var(--border-thin)}::-webkit-scrollbar-thumb{background:var(--ink-black);border:2px solid var(--bg-color)}::-webkit-scrollbar-corner{background:var(--bg-color)}