*{box-sizing:border-box}html{background:#f5f7fa;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:#1f2937;-webkit-font-smoothing:antialiased}html[data-loading=true]{cursor:wait}html[data-loading=true]>*{pointer-events:none}html[data-loading=true]:after{content:attr(data-loading-text);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;background:#000c;font-size:14px;padding:12px 24px;border-radius:8px;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}body{margin:0;padding:20px;display:flex;justify-content:center;min-height:100vh}a{color:#2563eb;text-decoration:none;transition:color .2s}a:hover{color:#1d4ed8}.app-container{background:#fff;width:100%;max-width:850px;padding:30px;border-radius:16px;box-shadow:0 10px 25px -5px #0000000d,0 8px 10px -6px #00000003;text-align:center}header{margin-bottom:24px;position:relative}header h1{font-size:24px;font-weight:700;margin:0;color:#111827;letter-spacing:-.025em}header .lang-btn{position:absolute;top:0;right:0;padding:6px 12px;font-size:13px;background:transparent;border:1px solid #e5e7eb;color:#6b7280}header .lang-btn:hover{background:#f3f4f6;border-color:#d1d5db;color:#374151}.mode-tabs{display:flex;justify-content:center;gap:10px;margin-bottom:24px}.tab-btn{padding:10px 20px;font-size:14px;font-weight:600;border:none;background:#f3f4f6;color:#6b7280;border-radius:20px;cursor:pointer;transition:all .2s}.tab-btn:hover{background:#e5e7eb;color:#374151}.tab-btn.active{background:#000;color:#fff}canvas,.output-image{display:block;cursor:pointer;width:100%;aspect-ratio:16 / 18;background:#f3f4f6;border-radius:0;margin-bottom:24px;object-fit:contain}.config-box{margin-bottom:24px;max-width:600px;margin-left:auto;margin-right:auto}.control-group{background:#fff;padding:0;margin:16px 0}.compact-control-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;gap:16px;border-bottom:1px solid #f3f4f6}.compact-control-row:last-child{border-bottom:none}.compact-control-row label{font-weight:600;font-size:14px;color:#374151;width:40px;text-align:left;flex-shrink:0}.compact-control-row input[type=range]{flex:1;margin:0;cursor:pointer;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e5e7eb;border-radius:3px}.compact-control-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:#000;border-radius:50%;box-shadow:0 2px 4px #0000001a;transition:transform .1s}.compact-control-row input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.1)}.compact-control-row .color-picker-wrapper{flex:1;display:flex;justify-content:center;height:32px}.compact-control-row .color-picker-wrapper input[type=color]{width:100%;height:100%;padding:0;border:none;background:none;cursor:pointer}.compact-control-row .color-picker-wrapper input[type=color]::-webkit-color-swatch-wrapper{padding:0}.compact-control-row .color-picker-wrapper input[type=color]::-webkit-color-swatch{border:1px solid #e5e7eb;border-radius:6px}.compact-control-row .value-text{width:48px;text-align:right;font-size:13px;font-variant-numeric:tabular-nums;color:#6b7280;font-weight:500}.input-group{margin-bottom:15px;text-align:left}.input-group label{display:block;margin-bottom:8px;font-weight:600;color:#374151;font-size:14px}.input-group input,.input-group textarea{width:100%;padding:12px;border:1px solid #e5e7eb;border-radius:8px;font-family:inherit;font-size:14px;background:#f9fafb;transition:border-color .2s}.input-group input:focus,.input-group textarea:focus{outline:none;border-color:#000;background:#fff}.input-group small{display:block;margin-top:6px;color:#6b7280;font-size:12px}.action-box{margin:20px 0}.model-status{min-height:20px;font-size:12px;color:#6b7280;margin-top:8px}.output-box{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:24px;max-width:600px;margin-left:auto;margin-right:auto}.btn-group{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;width:100%}.ui-btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 20px;font-size:14px;font-weight:600;border-radius:8px;border:none;cursor:pointer;transition:all .2s ease;text-decoration:none;line-height:1.4;background:#f3f4f6;color:#1f2937}.ui-btn:hover{background:#e5e7eb;transform:translateY(-1px)}.ui-btn:active{transform:translateY(0)}.extract-btn,.download-btn,.download-bg-btn,.download-character-btn{background:#000;color:#fff;width:100%}.extract-btn:hover,.download-btn:hover,.download-bg-btn:hover,.download-character-btn:hover{background:#333;color:#fff;box-shadow:0 4px 12px #00000026}.extract-btn{padding:12px 24px;font-size:15px}.reset-btn{background:transparent;color:#6b7280;margin-top:10px}.reset-btn:hover{background:#fef2f2;color:#4b5563}footer{margin-top:30px;font-size:12px;color:#9ca3af}footer a{color:#6b7280}footer a:hover{color:#111827}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:2000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-box{background:#fff;padding:24px;border-radius:16px;width:90%;max-width:400px;text-align:center;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;animation:modalPop .3s cubic-bezier(.34,1.56,.64,1)}.modal-box h3{margin-top:0;margin-bottom:16px;font-size:18px;color:#111827}.modal-box p{color:#4b5563;margin-bottom:12px;line-height:1.5}.modal-box .warning-text{color:#d97706;font-weight:600;background:#fffbeb;padding:8px;border-radius:6px}.modal-actions{display:flex;gap:12px;margin-top:24px;justify-content:flex-end}.modal-actions button{flex:1}@keyframes modalPop{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@media (min-width: 600px){.btn-group{flex-direction:row}.ui-btn{width:auto}}@media (max-width: 600px){.app-container{padding:20px 16px}.compact-control-row{gap:12px}}@media (max-width: 800px){[data-client=pc]{display:none}}@media (min-width: 800px){[data-client=phone]{display:none}}