:root{--ink:#253150;--muted:#75809b;--line:#e6eaf4;--coral:#ff716a;--purple:#8b70ef;--mint:#41c7a8;--yellow:#ffc95e;--paper:#fff;font-family:"Noto Sans SC",sans-serif;color:var(--ink)}*{box-sizing:border-box}body{margin:0;background:#fbfcff;min-width:320px}.sky-shape{position:fixed;border-radius:50%;z-index:-1;filter:blur(1px)}.shape-one{width:340px;height:340px;background:#ffe8c9;right:-120px;top:-130px}.shape-two{width:260px;height:260px;background:#e9dcff;left:-140px;bottom:-100px}.app-shell{max-width:1160px;margin:auto;padding:22px 28px 60px}.top{display:flex;justify-content:space-between;align-items:center}.logo{display:flex;align-items:center;gap:9px;color:var(--ink);font:600 21px Fredoka,sans-serif;text-decoration:none}.logo b{display:grid;place-items:center;width:35px;height:35px;background:#fff0ec;border-radius:12px;color:var(--coral)}.top-status{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);background:#fff;padding:8px 12px;border-radius:18px;box-shadow:0 4px 20px #8295bf12}.top-status i{width:8px;height:8px;background:var(--yellow);border-radius:50%}.top-status i.ready{background:var(--mint)}.welcome{min-height:174px;margin:25px 0 16px;padding:30px 38px;background:linear-gradient(115deg,#fff0e9,#f8f0ff 52%,#e9faf6);border:1px solid #fff;border-radius:22px;display:flex;justify-content:space-between;align-items:center;overflow:hidden}.welcome p,.mini-label{font-size:10px;letter-spacing:1px;font-weight:700}.welcome p{color:#b16d63;margin:0 0 9px}.welcome h1{margin:0;font-size:30px;letter-spacing:0}.welcome em{color:var(--coral);font-style:normal}.welcome-art{font:54px Fredoka;color:#8b70ef;position:relative;width:165px}.welcome-art span{position:absolute}.welcome-art span:nth-child(1){top:-35px;left:12px}.welcome-art span:nth-child(2){color:#ffc95e;right:32px;top:-15px;font-size:33px}.welcome-art span:nth-child(3){color:#41c7a8;right:0;top:18px}.tabs{display:flex;gap:10px;margin-bottom:18px}.tab{border:0;background:#fff;color:#79839b;padding:10px 15px;border-radius:12px;font:600 14px inherit;cursor:pointer}.tab.active{color:var(--ink);box-shadow:0 6px 20px #6d7f9d18}.tab-icon{display:inline-grid;place-items:center;width:21px;height:21px;border-radius:7px;margin-right:6px;color:#fff}.coral{background:var(--coral)}.violet{background:var(--purple)}.view{display:none}.view.active{display:block}.studio-grid,.clone-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:18px}.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;box-shadow:0 10px 36px #8191af0d}.writer-card,.controls-card,.clone-card{padding:25px}.card-title{display:flex;justify-content:space-between;gap:14px;margin-bottom:18px}.card-title h2{margin:6px 0 0;font-size:18px}.card-title p{font-size:13px;color:var(--muted);margin:8px 0 0}.mini-label{display:inline-block;padding:5px 7px;border-radius:6px}.peach{background:#fff0ec;color:#d46458}.mint{background:#e6faf4;color:#299d84}.lavender{background:#f0edff;color:#7861d1}output{font:11px monospace;color:#8c95aa}textarea{width:100%;min-height:230px;border:1px solid #e2e7f2;border-radius:14px;background:#fbfcff;padding:16px;color:var(--ink);font:15px/1.8 inherit;outline:0;resize:vertical}textarea:focus,input:focus{border-color:#a995f3;box-shadow:0 0 0 3px #f1edff}.chips{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 20px}.chips button{border:0;background:#f1f5ff;color:#6c7aa0;border-radius:10px;padding:7px 9px;font:12px inherit;cursor:pointer}.cta{width:100%;border:0;color:#fff;border-radius:13px;padding:14px;font:600 15px inherit;cursor:pointer;box-shadow:0 8px 18px #7a7f9b24}.cta span{margin-right:7px}.coral-cta{background:linear-gradient(100deg,#ff806e,#ff5e83)}.purple-cta{background:linear-gradient(100deg,#9a7bf2,#735de1)}.cta:disabled{opacity:.65}.control-row{display:grid;gap:7px;margin-bottom:15px}.control-row>label,.form-grid>label{font-size:12px;font-weight:600;color:#59647e}.control-pair,.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.custom-select{position:relative}.custom-select>button{width:100%;height:41px;border:1px solid #e1e6f0;background:#fff;border-radius:11px;padding:0 12px;text-align:left;color:var(--ink);font:13px inherit;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.custom-select b{font-size:17px;color:#9099ae}.options{display:none;position:absolute;top:46px;left:0;right:0;z-index:5;padding:6px;background:#fff;border:1px solid #e1e6f0;border-radius:11px;box-shadow:0 16px 28px #7380a02b}.custom-select.open .options{display:grid}.options button{border:0;background:#fff;padding:9px;text-align:left;border-radius:7px;color:#44506a;font:13px inherit;cursor:pointer}.options button:hover{background:#f4f1ff;color:#715cdb}.custom-voice,.form-grid input{width:100%;border:1px solid #e1e6f0;border-radius:10px;padding:10px;font:13px inherit;color:var(--ink)}.sliders{display:grid;gap:14px;margin-top:22px}.sliders label{font-size:12px;font-weight:600}.sliders output{float:right}.sliders input{display:block;width:100%;accent-color:#8b70ef;margin-top:8px}.toggles{display:flex;gap:20px;margin-top:20px}.toggles label,.consent{font-size:12px;color:#66718a;display:flex;align-items:center;gap:7px;cursor:pointer}.toggles input,.consent input{display:none}.toggles i{width:30px;height:17px;background:#dfe5ee;border-radius:12px;position:relative}.toggles i:after{content:"";position:absolute;width:13px;height:13px;top:2px;left:2px;background:#fff;border-radius:50%;transition:.2s}.toggles input:checked+i{background:var(--mint)}.toggles input:checked+i:after{transform:translateX(13px)}.result-card{margin-top:18px;min-height:160px;padding:22px}.result-empty{display:flex;align-items:center;justify-content:center;gap:18px;min-height:110px}.result-empty h3,.result-live h3{margin:7px 0}.result-empty p,.result-live p{margin:0;color:var(--muted);font-size:12px}.note-art{display:flex;align-items:center;gap:4px;height:45px}.note-art span{display:block;width:5px;border-radius:8px;background:var(--mint);height:14px}.note-art span:nth-child(2){height:29px;background:var(--yellow)}.note-art span:nth-child(3){height:45px;background:var(--coral)}.note-art span:nth-child(4){height:32px;background:var(--purple)}.note-art span:nth-child(5){height:17px}.result-top{display:flex;justify-content:space-between}.round-button{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#edf9f6;color:#24977d;font-size:21px;text-decoration:none}audio{width:100%;margin:14px 0 8px}.hidden{display:none!important}.upload-area{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:19px}.upload-box{min-height:150px;border:2px dashed #e6d9ff;border-radius:16px;background:#fcfaff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;cursor:pointer}.upload-box input{display:none}.upload-box.optional{background:#f5fffc;border-color:#c9eee5}.upload-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:11px;color:#fff;font-size:18px}.orange{background:#ff9b67}.aqua{background:#4bc9b3}.upload-box strong{font-size:13px}.upload-box small{font-size:11px;color:#8a93a8}.form-grid{margin-bottom:15px}.form-grid>label{display:grid;gap:7px}.clone-card textarea{min-height:95px}.consent{margin:14px 0}.consent i{display:grid;place-items:center;width:17px;height:17px;background:#e4e9f3;border-radius:5px;color:#fff;font-style:normal}.consent input:checked+i{background:var(--mint)}.tip-card{padding:31px 26px;background:linear-gradient(160deg,#8371e8,#a58bee);border-radius:18px;color:#fff}.tip-blob{display:grid;place-items:center;width:47px;height:47px;background:#ffffff2e;border-radius:15px;font-size:24px}.tip-card h3{font-size:19px;line-height:1.55;margin:22px 0}.tip-card ul{padding-left:18px;margin:0}.tip-card li{font-size:13px;line-height:1.8;margin-bottom:10px;color:#f1eeff}.toast{position:fixed;right:25px;bottom:24px;max-width:430px;padding:12px 16px;background:#2f3b55;color:#fff;border-radius:12px;box-shadow:0 12px 30px #27314a33;opacity:0;transform:translateY(8px);transition:.2s;font-size:13px;pointer-events:none}.toast.show{opacity:1;transform:none}.toast.error{background:#d65f63}@media(max-width:760px){.app-shell{padding:17px}.welcome{padding:25px;min-height:145px}.welcome-art{display:none}.welcome h1{font-size:25px}.studio-grid,.clone-grid{grid-template-columns:1fr}.control-pair,.form-grid,.upload-area{grid-template-columns:1fr}.tip-card{display:none}.toggles{flex-wrap:wrap}}
