.login-bg{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:var(--sp-6);background:var(--bg-base)}.login-card{width:100%;max-width:400px;background:var(--bg-raised);border:.5px solid var(--border);border-radius:var(--r-card);padding:var(--sp-12) var(--sp-8)}.login-header{text-align:center;margin-bottom:var(--sp-8)}.login-title{font-family:var(--font-display);font-size:28px;font-weight:400;color:var(--white);letter-spacing:-.01em;margin-bottom:var(--sp-2)}.login-subtitle{font-size:13px;color:var(--muted);letter-spacing:.02em}.login-form{display:flex;flex-direction:column;gap:var(--sp-4)}.field-group{display:flex;flex-direction:column;gap:var(--sp-2)}.login-error{font-size:13px;color:#c07070;padding:var(--sp-3) var(--sp-4);background:#c0707014;border:.5px solid rgba(192,112,112,.25);border-radius:var(--r-input)}.field-group-checkbox{display:flex;align-items:center;gap:var(--sp-3);margin-top:var(--sp-1);cursor:pointer;-webkit-user-select:none;user-select:none}.field-group-checkbox input{width:16px;height:16px;cursor:pointer;accent-color:var(--accent);background:var(--bg-subtle);border:1px solid var(--border)}.label-checkbox{font-size:13px;color:var(--secondary);cursor:pointer}.gen-page{min-height:100dvh;display:flex;flex-direction:column;background:var(--bg-base)}.gen-header{position:sticky;top:0;z-index:10;border-bottom:.5px solid var(--border);background:#0c0c0be0;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:var(--sp-4) 0}.gen-header-inner{display:flex;align-items:center;justify-content:space-between}.gen-brand{display:flex;align-items:center;gap:var(--sp-2)}.gen-brand-name{font-family:var(--font-display);font-size:18px;color:var(--white);letter-spacing:-.01em}.gen-brand-tag{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);background:var(--bg-subtle);border:.5px solid var(--border);border-radius:var(--r-tag);padding:2px 6px}.gen-main{display:flex;flex-direction:column;gap:var(--sp-6);padding-top:var(--sp-12);padding-bottom:var(--sp-24)}.gen-section{display:flex;flex-direction:column;gap:var(--sp-3)}.section-label{margin-bottom:var(--sp-2)}.section-title-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-3)}.thoughts-area{min-height:140px;resize:vertical;line-height:1.7}.char-count{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.helper-hint{margin-top:var(--sp-3);font-size:12px;color:var(--muted);display:flex;align-items:center;gap:var(--sp-2)}.hint-icon{font-style:normal;font-size:11px;background:var(--bg-subtle);border:.5px solid var(--border);border-radius:var(--r-tag);padding:1px 5px}.tone-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}.tone-card{background:var(--bg-raised);border:.5px solid var(--border);border-radius:var(--r-card);padding:var(--sp-4) var(--sp-4);cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:var(--sp-1);transition:border-color .15s ease,background .15s ease,transform .1s ease}.tone-card:hover{border-color:var(--muted);transform:translateY(-1px)}.tone-card--active{border-color:var(--secondary)!important;background:#1a1a17;box-shadow:0 0 0 .5px var(--secondary)}.tone-name{font-size:14px;font-weight:400;color:var(--primary);letter-spacing:-.01em}.tone-desc{font-size:12px;color:var(--secondary)}.context-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer}.context-toggle-btn{pointer-events:none;font-size:12px}.context-body{margin-top:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2)}.context-hint{font-size:12px;color:var(--secondary)}.optional-tag{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-left:var(--sp-2)}.btn-generate{font-size:15px;padding:var(--sp-4) var(--sp-8);letter-spacing:.01em}.gen-error{font-size:13px;color:#c07070;padding:var(--sp-3) var(--sp-4);background:#c0707014;border:.5px solid rgba(192,112,112,.25);border-radius:var(--r-input);margin-bottom:var(--sp-2)}.gen-hint{text-align:center;font-size:12px;color:var(--muted);margin-top:var(--sp-2)}.output-card{min-height:160px;transition:border-color .2s ease}.output-card--filled{border-color:var(--border)}.output-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-4);min-height:140px;color:var(--muted)}.output-empty-icon{font-size:28px;opacity:.4}.output-empty-text{font-size:13px;color:var(--muted)}.output-content{display:flex;flex-direction:column;gap:var(--sp-6)}.output-actions{display:flex;align-items:center;justify-content:space-between}.output-btns{display:flex;gap:var(--sp-2)}.output-subject{display:flex;flex-direction:column;gap:var(--sp-2);padding-bottom:var(--sp-4);border-bottom:.5px solid var(--border)}.output-subject-text{font-size:14px;font-weight:400;color:var(--primary)}.output-body{font-size:15px;color:var(--secondary);line-height:1.75}.output-body p{margin:0}.profile-switcher{position:relative}.profile-btn{font-size:13px;padding:6px 12px;height:34px}.profile-dropdown{position:absolute;top:100%;right:0;margin-top:8px;min-width:180px;background:var(--bg-raised);border:.5px solid var(--border);border-radius:var(--r-card);padding:6px;box-shadow:0 10px 25px -5px #0006;z-index:20}.dropdown-item{width:100%;text-align:left;padding:10px 14px;font-size:13px;border-radius:6px;background:none;border:none;color:var(--secondary);cursor:pointer;transition:background .15s ease,color .15s ease}.dropdown-item:hover{background:var(--bg-subtle);color:var(--white)}.dropdown-item.active{color:var(--accent);font-weight:500;background:rgba(var(--accent-rgb),.1)}.dropdown-divider{height:1px;background:var(--border);margin:6px 0}.dropdown-item.add-profile{color:var(--accent);font-weight:500}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;padding:var(--sp-4)}.modal{width:100%;max-width:440px;padding:var(--sp-8)}.modal h2{font-family:var(--font-display);font-size:20px;margin-bottom:var(--sp-1);color:var(--white)}.modal-actions{display:flex;justify-content:flex-end;gap:var(--sp-3);margin-top:var(--sp-8)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeUp .3s ease-out}.modal-card{width:100%;max-width:760px;background:var(--bg-raised);border:1px solid var(--border);box-shadow:0 40px 100px -20px #000c;padding:40px;border-radius:20px;position:relative;max-height:90vh;display:flex;flex-direction:column}.modal-content-scroll{flex:1;overflow-y:auto;padding-right:12px;margin-top:20px}.modal-content-scroll::-webkit-scrollbar{width:4px}.modal-content-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}@media (max-width: 520px){.tone-grid{grid-template-columns:1fr}.modal-card{padding:24px;border-radius:12px}.output-actions{flex-direction:column;align-items:flex-start;gap:var(--sp-3)}.header-right{gap:var(--sp-2)}}:root{--bg-base: #0C0C0B;--bg-raised: #141412;--bg-subtle: #1C1C1A;--border: #252523;--muted: #5A5952;--secondary: #9B9890;--primary: #D4D0C8;--white: #F2EFE8;--accent: #C8A97A;--font-display: "DM Serif Display", Georgia, serif;--font-body: "DM Sans", system-ui, sans-serif;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-6: 24px;--sp-8: 32px;--sp-12: 48px;--sp-16: 64px;--sp-24: 96px;--r-tag: 2px;--r-btn: 4px;--r-input: 6px;--r-card: 10px;--r-pill: 9999px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased}body{background:var(--bg-base);color:var(--primary);font-family:var(--font-body);font-weight:300;line-height:1.6;min-height:100dvh}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg-subtle);border-radius:var(--r-pill)}.container{width:100%;max-width:1000px;margin:0 auto;padding:0 var(--sp-6)}.card{background:var(--bg-raised);border:.5px solid var(--border);border-radius:var(--r-card);padding:var(--sp-6)}.label{font-family:var(--font-body);font-weight:400;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--secondary)}.input{width:100%;background:var(--bg-subtle);border:.5px solid var(--border);border-radius:var(--r-input);color:var(--primary);font-family:var(--font-body);font-weight:300;font-size:15px;padding:var(--sp-3) var(--sp-4);resize:vertical;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.input::placeholder{color:var(--muted)}.input:focus{border-color:var(--secondary);box-shadow:0 0 0 3px #9b989014}.btn-primary{display:flex;align-items:center;justify-content:center;gap:var(--sp-2);width:100%;background:var(--white);color:var(--bg-base);border:none;border-radius:var(--r-btn);font-family:var(--font-body);font-weight:400;font-size:15px;letter-spacing:.02em;padding:var(--sp-4) var(--sp-8);cursor:pointer;transition:opacity .15s ease,transform .1s ease}.btn-primary:hover:not(:disabled){opacity:.92;transform:translateY(-1px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{background:var(--bg-subtle);color:var(--muted);cursor:not-allowed}.btn-ghost{display:inline-flex;align-items:center;gap:var(--sp-2);background:transparent;border:.5px solid #2C2C29;border-radius:var(--r-btn);color:var(--secondary);font-family:var(--font-body);font-weight:400;font-size:13px;padding:var(--sp-2) var(--sp-3);cursor:pointer;transition:color .15s ease,border-color .15s ease}.btn-ghost:hover{color:var(--primary);border-color:var(--muted)}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.fade-up{animation:fadeUp .3s ease both}@keyframes spin{to{transform:rotate(360deg)}}.spinner{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin .7s linear infinite}@media (max-width: 600px){.container{padding:0 var(--sp-4)}}