@import url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Fraunces:opsz,wght@9..144,600;9..144,800&family=Manrope:wght@500;600;700;800&display=swap');
:root{--ink:#1c2143;--paper:#fffdf5;--yellow:#ffdc4a;--purple:#8953dd;--line:#ded8c9;--red:#d95045}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 80% 0,#e9ddff 0,transparent 31rem),var(--paper);color:var(--ink);font:500 16px Manrope,sans-serif;min-height:100vh}.site-header,main,footer{max-width:1100px;margin:auto}.site-header{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 28px}.brand{font:800 29px Fraunces,serif;text-decoration:none;color:var(--ink);letter-spacing:-1.5px}.brand span{color:var(--purple)}a{color:inherit}.site-header nav a,.text-button{font-weight:800}.site-header nav a{font-size:14px;text-decoration:none;border-bottom:2px solid var(--yellow)}main{padding:56px 28px 80px}.hero{max-width:700px;margin-bottom:48px}.eyebrow{font:700 12px 'DM Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--purple);margin:0 0 13px}h1,h2{font-family:Fraunces,serif;letter-spacing:-.045em}h1{font-size:clamp(44px,8vw,82px);line-height:.98;margin:0 0 20px}h1 em{color:var(--purple);font-style:normal}h2{font-size:28px;margin:0 0 20px}.hero>p:last-child{font-size:18px;max-width:510px;line-height:1.65}.sound-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:16px}.sound-card{height:180px}.sound-button{width:100%;height:100%;border:2px solid var(--ink);background:var(--yellow);border-radius:18px;padding:18px;text-align:left;cursor:pointer;color:var(--ink);box-shadow:5px 5px 0 var(--ink);display:flex;flex-direction:column;transition:transform .12s,box-shadow .12s}.sound-button:hover,.sound-button.playing{transform:translate(4px,4px);box-shadow:1px 1px 0 var(--ink)}.sound-button.playing{background:var(--purple);color:#fff}.icon{font-size:24px}.sound-title{margin-top:auto;font-weight:800;font-size:19px;line-height:1.2}.hint{font:11px 'DM Mono',monospace;margin-top:8px;opacity:.7}.empty{text-align:center;border:2px dashed var(--line);padding:70px 25px;border-radius:18px}.empty div{font:60px Fraunces;color:var(--purple)}.empty h2{margin-bottom:7px}.flash{max-width:650px;margin:0 0 25px;padding:14px 17px;border-radius:10px;font-weight:700}.flash.success{background:#dff3d7}.flash.error{background:#ffe1dc;color:#9d2c23}.auth{max-width:460px;margin:0 auto;padding:20px 0}.auth form,.upload-form{display:grid;gap:16px}label{font-size:14px;font-weight:800;display:grid;gap:8px}input{font:500 16px Manrope,sans-serif;padding:13px 14px;border:2px solid var(--ink);border-radius:9px;background:#fff}input:focus{outline:3px solid #d8c8ff}button{font-family:Manrope,sans-serif}.primary{background:var(--ink);color:#fff;border:0;border-radius:9px;padding:14px 18px;font-weight:800;cursor:pointer;font-size:15px}.small,.muted,small{color:#676b80;font-size:13px;line-height:1.5}.admin-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:36px}.admin-head h1{font-size:52px;margin:0}.text-button{background:transparent;border:0;padding:8px;color:var(--purple);cursor:pointer}.upload-panel{padding:28px;background:#f1eaff;border:2px solid #d4c5ef;border-radius:16px;margin-bottom:45px}.upload-form{grid-template-columns:1fr 1fr auto;align-items:end}.upload-form small{font-weight:500}.manage h2 span{font:12px 'DM Mono',monospace;background:var(--yellow);padding:4px 7px;border-radius:5px;vertical-align:middle;letter-spacing:0}.sound-list{border-top:1px solid var(--line)}.manage-item{display:grid;grid-template-columns:260px 1fr auto;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}audio{width:100%;height:35px}.rename{display:flex;gap:8px}.rename input{width:100%;padding:8px 10px}.delete{border:1px solid var(--red);border-radius:7px;background:transparent;color:var(--red);padding:8px 11px;font-weight:700;cursor:pointer}footer{padding:25px 28px;color:#7a7c87;font:12px 'DM Mono',monospace;border-top:1px solid var(--line)}@media(max-width:700px){main{padding:34px 20px 55px}.site-header{padding:0 20px}.upload-form,.manage-item{grid-template-columns:1fr}.manage-item{gap:11px}.sound-card{height:155px}.admin-head h1{font-size:40px}}