:root {
  color: #172033;
  background: #f4f6f8;
  font-family: "Segoe UI", sans-serif;
  line-height: 1.45;
}

body { margin: 0; }
a { color: #0b5f56; }
.shell { display: grid; grid-template-columns: 240px minmax(0, 1fr); min-height: 100vh; }
aside { background: #102033; color: #f7f4ee; padding: 24px 18px; }
aside a { color: #f7f4ee; display: block; padding: 8px 0; text-decoration: none; }
main { padding: 32px; min-width: 0; }
p, .notice, .card { overflow-wrap: break-word; }
.mark { letter-spacing: 0.12em; text-transform: uppercase; font-size: 12px; margin: 0; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.card, form.card, .notice { background: white; border: 1px solid #d9e0e7; border-radius: 8px; padding: 16px; }
.notice { background: #fff8e8; }
label { display: block; margin: 12px 0 4px; font-weight: 600; }
input, select, textarea { width: min(420px, 100%); padding: 8px; border: 1px solid #c5ced6; border-radius: 6px; }
button { background: #0b5f56; color: white; border: 0; border-radius: 6px; padding: 8px 14px; margin-top: 12px; }
table { width: 100%; border-collapse: collapse; background: white; }
th, td { text-align: left; padding: 8px; border-bottom: 1px solid #e4eaef; }
@media (max-width: 800px) {
  .shell { grid-template-columns: 1fr; }
  aside { padding-bottom: 8px; }
}

.public-shell { min-height: 100vh; background: linear-gradient(180deg, #f7f5f1 0%, #e7eef0 100%); color: #172033; }
.public-bar { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; }
.public-main { width: min(720px, calc(100% - 32px)); margin: 0 auto 48px; padding: 0; }
.verify-qr svg { width: 180px; height: auto; display: block; }
.staff-link { color: #0b5f56; font-weight: 650; }
.verify-hero h1 { font-size: clamp(2rem, 6vw, 3.2rem); line-height: 1.05; margin: 0 0 8px; }
.verify-card, .privacy-card, .result-card { background: white; border-radius: 18px; padding: 20px; box-shadow: 0 12px 40px rgba(16, 32, 51, 0.08); }
.drop-zone { display: grid; gap: 6px; border: 1.5px dashed #8aa8a4; border-radius: 16px; padding: 28px 16px; text-align: center; background: #f6fbfa; cursor: pointer; }
.drop-zone.dragover { background: #e5f5f2; border-color: #0b5f56; }
.drop-zone input { width: auto; margin: 0 auto 8px; }
.drop-title { font-size: 1.15rem; font-weight: 700; }
.drop-hint, .file-name, .verify-status { color: #44515c; }
#verify-button { width: 100%; min-height: 48px; font-size: 1.05rem; border-radius: 12px; }
.domain-warning { background: #fff6df; border-radius: 12px; padding: 12px 14px; }
.result-card { margin-top: 16px; }
.tone-verified { border-top: 8px solid #0e7c4a; }
.tone-rejected { border-top: 8px solid #a33b32; }
.tone-unknown { border-top: 8px solid #5d6b76; }
.privacy-card { margin-top: 16px; }
@media (max-width: 640px) {
  .public-bar { padding: 16px; }
  .verify-card, .privacy-card, .result-card { padding: 16px; }
}