:root{--paper: #f5f3ee;--white: #fff;--ink: #0a0a0a;--red: #e10600;--muted: #62615d;--line: #d6d3cc;--font: Arial, Helvetica, sans-serif;--s1: 4px;--s2: 8px;--s3: 12px;--s4: 16px;--s5: 24px;--s6: 32px;--s7: 48px;--edge: 0 0 0 2px var(--ink);--shadow: 5px 5px 0 var(--ink);--small: 14px;--body: 16px;--title: 48px;--duration: .16s}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:var(--body) / 1.5 var(--font)}[hidden]{display:none!important}a{color:inherit;text-underline-offset:4px}button,input,textarea{font:inherit}button,.button{display:inline-flex;justify-content:center;align-items:center;gap:var(--s3);min-height:46px;padding:var(--s3) var(--s4);background:var(--white);color:var(--ink);box-shadow:var(--edge);border:0;font-weight:600;text-decoration:none;cursor:pointer;transition:transform var(--duration)}button:hover,.button:hover{transform:translateY(-2px)}button:disabled{opacity:.45;cursor:not-allowed;transform:none}.primary{background:var(--ink);color:var(--white)}.primary svg{width:22px;height:22px}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,.button:focus-within{outline:3px solid var(--red);outline-offset:5px}.top,main,.about,footer{width:min(1248px,calc(100% - 80px));margin-inline:auto}.top{display:flex;justify-content:space-between;align-items:center;padding-block:var(--s5);box-shadow:0 2px 0 var(--ink)}.brand{display:flex;align-items:center;gap:var(--s3);text-decoration:none;font-size:13px;font-weight:900;line-height:1.05;letter-spacing:-.4px}.brand img{width:48px;height:48px}.maker{font-size:var(--small);text-decoration:none}.maker strong{display:inline-block}.intro{display:flex;justify-content:space-between;align-items:center;padding-block:64px var(--s7)}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1.3px;margin:0 0 var(--s4)}h1,h2,p{margin-top:0}h1{font-size:clamp(40px,5.5vw,76px);line-height:.98;letter-spacing:-.055em;margin-bottom:var(--s5);font-weight:900}h1 span{color:var(--red)}.lead{font-size:20px;line-height:1.45;letter-spacing:-.3px;margin-bottom:0}.intro-note{display:flex;align-items:center;gap:var(--s5);padding-right:var(--s6)}.note-number{font-size:160px;line-height:1;font-weight:900;letter-spacing:-12px;color:var(--red)}.intro-note p{font-size:18px;line-height:1.3;margin:0;font-weight:600}.tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5);padding-bottom:64px}.tool-card{background:var(--white);box-shadow:var(--edge),var(--shadow);padding:var(--s5);text-decoration:none;display:flex;flex-direction:column;min-height:280px;transition:transform var(--duration)}.tool-card:hover{transform:translate(-2px,-2px)}.card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--s6)}.card-top svg{width:46px;height:46px}.number{font-size:12px;font-weight:700;letter-spacing:1px}.tool-card h2{font-size:27px;line-height:1.06;letter-spacing:-1.1px;margin-bottom:var(--s4);font-weight:800}.tool-card h2 span{display:block;font-size:12px;letter-spacing:1px;margin-bottom:var(--s2)}.tool-card p{color:var(--muted);font-size:var(--small);line-height:1.5;max-width:29ch;margin-bottom:var(--s5)}.card-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:auto;font-size:12px;font-weight:600}.arrow{font-size:25px;color:var(--red)}.explain-card{grid-column:1 / -1;padding:var(--s5);display:flex;flex-direction:column;align-items:flex-start}.playful-card{background:var(--ink);color:var(--white)}.playful-card p{color:var(--paper)}.playful-card .number{color:var(--white);box-shadow:inset 0 -3px var(--red);padding-bottom:5px}.playful-card .card-top svg{transform:rotate(-9deg)}.explain-card h2{font-size:32px;line-height:1.05;letter-spacing:-1px}.explain-card p:not(.eyebrow){font-size:var(--small);max-width:30ch}.explain-card a{font-size:12px;font-weight:600;margin-top:auto}.about{box-shadow:0 -2px 0 var(--ink);padding-block:var(--s7);display:grid;grid-template-columns:1fr 2fr;gap:var(--s7)}.about h2{font-size:32px;line-height:1.1;letter-spacing:-1px}.about p{font-size:var(--small);line-height:1.7;max-width:76ch}.about details{font-size:var(--small)}summary{cursor:pointer;font-weight:600}details p:first-of-type{margin-top:var(--s4)}footer{display:flex;justify-content:space-between;padding-block:var(--s5);box-shadow:0 -1px 0 var(--line);font-size:12px}#tool{padding-top:var(--s6);padding-bottom:var(--s7)}.back{display:inline-block;font-size:var(--small);margin-bottom:var(--s6);text-decoration:none}.tool-heading{display:flex;gap:var(--s5);align-items:flex-start;margin-bottom:var(--s6)}.tool-icon{background:var(--white);padding:var(--s4);box-shadow:var(--edge);width:80px;height:80px;flex-shrink:0}.tool-icon svg{width:48px;height:48px}.tool-heading h1{font-size:var(--title);line-height:1.05;letter-spacing:-2px;margin-bottom:var(--s3)}.tool-heading h1 span{color:var(--ink)}.tool-heading .eyebrow{margin-bottom:var(--s2)}.tool-heading .lead{font-size:18px}.actions,.run-bar,.output-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s4)}.button input{position:absolute;width:1px;height:1px;opacity:0}.example-note{font-size:12px;color:var(--muted);margin:var(--s4) 0 var(--s5)}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5)}.pane{background:var(--white);box-shadow:var(--edge);padding:var(--s5);min-width:0}.pane h2{display:flex;align-items:center;gap:var(--s3);font-size:18px;line-height:1.3;margin:0 0 var(--s5);letter-spacing:-.4px}.pane h2 small{margin-left:auto;font-weight:400;font-size:12px;color:var(--muted);text-align:right}.step{font-size:11px;color:var(--red);letter-spacing:0}.audio-empty,.image-empty{display:flex;min-height:160px;align-items:center;justify-content:center;flex-direction:column;color:var(--muted);text-align:center}.audio-empty svg,.image-empty svg{height:48px;width:48px;margin-bottom:var(--s4)}.audio-empty p{font-size:var(--small)}audio{width:100%;margin-block:var(--s4)}.filename{font-size:12px;color:var(--muted);overflow-wrap:anywhere}.run-bar{margin-top:var(--s5);min-height:48px}.run-bar span{font-size:12px;color:var(--muted)}.status{margin-top:var(--s5);padding:var(--s4);background:var(--white);box-shadow:inset 3px 0 0 var(--red);font-size:var(--small)}.status.error{color:var(--red)}.status button{margin:var(--s4)}progress{display:block;width:100%;margin-top:var(--s3);height:6px;accent-color:var(--red)}.metrics,.hint{font-size:12px;color:var(--muted);margin:var(--s3) 0}.metrics:empty{display:none}.model-credit{display:flex;gap:var(--s5);flex-wrap:wrap;font-size:12px;padding-top:var(--s5);margin-top:var(--s5);box-shadow:0 -1px 0 var(--line)}textarea{display:block;width:100%;resize:vertical;min-height:250px;padding:var(--s4);border:0;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);background:var(--white);font-size:var(--small);line-height:1.7}textarea:read-only{background:var(--paper)}.output-actions{margin-top:var(--s4)}.output-actions button,.pane>button{font-size:12px;min-height:40px;padding:var(--s2) var(--s3)}.detected{margin-top:var(--s4);font-size:12px}.detected>div{white-space:pre-wrap;line-height:1.8}.detected p{font-weight:600}mark{background:#ffe0dd;padding:2px}canvas#sketch,#clean-svg{display:block;aspect-ratio:600/380;width:100%;height:auto;background-color:var(--white);background-image:radial-gradient(var(--line) 1px,transparent 1px);background-size:20px 20px}canvas#sketch{touch-action:none;cursor:crosshair}#shape-info{font-size:12px;margin-top:var(--s4)}.eye-layout{display:grid;grid-template-columns:1fr 1.5fr;gap:var(--s5);align-items:start}#original-photo{width:100%;max-height:500px;object-fit:contain;background:var(--paper)}.crops{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4)}.crops>p{grid-column:1/-1;font-size:var(--small);color:var(--muted)}.crop canvas{display:block;width:100%;height:190px;object-fit:contain;background:var(--paper);margin-block:var(--s4)}.crop-title{font-size:12px}.crop-title strong{display:block;font-size:18px}.crop-title span{color:var(--muted)}.crop button{font-size:12px;padding:var(--s2);width:100%;min-height:40px}.crop-sliders label{display:block;font-size:11px;margin-bottom:var(--s2)}.crop-sliders input{display:block;width:100%;accent-color:var(--ink)}.crop small{display:block;font-size:11px;margin-top:var(--s2)}#word-links>p{font-size:12px;margin-top:var(--s4)}#word-links>div{max-height:130px;overflow:auto}#word-links button{border:0;box-shadow:none;font-size:12px;font-weight:400;min-height:30px;display:inline;padding:var(--s1);background:var(--paper)}@media(max-width:1000px){.intro-note{display:none}.tools-grid{grid-template-columns:repeat(2,1fr)}.eye-layout{grid-template-columns:1fr}.eye-layout .pane:first-child{display:block}#original-photo{max-height:300px}}@media(max-width:650px){.top,main,.about,footer{width:calc(100% - 36px)}.top{padding-block:var(--s4);gap:var(--s4)}.maker{font-size:11px;max-width:140px;text-align:right}.brand img{width:40px;height:40px}.brand{font-size:11px;gap:var(--s2)}.intro{padding-block:var(--s7) var(--s6)}h1{font-size:48px}.lead{font-size:18px}.tools-grid{grid-template-columns:1fr;gap:var(--s5);padding-bottom:var(--s7)}.tool-card{min-height:240px}.card-top{margin-bottom:var(--s5)}.tool-card h2{font-size:30px}.tool-card p{max-width:none}.about{grid-template-columns:1fr;gap:var(--s4);padding-block:var(--s6)}footer{gap:var(--s4);font-size:11px;flex-wrap:wrap}.tool-heading{gap:var(--s4)}.tool-icon{width:52px;height:52px;padding:var(--s2)}.tool-icon svg{width:36px;height:36px}.tool-heading h1{font-size:34px;letter-spacing:-1.4px}.tool-heading .lead{font-size:var(--body)}.tool-heading .eyebrow{font-size:10px}.comparison{grid-template-columns:1fr}.actions{gap:var(--s3)}.actions .primary{width:100%}.actions>button:not(.primary),.actions>.button{flex:1;font-size:var(--small)}.pane{padding:var(--s4)}.pane h2{margin-bottom:var(--s4)}.run-bar>.primary{width:100%}.model-credit{gap:var(--s3);flex-direction:column}.crops{grid-template-columns:1fr}.crop{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);box-shadow:0 1px 0 var(--line);padding-bottom:var(--s4)}.crop canvas{grid-column:1;grid-row:2/4;height:180px;margin:0}.crop-title{grid-column:1/-1}.crop button{grid-column:2}.crop-sliders{grid-column:2;grid-row:2}.crop small{grid-column:1/-1}.example-note{line-height:1.6}textarea{min-height:210px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}@media(max-width:650px){.tool-card{min-height:205px}.card-top{margin-bottom:var(--s4)}.card-top svg{width:36px;height:36px}.tool-card p{margin-bottom:var(--s4)}}.compatibility{background:var(--white);box-shadow:inset 4px 0 0 var(--red);padding:var(--s4) var(--s5);margin-bottom:var(--s6);font-size:var(--small)}.compatibility strong{display:block;font-size:var(--body)}.compatibility p{margin:var(--s2) 0 0;max-width:100ch;line-height:1.6}.compatibility small{display:block;margin-top:var(--s2);color:var(--muted)}.compatibility[data-level=blocked] strong{color:var(--red)}.button[aria-disabled=true]{opacity:.45;cursor:not-allowed;pointer-events:none}.breakbeat-workspace{align-items:stretch;grid-auto-rows:1fr}.breakbeat-workspace .pane{display:flex;flex-direction:column}.beat-sketch-stage{height:300px;display:flex;align-items:center}.breakbeat-workspace .output-actions,.breakbeat-workspace .beat-controls{margin-top:var(--s4)}#beat-sketch{display:block;width:100%;height:auto;background-image:radial-gradient(var(--line) 1px,transparent 1px);background-size:20px 20px;touch-action:none;cursor:crosshair}#beat-sketch[aria-disabled=true]{cursor:wait}#beat-sequence{width:100%;height:300px;display:block;touch-action:none;user-select:none}#beat-grid line{stroke:var(--line);stroke-width:1}#beat-grid text{fill:var(--muted);font-size:12px}.beat-note{stroke:var(--ink);fill:none;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;cursor:grab}.beat-note[data-kind=triangle]{stroke:var(--red)}.beat-note.is-playing{stroke-width:4}.beat-note.is-playing circle:not(.beat-hit),.beat-note.is-playing polygon{fill:var(--red);stroke:var(--red)}.beat-note .beat-hit{stroke:transparent;fill:transparent}#beat-head{stroke:var(--red);stroke-width:1.5;opacity:.6;pointer-events:none}.beat-add span,.beat-legend,#beat-info,.beat-source{font-size:12px}.beat-controls,.beat-legend{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s4)}.beat-controls label{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s2);font-size:12px}.beat-controls input{width:105px;accent-color:var(--red)}#beat-info{margin:var(--s4) 0 0}.beat-legend{margin-top:var(--s5);font-weight:600}.beat-source{color:var(--muted);margin:var(--s3) 0 0}@media(max-width:650px){.compatibility{padding:var(--s4);margin-bottom:var(--s5)}}