:root{
  --bg:#090b0f;--side:#0b0e13;--panel:#11151b;--panel2:#171c24;--line:#2c3440;
  --gold:#e7b94b;--gold2:#8b6a22;--text:#f4f6f8;--muted:#929aa6;--green:#45d98d;
  --red:#ff6a72;--shadow:0 18px 45px rgba(0,0,0,.28)
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Roboto,Arial,sans-serif}
button,textarea{font:inherit}
button{cursor:pointer}
.shell{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:100vh}
.sidebar{position:sticky;top:0;height:100vh;background:var(--side);border-right:1px solid var(--line);padding:24px 18px;display:flex;flex-direction:column;justify-content:space-between}
.brand{display:flex;align-items:center;gap:12px;margin-bottom:30px}
.mark{width:48px;height:48px;border:1.5px solid var(--gold);border-radius:12px;display:grid;place-items:center;color:var(--gold);font-size:22px;font-weight:950;box-shadow:inset 0 0 0 1px rgba(231,185,75,.06)}
.brand strong{display:block;letter-spacing:3px;font-weight:950}
.brand small{display:block;color:var(--muted);font-size:10px;letter-spacing:1.3px;margin-top:3px}
nav{display:grid;gap:8px}
.nav{border:0;border-left:2px solid transparent;background:transparent;color:#c5cad3;text-align:left;padding:12px 14px;border-radius:8px}
.nav:hover{background:#141922}.nav.active{background:#181e27;color:var(--gold);border-left-color:var(--gold);font-weight:850}
.side-bottom{display:grid;gap:14px}.side-bottom>small{color:var(--muted);font-size:10px}
.language{display:flex;border:1px solid var(--line);padding:4px;border-radius:10px}
.language button{flex:1;border:0;background:transparent;color:var(--muted);padding:7px;border-radius:7px}
.language button.active{background:var(--gold);color:#111;font-weight:900}
main{width:100%;max-width:1540px;padding:28px 32px 24px}
.topbar{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:18px}
.eyebrow,.kicker{font-size:10px;letter-spacing:1.8px;font-weight:900;color:#aab1bb}
.eyebrow{color:var(--gold);letter-spacing:3px}
h1{font-size:clamp(28px,3vw,44px);margin:6px 0 6px;line-height:1.05;letter-spacing:-1.3px}
.sub{color:var(--muted);margin:0;font-size:14px}
.badge{border:1px solid #315943;background:#0d1b14;color:#9aeabc;padding:8px 11px;border-radius:999px;font-size:10px;font-weight:900;white-space:nowrap}
.badge span{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:6px;box-shadow:0 0 10px var(--green)}
.badge.demo{border-color:#6b5521;color:#f2d171;background:#1b170d}.badge.demo span{background:var(--gold);box-shadow:none}
.view{display:none}.view.active{display:block}
.control-card,.editor-card,.changes-card,.history-card,.about-card{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}
.control-card{padding:13px 14px;margin-bottom:14px;display:flex;align-items:center;gap:22px;justify-content:space-between}
.control-group{display:flex;align-items:center;gap:10px;min-width:0}.control-group label{font-size:9px;letter-spacing:1.5px;color:var(--muted);font-weight:900}
.segmented{display:flex;gap:5px;flex-wrap:wrap}
.segmented button{border:1px solid #38414d;background:#0d1117;color:#aeb5bf;border-radius:9px;padding:7px 10px;font-size:11px;font-weight:800}
.segmented button:hover{border-color:#626b77;color:#fff}
.segmented button.active{border-color:#7c6227;background:#211b0f;color:#f2c95f}
.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;min-height:470px}
.editor-card{padding:16px;display:flex;min-width:0;flex-direction:column}
.result-card{border-color:#4a3d20}
.card-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.card-head strong{display:block;margin-top:5px;font-size:15px}
.gold{color:var(--gold)}
.ghost{border:1px solid #343c47;background:#0e1218;color:#aeb5bf;border-radius:8px;padding:7px 10px;font-size:11px}
.ghost:hover{border-color:#626b77;color:#fff}
textarea{resize:none;width:100%;flex:1;min-height:370px;border:0;background:transparent;color:var(--text);outline:0;padding:22px 2px 14px;font-size:16px;line-height:1.65}
textarea::placeholder{color:#59616d}
.result{flex:1;min-height:370px;padding:22px 2px 14px;font-size:16px;line-height:1.65;white-space:pre-wrap;overflow:auto}
.result.empty{color:#59616d}
.editor-foot{padding-top:11px;border-top:1px solid #252c35;display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:10px}
.action-row{display:flex;align-items:center;gap:10px;margin:14px 0}
.primary{border:0;background:var(--gold);color:#111;border-radius:11px;padding:12px 18px;font-weight:950;letter-spacing:.8px}
.primary:hover{filter:brightness(1.06)}.primary:disabled{opacity:.55;cursor:wait}
.spark{margin-right:6px}
.secondary{border:1px solid #3b4450;background:#151a22;color:#d8dde4;border-radius:11px;padding:11px 14px;font-weight:800}
.secondary:disabled{opacity:.4;cursor:not-allowed}
.ethics{margin-left:auto;color:var(--muted);font-size:10px}
.changes-card{padding:16px;margin-top:14px}.changes-card ul{margin:16px 0 2px;padding-left:20px;color:#d9dde3}.changes-card li{margin:8px 0;line-height:1.5}
.hidden{display:none!important}
.history-card{padding:18px}.muted{color:var(--muted)}
.history-list{display:grid;gap:10px;margin-top:16px}.history-empty{padding:30px 10px;color:#59616d;text-align:center}
.history-item{border:1px solid #2d3540;background:#0d1117;border-radius:12px;padding:13px}
.history-item-top{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-bottom:7px}
.history-item p{margin:0;color:#d9dde3;line-height:1.45;white-space:pre-wrap}
.about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:14px}.about-card{padding:24px;min-height:240px}.about-card.featured{border-color:#5a4822}.about-card h2{font-size:30px;line-height:1.08;margin:12px 0}.about-card p{color:#aeb5bf;line-height:1.7}
footer{display:flex;justify-content:space-between;color:#5f6772;font-size:9px;letter-spacing:1px;padding-top:18px}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#f0c55a;color:#111;font-weight:900;border-radius:10px;padding:10px 14px;transition:.18s ease;box-shadow:var(--shadow);z-index:10}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1000px){
  .shell{grid-template-columns:86px 1fr}.sidebar{padding:18px 10px}.brand{justify-content:center}.brand>div:last-child,.side-bottom>small{display:none}.nav{text-align:center;padding:11px 5px;font-size:10px}
  main{padding:22px 20px}.control-card{align-items:flex-start;flex-direction:column;gap:12px}
}
@media(max-width:760px){
  .shell{display:block}.sidebar{position:static;width:100%;height:auto;padding:10px 12px;flex-direction:row;gap:10px;align-items:center}
  .brand{margin:0}.mark{width:38px;height:38px}.sidebar nav{display:flex;overflow:auto;flex:1}.nav{white-space:nowrap}.side-bottom{display:block}.language{min-width:88px}
  main{padding:16px}.topbar{align-items:flex-start}.badge{margin-top:2px}.editor-grid{grid-template-columns:1fr;min-height:0}.editor-card{min-height:390px}
  textarea,.result{min-height:300px}.action-row{flex-wrap:wrap}.ethics{width:100%;margin-left:0}.about-grid{grid-template-columns:1fr}
}
.top-actions{display:flex;align-items:center;gap:8px}.usage-badge{border:1px solid #4a3d20;background:#17140c;color:#f1cc69;padding:8px 11px;border-radius:999px;font-size:10px;font-weight:900;white-space:nowrap}
.pricing-head{margin:8px 0 18px}.pricing-head h2{font-size:32px;margin:8px 0 6px}.pricing-head p{color:var(--muted);margin:0}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.plan-card,.redeem-card{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.plan-card{padding:22px;display:flex;flex-direction:column;min-height:350px}.featured-plan{border-color:#715a24;box-shadow:0 18px 50px rgba(231,185,75,.08)}.plan-name{font-size:11px;letter-spacing:2px;font-weight:950}.plan-price{font-size:40px;font-weight:950;margin-top:18px}.plan-card>small{color:var(--muted)}.plan-card ul{padding-left:18px;margin:28px 0;display:grid;gap:12px;color:#cfd4db;line-height:1.35}.plan-btn{margin-top:auto;border:0;background:var(--gold);color:#111;border-radius:11px;padding:12px 14px;font-weight:950}.muted-btn{background:#252b34;color:#777f8a}.redeem-card{margin-top:14px;padding:18px;display:flex;align-items:center;justify-content:space-between;gap:20px}.redeem-card strong{display:block;margin:6px 0}.redeem-card p{margin:0;color:var(--muted);font-size:12px}.redeem-row{display:flex;gap:8px;min-width:min(440px,100%)}.redeem-row input{width:100%;border:1px solid #38414d;background:#0d1117;color:#fff;border-radius:10px;padding:11px 12px;outline:0}.redeem-row input:focus{border-color:#80672b}.limit-notice{display:none;border:1px solid #725b24;background:#1b160b;color:#efd277;border-radius:11px;padding:11px 13px;font-size:11px;margin:10px 0}.limit-notice.show{display:block}
@media(max-width:900px){.pricing-grid{grid-template-columns:1fr}.redeem-card{align-items:stretch;flex-direction:column}.redeem-row{min-width:0;width:100%}.top-actions{flex-direction:column;align-items:flex-end}}
