*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:#0b0714;color:#f5f0e8}#stars{position:fixed;inset:0;background:radial-gradient(circle at 25% 20%,#2d1440,#080510 65%);z-index:-1}.star{position:absolute;border-radius:50%;background:white;opacity:.35;animation:twinkle 3s infinite}@keyframes twinkle{50%{opacity:1;transform:scale(1.4)}}.app{height:100vh;max-width:850px;margin:auto;display:flex;flex-direction:column}header,.input-zone{padding:16px 20px;background:#0d0a18cc;border-color:#c9a84c22;border-style:solid;border-width:0 0 1px}.identity,nav,.heading,.status-row,.input-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.identity{justify-content:flex-start}.brand{font-family:Georgia,serif;letter-spacing:4px;color:#e8c97a;font-size:22px}.sub,.status-row,small{color:#aaa;font-size:12px}.orb{width:96px;height:96px;border-radius:50%;display:grid;place-items:center;font-size:40px;background:radial-gradient(circle at 35% 30%,#8a5fd0,#281735);border:2px solid #c9a84c;box-shadow:0 0 35px #9b6dff55}.orb.small{width:46px;height:46px;font-size:20px}.chat-area{flex:1;overflow:auto;padding:22px;display:flex;flex-direction:column;gap:16px}.welcome{margin:auto;text-align:center;max-width:460px;display:grid;place-items:center}.welcome h1{font-family:Georgia,serif;color:#e8c97a;font-weight:400}.msg{display:flex;gap:10px;max-width:86%}.msg.user{align-self:flex-end;flex-direction:row-reverse}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid #c9a84c}.bubble{background:#2d1f3ddd;border:1px solid #9b6dff44;padding:12px 15px;border-radius:16px;line-height:1.55}.user .bubble{background:#52705d44}.speak{background:none;border:0;padding:6px;color:#e8c97a;cursor:pointer}.input-zone{border-width:1px 0 0}textarea,input,select{width:100%;background:#23172f;color:#f5f0e8;border:1px solid #6d4a91;border-radius:10px;padding:11px;font:inherit}#user-input{border-radius:22px;resize:none;max-height:120px}.icon-btn,.button,button{border:0;border-radius:10px;padding:11px 16px;background:#7447b5;color:white;cursor:pointer;text-decoration:none}.icon-btn{width:44px;height:44px;border-radius:50%;padding:0}.icon-btn.active{box-shadow:0 0 0 8px #7a9e8a44}.status-row{margin-top:8px}.admin-body{background:#eee;color:#222;min-height:100vh;padding:30px}.panel{background:white;border-radius:14px;padding:26px;margin:auto;box-shadow:0 8px 30px #0002}.narrow{max-width:480px}.wide{max-width:1050px}.panel nav{border-bottom:1px solid #ddd;padding-bottom:16px}.heading{margin:22px 0}.panel form{display:grid;gap:15px}.panel label{display:grid;gap:6px;font-weight:600}.panel input,.panel select,.panel textarea{background:white;color:#222;border:1px solid #bbb}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.checks{display:flex;flex-wrap:wrap;gap:18px}.checks label{display:flex;align-items:center}.checks input{width:auto}.alert{padding:12px;border-radius:8px;margin:15px 0}.error{background:#ffe4e4;color:#8a1111}.success{background:#e2f7e8;color:#165b2b}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid #ddd}td small{display:block}code{background:#eee;padding:2px 5px}@media(max-width:650px){.grid{grid-template-columns:1fr}.admin-body{padding:10px}.msg{max-width:96%}header{align-items:flex-start}header select{max-width:150px}}
.admin-section{margin-top:28px}.section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:10px}.section-heading h2{margin:0 0 4px}.section-heading p{margin:0;color:#666}.count-badge{display:inline-grid;place-items:center;min-width:34px;height:28px;padding:0 10px;border-radius:999px;background:#eee;font-weight:700}.status-badge{display:inline-block;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:700}.status-public{background:#dcf6e4;color:#165b2b}.status-private{background:#fff3cd;color:#745600}.status-disabled{background:#eee;color:#666}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.actions form{display:inline;margin:0}.small-button{padding:7px 10px;font-size:12px}.small-button.secondary{background:#777}
.header-actions{display:flex;align-items:center;gap:10px}.print-btn{background:#3d2a50;border:1px solid #8a6aac;padding:9px 12px;white-space:nowrap}.structured-reply{min-width:min(560px,70vw)}.reply-field{padding:0 0 10px;margin:0 0 10px;border-bottom:1px solid #ffffff18}.reply-field:last-of-type{border-bottom:0;margin-bottom:0;padding-bottom:0}.reply-label{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:#c9a84c;margin-bottom:4px;font-weight:700}.reply-value{white-space:normal}.reply-field.target .reply-value{font-size:1.06em}.reply-field.pronunciation .reply-value{font-style:italic;color:#eadcae}.reply-field.translation .reply-value{color:#d5d5d5}.reply-field.usage .reply-value{color:#bdd8c8}.reply-field.correction{background:#8b4f451f;border:1px solid #c47a6e55;border-radius:9px;padding:9px;margin-top:4px}.reply-field.correction .reply-label{color:#e4a49a}.reply-field.follow-up .reply-value{font-weight:600}.print-heading{display:none}
@media(max-width:650px){.header-actions{align-items:flex-end;flex-direction:column;gap:6px}.print-btn{font-size:12px;padding:7px 9px}.structured-reply{min-width:0}}
@media print{
  @page{margin:.65in}
  *{box-shadow:none!important;text-shadow:none!important}
  body{background:#fff!important;color:#111!important;font-family:Arial,sans-serif;overflow:visible}
  #stars,header,.input-zone,.avatar,.speak,.welcome{display:none!important}
  .print-heading{display:block;border-bottom:2px solid #222;padding-bottom:12px;margin-bottom:20px;color:#111}
  .print-brand{font-family:Georgia,serif;font-size:20px;font-weight:700;margin-bottom:5px}
  .app{height:auto;max-width:none;margin:0;display:block}
  .chat-area{display:block;overflow:visible;padding:0}
  .msg,.msg.user{display:block;max-width:none;margin:0 0 16px;page-break-inside:avoid}
  .bubble,.user .bubble{background:#fff!important;color:#111!important;border:1px solid #bbb!important;border-radius:8px;padding:11px 13px}
  .msg.user .bubble:before{content:'You';display:block;font-size:10px;letter-spacing:1px;text-transform:uppercase;font-weight:700;color:#555;margin-bottom:5px}
  .msg.assistant .bubble:before{content:'Luna';display:block;font-size:10px;letter-spacing:1px;text-transform:uppercase;font-weight:700;color:#555;margin-bottom:8px}
  .reply-field{border-color:#ddd!important}
  .reply-label,.reply-field.correction .reply-label{color:#555!important}
  .reply-value,.reply-field.pronunciation .reply-value,.reply-field.translation .reply-value,.reply-field.usage .reply-value{color:#111!important}
  .reply-field.correction{background:#fafafa!important;border-color:#ccc!important}
}

/* v5 compact reading scale */
body{font-size:14px}.chat-area{padding:18px;gap:13px}.bubble{font-size:14px;padding:10px 13px;line-height:1.48}.msg{gap:8px}.avatar{width:30px;height:30px;font-size:13px}.brand{font-size:20px}.welcome h1{font-size:28px}.welcome p{font-size:13px;line-height:1.55}.structured-reply{min-width:min(520px,68vw)}.reply-field{padding-bottom:8px;margin-bottom:8px}.reply-field.target .reply-value{font-size:1em}.reply-label{font-size:9px}.input-zone{padding:12px 18px}#user-input{font-size:14px;padding:10px 14px}.icon-btn{width:40px;height:40px}.status-row{font-size:11px}
.typing-bubble{display:flex;gap:5px;align-items:center;min-width:52px}.typing-bubble i{width:6px;height:6px;border-radius:50%;background:#b99ae8;animation:lunaBounce 1.05s infinite ease-in-out}.typing-bubble i:nth-child(2){animation-delay:.14s}.typing-bubble i:nth-child(3){animation-delay:.28s}@keyframes lunaBounce{0%,70%,100%{transform:translateY(0);opacity:.35}35%{transform:translateY(-4px);opacity:1}}
@media(max-width:650px){body{font-size:13px}.chat-area{padding:14px 12px}.bubble{font-size:13.5px}.welcome h1{font-size:25px}}


/* Retryable chat errors */
.error-bubble{border-color:rgba(196,122,110,.45)!important;background:rgba(196,122,110,.10)!important}
.error-text{font-size:.88rem;line-height:1.45}
.support-code{margin-top:6px;font-size:.72rem;opacity:.65;letter-spacing:.04em}
.retry-btn{margin-top:10px;padding:7px 13px;border-radius:999px;border:1px solid rgba(201,168,76,.45);background:rgba(201,168,76,.12);color:inherit;font:inherit;font-size:.78rem;cursor:pointer}
.retry-btn:hover,.retry-btn:focus{background:rgba(201,168,76,.22);border-color:rgba(201,168,76,.8)}
@media print{.error-message{display:none!important}}

/* v7 spacious responsive header */
.app-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  min-height:76px;
  padding:14px 20px;
}
.app-header .identity{min-width:0;flex:0 1 auto}
.brand-copy{min-width:0}
.app-header .orb.small{width:42px;height:42px;font-size:18px;flex:0 0 42px}
.app-header .brand{font-size:18px;line-height:1.05;letter-spacing:5px;white-space:nowrap}
.app-header .sub{margin-top:4px;white-space:nowrap}
.header-actions{display:flex;align-items:flex-end;justify-content:flex-end;gap:10px;flex:1;min-width:0}
.language-control{display:grid;gap:4px;width:min(270px,100%);min-width:190px}
.control-label{font-size:9px;line-height:1;text-transform:uppercase;letter-spacing:1.15px;color:#a99db4;font-weight:700;padding-left:2px}
.app-header select{height:38px;padding:7px 34px 7px 11px;border-radius:12px;font-size:13px}
.print-btn{height:38px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 12px;border-radius:12px;font-size:12px;flex:0 0 auto}

@media(max-width:650px){
  .app-header{display:grid;grid-template-columns:1fr auto;gap:12px 10px;align-items:center;padding:12px 14px}
  .app-header .identity{grid-column:1/2}
  .header-actions{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:9px;width:100%}
  .language-control{width:100%;min-width:0}
  .app-header select{max-width:none;width:100%}
  .print-btn{width:40px;padding:0}
  .print-btn-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
}

@media(max-width:390px){
  .app-header .brand{font-size:17px;letter-spacing:4px}
  .app-header .sub{font-size:10px}
}

/* v7 reliable print cleanup */
@media print{
  html,body{height:auto!important;overflow:visible!important}
  body>#stars,
  body .app>.app-header,
  body .app>.input-zone,
  body .app .avatar,
  body .app .speak,
  body .app .welcome,
  body .app .error-message{display:none!important}
  .print-heading{display:block!important;margin:0 0 16px!important;padding:0 0 10px!important;border-bottom:1.5px solid #222!important}
  .print-meta{display:flex;justify-content:space-between;gap:16px;font-size:10px;color:#444;margin-top:4px}
  .app{min-height:0!important;height:auto!important}
  .chat-area{min-height:0!important;height:auto!important;overflow:visible!important}
  .msg{break-inside:avoid;page-break-inside:avoid}
}

/* v8 language placement and response footer */
.app-header{min-height:64px;padding:10px 18px;align-items:center}
.app-header .print-btn{margin-left:auto}
.composer-tools{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:8px}
.language-control.compact{width:min(260px,65vw);min-width:180px;display:grid;gap:3px}
.language-control.compact select{height:34px;padding:5px 32px 5px 10px;border-radius:10px;font-size:12px}
.composer-status{font-size:10px;color:#a99db4;white-space:nowrap;padding-bottom:8px}
.response-footer{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08)}
.response-footer .speak{margin:0;padding:2px 4px}
.response-language{display:inline-flex;align-items:center;min-height:24px;padding:3px 9px;border-radius:999px;border:1px solid rgba(201,168,76,.28);background:rgba(201,168,76,.08);color:#d9c47c;font-size:10px;letter-spacing:.25px}
@media(max-width:650px){
  .app-header{display:flex;padding:10px 12px;gap:10px}
  .app-header .identity{grid-column:auto}
  .composer-tools{gap:8px}
  .language-control.compact{width:min(240px,72vw);min-width:0}
  .composer-status{padding-bottom:7px}
}
@media(max-width:390px){
  .language-control.compact{width:72vw}
  .composer-status{font-size:9px}
}
@media print{
  .response-footer{display:flex!important;border-top:1px solid #ddd!important;margin-top:8px;padding-top:6px}
  .response-footer .speak{display:none!important}
  .response-language{color:#444!important;background:#fff!important;border-color:#bbb!important;font-size:9px!important}
}

.auto-detect-control{display:flex;align-items:center;gap:7px;font-size:11px;color:rgba(245,240,232,.62);white-space:nowrap}.auto-detect-control input{accent-color:var(--gold);width:14px;height:14px}.response-language{font-size:11px}.composer-tools{gap:12px;flex-wrap:wrap}@media(max-width:600px){.auto-detect-control{width:100%;padding-left:2px}}@media print{.auto-detect-control{display:none!important}}
