:root { font: 16px/1.5 system-ui, sans-serif; color: #172334; background: #f5f7fa; }
main { max-width: 680px; margin: 3rem auto; padding: 2rem; background: white; border-radius: 16px; box-shadow: 0 5px 28px #12203314; }
h1 { line-height: 1.2; }
label { display: block; margin-top: 1.5rem; font-weight: 600; }
input { display: block; margin: 0.5rem 0 1rem; width: 100%; box-sizing: border-box; }
button, #download { display: inline-block; background: #175bc5; color: white; padding: 0.8rem 1.2rem; border: 0; border-radius: 8px; cursor: pointer; text-decoration: none; font: inherit; }
button:disabled { background: #9facba; cursor: wait; }
.notice { border-left: 4px solid #2675c4; padding: 0.7rem 1rem; background: #ecf4ff; }
.mode { font-weight: 600; }
.warning { color: #8b2700; background: #fff0e7; padding: 0.6rem; }
.fine { font-size: 0.88rem; color: #4f5b66; margin-top: 2rem; }
#status { white-space: pre-line; }
@media (max-width: 760px) { main { margin: 0.6rem; padding: 1.2rem; } }

select { display: block; margin: .6rem 0; width: 100%; max-width: 32rem; padding: .65rem; }


/* SMILES_SITE_GUIDE_V1: informative additions, no changes to existing controls */
#model-description { margin:.35rem 0 .75rem; }
.smiles-brand { display:flex; align-items:center; gap:.55rem; color:#1a6285; font-weight:800; letter-spacing:.14em; font-size:.82rem; }
.smiles-brand-mark { width:2.1rem; height:2.1rem; border-radius:.65rem; display:grid; place-items:center; font-size:1.1rem; color:#fff; background:linear-gradient(135deg,#207bac,#1752a2); letter-spacing:0; }
.smiles-hero { border-bottom:1px solid #e7edf3; padding-bottom:1rem; margin-bottom:1.15rem; }
.smiles-hero h1 { margin:.8rem 0 .4rem; font-size:clamp(1.55rem,4vw,2rem); }
.smiles-subhead { color:#546474; margin:.2rem 0 .7rem; }
.smiles-model-guide, .smiles-upload-hint, .smiles-privacy, .smiles-licenses {
  border:1px solid #e1eaf1; border-radius:12px; padding:.7rem 1rem; margin:1rem 0;
  background:#fbfcfe;
}
.smiles-model-guide { background:#f3f8fd; }
.smiles-model-guide p { margin:.4rem 0 .55rem; }
.smiles-small { font-size:.87rem; color:#4d6070; line-height:1.5; }
.smiles-upload-lead { color:#183b58; font-weight:650; margin:.35rem 0; }
.smiles-disclosure { margin:.8rem 0 .2rem; }
.smiles-disclosure summary { cursor:pointer; color:#14529b; font-weight:650; padding:.2rem 0; }
.smiles-disclosure summary:hover { text-decoration:underline; }
.smiles-scroll-table { max-width:100%; overflow-x:auto; margin:.75rem 0; }
.smiles-scroll-table table { width:100%; border-collapse:collapse; font-size:.84rem; min-width:380px; }
.smiles-scroll-table th, .smiles-scroll-table td { text-align:left; padding:.4rem .5rem; border-bottom:1px solid #dfe7ee; }
.smiles-scroll-table th { color:#304d64; white-space:nowrap; background:#eaf2f9; }
.smiles-scroll-table tbody tr:nth-child(even) { background:#f4f8fb; }
.smiles-scroll-table th:not(:first-child), .smiles-scroll-table td:nth-child(n+3) { text-align:center; }
.smiles-privacy h2, .smiles-licenses h2 { font-size:1.05rem; margin:.2rem 0 .5rem; }
.smiles-privacy p, .smiles-licenses p { margin:.45rem 0 .65rem; }
.smiles-licenses ul { margin:.3rem 0 .3rem; padding-left:1.3rem; }
.smiles-licenses li { padding:.22rem 0; }
.smiles-licenses a, .smiles-model-guide a { color:#14529b; text-decoration:underline; text-underline-offset:2px; }
@media (max-width:760px) { .smiles-model-guide, .smiles-upload-hint, .smiles-privacy, .smiles-licenses {padding:.7rem; } }

/* SMILES_NATIVE_GRANTS_V1: optional emotion analysis and upload permission */
.smiles-extra-options { padding:.55rem .75rem; margin:.65rem 0; border:1px solid #dce6ed; border-radius:.65rem; background:#f9fbfc; }
.smiles-extra-options .smiles-option { display:flex; align-items:flex-start; gap:.5rem; font-size:.95rem; }
#smiles-upload-token { display:block; width:min(28rem,100%); box-sizing:border-box; margin:.4rem 0; padding:.5rem; }
.smiles-extra-options details { margin-top:.55rem; }