:root{font-family:ui-rounded,'Avenir Next',Avenir,system-ui,sans-serif;color:#263f32;background:#faf8ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,.file-button{cursor:pointer;border:1px solid #dae2d6;background:#fff;color:#304e3a;border-radius:14px;padding:12px 20px;font-weight:700;transition:transform .15s,background .15s}button:hover,.file-button:hover{background:#eef3e9;transform:translateY(-2px)}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #de9b39;outline-offset:4px}button:disabled{opacity:.5;cursor:default}header{max-width:1160px;margin:auto;padding:28px 36px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:12px;align-items:center;color:inherit;text-decoration:none;font-weight:850;font-size:24px;letter-spacing:-1px}.brand small{display:block;font-size:11px;font-weight:500;letter-spacing:1px;margin-top:2px}.sun{background:#f5dc88;color:#9e6c23;width:48px;height:48px;border-radius:16px;display:grid;place-items:center;font-size:34px}.quiet{font-size:13px;background:transparent}main{max-width:1088px;margin:auto;padding:20px 32px}.intro{text-align:center;margin:30px 0 38px}.eyebrow{font-size:11px;letter-spacing:2.3px;font-weight:800;color:#75896b}h1{font-size:clamp(32px,4.4vw,53px);letter-spacing:-2px;margin:14px 0;font-weight:800}h1 em{font-family:Georgia,serif;font-weight:400;color:#658157}.intro p{color:#7a8377;font-size:16px}.lesson{border:1px solid #e1e6d8;background:#fffef9;border-radius:28px;padding:24px;box-shadow:0 12px 40px #4c603b06}.lesson-top,.lesson-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px}.lesson-name{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:700}.dot{width:8px;height:8px;background:#76a27e;border-radius:50%}.languages{display:flex;background:#f0f2e9;padding:4px;border-radius:13px}.languages button{border:0;background:transparent;padding:9px 22px;font-size:13px}.languages .active{background:#477756;color:white;box-shadow:0 3px 7px #355b3520}.cards{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:23px 0}.card{position:relative;background:#f3eddf;border:1px solid #eee5d1;border-radius:22px;overflow:hidden}.card:nth-child(even){background:#edf0e6;border-color:#e2e6d9}.card .tag{position:absolute;top:16px;left:16px;font-size:10px;letter-spacing:1.5px;color:#8e8c7a;background:#fff9;padding:6px 9px;border-radius:7px}.art{height:260px;width:100%;object-fit:contain;mix-blend-mode:multiply;padding:5px 34px}.card-info{padding:8px 24px 23px;display:flex;justify-content:space-between;align-items:center}.card h2{font-size:32px;margin:0 0 3px;letter-spacing:-1px}.translation{font-size:14px;color:#8b8d7e}.sound{border:0;border-radius:50%;background:white;width:58px;height:58px;padding:0;font-size:24px;box-shadow:0 4px 10px #354b2510}.lesson-bottom{padding:0 3px;font-size:13px;color:#7a8377}.primary{background:#477756;color:#fff;border-color:#477756}.primary:hover{background:#365f43}.guide{display:flex;justify-content:space-between;gap:20px;margin:32px 15px}.guide>div{display:flex;align-items:center;gap:12px}.number{border:1px solid #dfdfce;color:#8b9678;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:13px}.guide p{margin:0;font-size:13px}.guide small{display:block;color:#909486;font-size:11px;margin-top:5px}footer{border-top:1px solid #e8e8dc;padding:24px 0;display:flex;justify-content:space-between;gap:18px;font-size:9px;letter-spacing:1.3px;color:#8b947f}dialog{border:1px solid #dce1d4;border-radius:24px;width:min(740px,95vw);padding:28px;color:#304e3a;background:#fffef9;max-height:90dvh}dialog::backdrop{background:#243e3266;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.dialog-head h2{margin:10px 0}dialog p{font-size:14px;line-height:1.6;color:#78816f}.note{background:#f5edda;padding:12px;border-radius:12px;font-size:12px}label{display:block;font-weight:650;font-size:13px;margin:15px 0}input,select{display:block;width:100%;padding:11px;margin-top:8px;border:1px solid #d9dfd0;border-radius:9px;background:#fff;color:#304e3a}input[type=file]{font-size:11px}fieldset{border:1px solid #d9dfd0;border-radius:12px;padding:12px;min-width:0}fieldset small{display:block;margin-top:10px;font-size:11px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:18px}.actions{display:flex;justify-content:space-between;gap:12px;margin-top:22px}.backup{border-top:1px solid #e2e5d8;margin-top:28px;padding-top:10px}.file-button{display:inline-block;font-size:13px}.file-button input{display:none}details{margin-top:18px;font-size:13px}#player{text-align:center;width:min(620px,95vw)}#player .art{height:330px}#player h2{font-size:44px;margin:0 0 10px}#status:not(:empty){position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#263f32;color:white;padding:14px 22px;border-radius:12px;z-index:10;max-width:90vw;font-size:14px}@media(max-width:600px){header{padding:20px}.brand{font-size:20px}.quiet{padding:10px}.quiet span{display:none}main{padding:0 16px}.intro{margin:25px 0}.intro p{font-size:14px}h1{letter-spacing:-1px}.lesson{padding:16px}.lesson-top{flex-wrap:wrap}.cards{gap:12px}.art{height:170px;padding:0 10px}.card-info{padding:8px 12px 15px;gap:5px}.card h2{font-size:24px}.sound{width:42px;height:42px;font-size:19px}.card .tag{font-size:8px;top:10px;left:10px}.translation{font-size:12px}.lesson-bottom{flex-wrap:wrap}.guide{margin:25px 4px;gap:13px;flex-direction:column}.guide small{display:inline;margin-left:9px}.number{width:28px;height:28px}footer{font-size:8px;line-height:1.6;flex-wrap:wrap}.fields{grid-template-columns:1fr}dialog{padding:20px}.actions button{padding:10px 14px}}