@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.start{inset-inline-start:var(--spacing)}.hidden{display:none}}:root{--ink:#503521;--muted:#8b7357;--cream:#fff8dc;--paper:#fffdf2;--paper-strong:#fff5c8;--brown:#744527;--brown-dark:#482b1b;--gold:#e8a43b;--gold-soft:#f7cf7b;--mint:#cbd99a;--line:#e4d5ad;--danger:#b75342}*{box-sizing:border-box}html{background:var(--cream)}body{min-height:100vh;color:var(--ink);background-color:var(--cream);background-image:radial-gradient(circle at 15% 10%,#ffffffe6,#0000 24%),radial-gradient(circle at 82% 21%,#f7cf7b52,#0000 28%),linear-gradient(#74452709 1px,#0000 1px),linear-gradient(90deg,#74452709 1px,#0000 1px);background-size:auto,auto,32px 32px,32px 32px;margin:0;font-family:Microsoft YaHei,PingFang SC,Arial,sans-serif}button,textarea,select,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}.topbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:10;background:#fffae0e0;border-bottom:1px solid #74452729;justify-content:space-between;align-items:center;gap:18px;min-height:72px;padding:0 clamp(22px,5vw,74px);display:flex;position:sticky;top:0}.brand{letter-spacing:.05em;color:var(--brown-dark);align-items:center;gap:12px;font-weight:900;display:flex}.brandMark{color:#fff9df;background:#fff8dc;border:3px solid #fff2c5;border-radius:14px 19px;outline:1px solid #59331d52;place-items:center;width:42px;height:42px;display:grid;overflow:hidden;box-shadow:0 6px 14px #5e371e38}.brandMark img{object-fit:cover;mix-blend-mode:multiply;width:100%;height:100%}.connection{color:var(--muted);text-align:right;align-items:center;gap:8px;font-size:13px;display:flex}.connection i{background:#91ae55;border-radius:50%;flex:none;width:9px;height:9px;box-shadow:0 0 0 4px #91ae5524}.hero{isolation:isolate;background:linear-gradient(90deg,#56301af5,#8c592de6 46%,#f7d080bd),linear-gradient(145deg,#5c351e,#d0a058);border:1px solid #7445273d;border-radius:34px;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);align-items:center;width:min(1160px,100% - 36px);min-height:330px;margin:34px auto 22px;padding:clamp(34px,5vw,64px);display:grid;position:relative;overflow:hidden;box-shadow:0 20px 50px #68431e29,inset 0 1px #ffffff38}.hero:before{content:"";z-index:-1;background:radial-gradient(circle at 12% 18%,#ffe9a226,#0000 22%),linear-gradient(110deg,#0000 64%,#ffffff29);position:absolute;inset:0}.hero:after{content:"";z-index:-1;background:#fff8d733;border-radius:50%;width:520px;height:300px;position:absolute;bottom:-145px;right:-70px;transform:rotate(-10deg)}.heroCopy{z-index:2;position:relative}.eyebrow{color:#f8d879;letter-spacing:.22em;margin:0;font-size:12px;font-weight:900}h1{color:#fff9e5;letter-spacing:-.045em;text-shadow:0 3px #341d1140;margin:16px 0;font-family:Microsoft YaHei,PingFang SC,sans-serif;font-size:clamp(40px,5.4vw,70px);font-weight:900;line-height:1.12}h1 em{color:#ffde83;font-style:normal}.sub{color:#f5e8cf;max-width:600px;margin:0;font-size:16px;line-height:1.8}.heroTags{flex-wrap:wrap;gap:8px;margin-top:22px;display:flex}.heroTags span{color:#fff1bd;background:#fffae51a;border:1px solid #fff4ce4d;border-radius:999px;padding:7px 12px;font-size:12px}.heroVisual{align-self:stretch;place-items:center;min-height:250px;display:grid;position:relative}.heroMascot{aspect-ratio:1;object-fit:cover;mix-blend-mode:multiply;border:9px solid #fff6d5;border-radius:50% 45% 48% 42%;width:min(330px,100%);animation:5s ease-in-out infinite mascotBob;transform:rotate(2deg);box-shadow:0 18px 35px #361e1147,0 0 0 2px #5c341d80}.heroNote{border:2px solid var(--brown);color:var(--brown);background:#fff8d9;border-radius:13px 13px 13px 4px;padding:10px 15px;font-size:12px;font-weight:800;position:absolute;bottom:2%;right:4%;transform:rotate(-3deg);box-shadow:4px 5px #482b1b29}.spark{color:#ffdc6e;font-size:28px;animation:2.4s ease-in-out infinite sparkle;position:absolute}.sparkOne{top:16%;left:4%}.sparkTwo{animation-delay:.8s;top:8%;right:4%}@keyframes mascotBob{0%,to{transform:translateY(0)rotate(2deg)}50%{transform:translateY(-8px)rotate(-1deg)}}@keyframes sparkle{0%,to{opacity:.45;transform:scale(.75)rotate(0)}50%{opacity:1;transform:scale(1.15)rotate(20deg)}}.mascotRail{justify-content:center;align-items:center;gap:12px;width:min(1030px,100% - 40px);margin:0 auto 22px;display:flex}.mascotRail img{object-fit:cover;outline:1px solid var(--line);mix-blend-mode:multiply;border:3px solid #fffdf2;border-radius:17px;width:54px;height:54px;box-shadow:0 6px 16px #5e371e21}.mascotRail img:nth-of-type(2),.mascotRail img:nth-of-type(4){transform:rotate(3deg)}.mascotRail span{border:1px solid var(--line);color:var(--brown);background:#fffdf2d6;border-radius:999px;padding:12px 20px;font-size:13px;font-weight:800;box-shadow:0 7px 20px #68431e17}.workspace{grid-template-columns:minmax(300px,.82fr) minmax(420px,1.45fr);gap:18px;width:min(1160px,100% - 36px);margin:0 auto;display:grid}.panel{border:1px solid var(--line);background:linear-gradient(145deg,#fffdf2fa,#fff8daf7);border-radius:27px;padding:32px;box-shadow:0 16px 44px #68431e1f,inset 0 1px #fffc}.panel:hover{border-color:#d6bb80}.cloudPanel{flex-direction:column;align-items:flex-start;display:flex}.cloudPanel p{color:var(--muted);line-height:1.8}.cloudVoiceMark{background:#f5d487;border:6px solid #fff8da;border-radius:42% 58% 50% 46%;outline:2px solid #795037;width:146px;height:146px;margin:4px 0 18px;overflow:hidden;transform:rotate(-2deg);box-shadow:6px 9px #7144261f}.cloudVoiceMark img{object-fit:cover;mix-blend-mode:multiply;width:100%;height:100%}.step{color:var(--muted);letter-spacing:.08em;align-items:center;gap:10px;font-size:13px;font-weight:800;display:flex}.step span{color:#fff8da;background:var(--brown);border-radius:10px;place-items:center;width:30px;height:30px;display:grid;box-shadow:3px 4px #482b1b1f}h2{color:var(--brown-dark);margin:20px 0 18px;font-size:27px;font-weight:900}.voiceCard{background:linear-gradient(120deg,#fff1bb,#f8d994);border:1px solid #ddb970;border-radius:20px;align-items:center;gap:20px;margin-bottom:18px;padding:22px;display:flex;box-shadow:inset 0 1px #fff9}.record{background:repeating-radial-gradient(circle,#7d4c2e 0 3px,#e7bd64 4px 7px);border:0;border-radius:50%;flex:none;width:84px;height:84px;padding:8px;transition:transform .2s,box-shadow .2s;box-shadow:0 7px 17px #61391f3d}.record:hover{transform:scale(1.04)rotate(-2deg);box-shadow:0 10px 22px #61391f4d}.record:focus-visible{outline-offset:4px;outline:3px solid #97af60}.record.playing{animation:5s linear infinite recordSpin}.recordInner{width:100%;height:100%;color:var(--brown-dark);background:linear-gradient(145deg,#c8db9c,#f6cf74);border-radius:50%;place-items:center;padding-left:4px;font-weight:900;display:grid}.record.playing .recordInner{padding-left:0}@keyframes recordSpin{to{transform:rotate(360deg)}}.voiceMeta{flex-direction:column;flex:1;gap:7px;min-width:0;display:flex}.voiceMeta strong{white-space:nowrap;text-overflow:ellipsis;color:var(--brown-dark);overflow:hidden}.voiceMeta small{color:var(--muted);line-height:1.5}audio{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;width:100%;height:34px}.voiceLibrary{gap:9px;margin:0 0 16px;display:grid}.voiceLibraryTitle{justify-content:space-between;align-items:center;padding:0 2px 3px;font-size:13px;display:flex}.voiceLibraryTitle span{color:var(--muted);font-size:12px}.voiceItem{border:1px solid var(--line);background:#fffdf4;border-radius:14px;grid-template-columns:minmax(132px,1fr) minmax(120px,1fr) auto;align-items:center;gap:10px;padding:10px 12px;transition:border-color .2s,background .2s;display:grid}.voiceItem.selected{background:#fff1c2;border-color:#c6923f;box-shadow:inset 0 0 22px #e8a43b14}.voiceChoice{min-width:0;color:var(--ink);text-align:left;background:0 0;border:0;align-items:center;gap:10px;padding:0;display:flex}.voiceChoice i{border:2px solid #b49b79;border-radius:50%;flex:none;width:14px;height:14px;box-shadow:inset 0 0 0 3px #fffdf4}.voiceItem.selected .voiceChoice i{background:#91ae55;border-color:#91ae55;box-shadow:inset 0 0 0 3px #fff4ca}.voiceChoice span{gap:3px;min-width:0;display:grid}.voiceChoice b{white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.voiceChoice small{color:var(--muted);font-size:11px}.voiceItem audio{min-width:110px;height:30px}.deleteVoice{color:var(--danger);background:0 0;border:0;padding:5px 4px;font-size:11px}.secondary,.primary{border:1px solid var(--brown);border-radius:14px;min-height:50px;padding:0 20px;font-weight:900}.secondary{width:100%;color:var(--brown);background:#fff9df;box-shadow:3px 4px #5f371e1f}.secondary:hover{background:#fff0bd;transform:translateY(-1px)}.hint{color:var(--muted);margin:16px 2px 0;font-size:12px;line-height:1.7}.titleRow{justify-content:space-between;align-items:center;display:flex}.titleRow small{color:var(--muted)}.modelPicker{border:1px solid var(--line);background:#fff7d6;border-radius:15px;align-items:center;gap:14px;margin:0 0 14px;padding:13px 15px;display:flex}.modelPicker label{color:var(--brown);flex:none;font-size:13px;font-weight:900}.modelSelectWrap{flex:1;justify-content:space-between;align-items:center;gap:12px;min-width:0;display:flex}.modelSelectWrap select{max-width:180px;min-height:38px;color:var(--brown-dark);background:#fffdf1;border:1px solid #c9aa72;border-radius:12px;outline:none;padding:0 32px 0 12px}.modelSelectWrap select:focus{border-color:#aa742d;box-shadow:0 0 0 3px #e8a43b2e}.modelDetail{color:#738c42;text-align:right;font-size:12px}.modelStatus{color:#a16d30;margin:-5px 4px 12px;font-size:12px}.fishVoicePicker{background:#f3f5d9;border:1px solid #cdd7a2;border-radius:15px;justify-content:space-between;align-items:center;gap:12px;margin:-5px 0 14px;padding:13px 14px;display:flex}.fishVoiceSelect{flex:1;grid-template-columns:auto minmax(130px,180px);align-items:center;gap:5px 12px;min-width:0;display:grid}.fishVoiceSelect label{color:#668039;font-size:13px;font-weight:900}.fishVoiceSelect select{min-height:36px;color:var(--brown-dark);background:#fffff2;border:1px solid #a9bd72;border-radius:12px;outline:none;padding:0 32px 0 12px}.fishVoiceSelect small{color:var(--muted);grid-column:2;font-size:11px}.fishAdd{color:#5f7736;background:#edf2d3;border:1px solid #779246;border-radius:12px;flex:none;min-height:40px;padding:0 14px;font-size:12px;font-weight:900}.fishAdd:hover{background:#e2eab9}textarea{resize:vertical;border:1px solid var(--line);width:100%;height:190px;color:var(--ink);caret-color:var(--brown);background:#fffefa;border-radius:17px;outline:none;padding:18px;line-height:1.8;box-shadow:inset 0 2px 8px #61391f0a}textarea::placeholder{color:#aa9a82}textarea:focus{border-color:#c18d3c;box-shadow:0 0 0 3px #e8a43b26}.notice{border-left:4px solid var(--gold);color:#8e612c;background:#fff0c5;border-radius:4px 13px 13px 4px;gap:12px;margin:16px 0;padding:14px 16px;font-size:12px;line-height:1.6;display:flex}.notice b{white-space:nowrap;color:#8b5526}.primary{color:#fff9dc;background:linear-gradient(#a76d37,#744527);border:1px solid #59351f;justify-content:center;align-items:center;gap:16px;width:100%;display:flex;box-shadow:0 7px #4b2d1c,0 13px 22px #5f371e2b}.primary:hover{background:linear-gradient(#b77a3e,#84502d);transform:translateY(-1px)}.primary:active{transform:translateY(4px);box-shadow:0 3px #4b2d1c}.primary span{font-size:22px}.result{background:#eef3d5;border:1px solid #cbd99a;border-radius:14px;align-items:center;gap:12px;margin-top:18px;padding:14px;display:flex}.result a{color:#5f7736;flex:none;font-weight:900;text-decoration:none}footer{text-align:center;color:#9b8769;padding:32px;font-size:12px}.modalBackdrop{z-index:20;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#3a25179e;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{text-align:center;background:#fff9df;border:1px solid #d4bd8d;border-radius:23px;width:min(440px,100%);padding:30px;box-shadow:0 30px 90px #3f271759}.warning{width:50px;height:50px;color:var(--brown);background:#f5ce76;border:2px solid #9a6034;border-radius:16px;place-items:center;margin:auto;font-size:22px;font-weight:900;display:grid;transform:rotate(-3deg)}.modal h3{color:var(--brown-dark);margin:18px 0 8px;font-size:23px}.modal p{color:var(--muted);font-size:14px;line-height:1.7}.modalActions{grid-template-columns:1fr 1fr;gap:10px;margin-top:24px;display:grid}.fishCreateModal{width:min(520px,100%)}.fishCreateForm{text-align:left;gap:13px;margin-top:20px;display:grid}.fishCreateForm label{color:var(--brown);gap:7px;font-size:13px;font-weight:800;display:grid}.fishCreateForm input,.fishCreateForm textarea{border:1px solid var(--line);width:100%;color:var(--ink);background:#fffefa;border-radius:12px;outline:none;padding:12px 14px}.fishCreateForm input:focus,.fishCreateForm textarea:focus{border-color:#bd8a3d;box-shadow:0 0 0 3px #e8a43b26}.fishCreateForm input[type=file]{color:var(--muted);padding:9px}.fishCreateForm textarea{resize:vertical;height:100px}@media (max-width:820px){.hero{grid-template-columns:1fr;padding:34px}.heroVisual{min-height:240px;margin-top:16px}.heroMascot{width:240px}.workspace{grid-template-columns:1fr}.panel{padding:24px}.topbar{min-height:66px}.connection{max-width:52%}.mascotRail img:nth-of-type(2),.mascotRail img:nth-of-type(3){display:none}}@media (max-width:480px){.topbar{padding:0 16px}.brand{font-size:14px}.connection{font-size:11px}.hero{border-radius:24px;width:calc(100% - 24px);margin-top:18px;padding:28px 22px}h1{font-size:40px}.heroVisual{min-height:205px}.heroMascot{border-width:6px;width:190px}.heroNote{right:0}.mascotRail{width:calc(100% - 28px)}.mascotRail img{width:46px;height:46px}.mascotRail img:nth-of-type(4){display:none}.mascotRail span{padding:10px 14px;font-size:11px}.workspace{width:calc(100% - 24px)}.voiceCard{align-items:flex-start}.record{width:66px;height:66px}.voiceItem{grid-template-columns:1fr auto}.voiceItem audio{grid-column:1/-1}.modelPicker,.modelSelectWrap,.fishVoicePicker{flex-direction:column;align-items:flex-start}.fishVoiceSelect{grid-template-columns:1fr;width:100%}.fishVoiceSelect small{grid-column:1}.modelDetail{text-align:left}.modalActions{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.heroMascot,.spark{animation:none}}