:root{
  --oge-bg:#F6F5F1;
  --oge-surface:#FFFFFF;
  --oge-ink:#1D2420;
  --oge-primary:#BF9F00;
  --oge-primary-light:#A88900;
  --oge-accent:#BF9F00;
  --oge-accent-soft:#F5EFD1;
  --oge-line:#DAD6CC;
  --oge-muted:#6B6558;
  --oge-error:#A3402F;
}

.oge-btn:focus,
.oge-area-card:focus,
.oge-modal-close:focus,
.oge-dropzone:focus{ outline:none; }
.oge-btn:focus-visible,
.oge-area-card:focus-visible,
.oge-modal-close:focus-visible,
.oge-dropzone:focus-visible{ outline:2px solid var(--oge-primary); outline-offset:2px; }

.oge-launcher, .oge-modal-overlay{
  font-family:"Roboto", sans-serif;
}

.oge-launcher{ text-align:center; }
.oge-trigger-btn{ font-size:15px; padding:14px 28px; }

.oge-floating-btn{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:99998;
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:#BF9F00;
  background:var(--oge-accent);
  color:#fff;
  border:none;
  border-radius:999px;
  padding:14px 20px;
  font-family:"Roboto", sans-serif;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(191,159,0,0.4);
  transition:background .15s ease, transform .15s ease;
}
.oge-floating-btn:hover{ background:#997F00; transform:translateY(-1px); }
.oge-floating-btn:focus{ outline:none; }
.oge-floating-btn:focus-visible{ outline:2px solid var(--oge-accent); outline-offset:3px; }
.oge-floating-btn svg{ flex-shrink:0; }

@media (max-width:480px){
  .oge-floating-btn{ right:14px; bottom:14px; padding:12px 16px; font-size:13px; }
  .oge-floating-btn span{ display:inline; }
}

.oge-modal-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(20,20,18,0.55);
  z-index:100000;
  align-items:center;
  justify-content:center;
  padding:24px 16px;
}
.oge-modal-overlay.oge-open{ display:flex; }

.oge-modal{
  position:relative;
  background:var(--oge-bg);
  border-radius:14px;
  max-width:760px;
  width:100%;
  max-height:90vh;
  overflow-y:auto;
  padding:36px 28px 28px;
  box-shadow:0 20px 60px rgba(0,0,0,0.25);
}

.oge-modal-close{
  position:absolute;
  top:14px;
  right:14px;
  width:34px;
  height:34px;
  border-radius:8px;
  border:1px solid var(--oge-line);
  background:var(--oge-surface);
  color:var(--oge-ink);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.oge-modal-close:hover{ border-color:var(--oge-primary); background:var(--oge-accent-soft); }

body.oge-modal-active{ overflow:hidden; }

.oge-widget{
  max-width:720px;
  margin:0 auto;
  padding:8px 0 4px;
  color:var(--oge-ink);
  line-height:1.55;
  box-sizing:border-box;
}
.oge-widget *, .oge-widget *::before, .oge-widget *::after{ box-sizing:inherit; }

.oge-h1{
  font-family:"Roboto", sans-serif;
  font-weight:600;
  font-size:26px;
  line-height:1.25;
  color:var(--oge-primary);
  margin:0 0 8px;
}
.oge-sub{ color:var(--oge-muted); font-size:15px; margin:0 0 22px; max-width:52ch; }

.oge-dropzone{
  border:1.5px dashed var(--oge-line);
  border-radius:12px;
  background:var(--oge-surface);
  padding:36px 20px;
  text-align:center;
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.oge-dropzone.oge-drag{ border-color:var(--oge-accent); background:var(--oge-accent-soft); }
.oge-dropzone svg{ color:var(--oge-primary); margin-bottom:10px; }
.oge-main-txt{ font-size:15px; font-weight:600; }
.oge-sub-txt{ font-size:13px; color:var(--oge-muted); margin-top:4px; }

.oge-preview-wrap{ display:flex; gap:20px; align-items:flex-start; margin-top:4px; flex-wrap:wrap; }
.oge-preview-img{ width:180px; height:180px; object-fit:cover; border-radius:10px; border:1px solid var(--oge-line); flex-shrink:0; }
.oge-preview-side{ flex:1; min-width:220px; display:flex; flex-direction:column; gap:12px; }
.oge-filename{ font-size:13px; color:var(--oge-muted); word-break:break-all; }

.oge-btn{
  font-family:inherit; font-size:14px; font-weight:600;
  padding:11px 20px; border-radius:999px; border:none; cursor:pointer;
  transition:background .15s ease, opacity .15s ease; text-align:center;
}
.oge-btn-primary{ background:var(--oge-primary); color:#fff; }
.oge-btn-primary:hover{ background:var(--oge-primary-light); }
.oge-btn-primary:disabled{ opacity:.5; cursor:not-allowed; }
.oge-btn-ghost{ background:#fff; color:var(--oge-primary); border:1px solid var(--oge-primary); }
.oge-btn-ghost:hover{ background:var(--oge-primary); color:#fff; }

.oge-status-row{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--oge-muted); }
.oge-spinner{
  width:15px; height:15px; border-radius:50%;
  border:2px solid var(--oge-line); border-top-color:var(--oge-primary);
  animation:oge-spin .7s linear infinite;
}
@keyframes oge-spin{ to{ transform:rotate(360deg); } }

.oge-result{ margin-top:36px; padding-top:28px; border-top:1px solid var(--oge-line); animation:oge-fadein .3s ease; }
@keyframes oge-fadein{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:translateY(0); } }
.oge-result-title{ font-family:"Roboto", sans-serif; font-size:20px; color:var(--oge-primary); margin:0 0 18px; font-weight:600; }

.oge-metric-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--oge-line); border:1px solid var(--oge-line); border-radius:10px; overflow:hidden; }
.oge-metric{ background:var(--oge-surface); padding:16px 18px; }
.oge-label{ font-size:12px; color:var(--oge-muted); margin-bottom:6px; }
.oge-value{ font-family:"Roboto", sans-serif; font-size:22px; color:var(--oge-ink); font-weight:600; }
.oge-value.oge-accent{ color:var(--oge-accent); }

.oge-notes{ margin-top:18px; font-size:14px; color:var(--oge-ink); }

.oge-confidence-badge{ display:inline-block; font-size:12px; padding:3px 10px; border-radius:999px; background:var(--oge-accent-soft); color:#665400; }

.oge-warning{
  margin-bottom:18px;
  padding:12px 14px;
  background:#FBF6EC;
  border:1px solid #E6D4A8;
  border-left:3px solid #B8862E;
  border-radius:6px;
  font-size:13px;
  color:#5C4718;
}

.oge-email-row{
  display:flex;
  gap:8px;
  margin-top:14px;
  flex-wrap:wrap;
}
.oge-email-input{
  flex:1;
  min-width:200px;
  padding:11px 14px;
  border:1px solid var(--oge-line);
  border-radius:8px;
  font-family:inherit;
  font-size:14px;
}
.oge-email-input:focus{ outline:2px solid var(--oge-primary); outline-offset:1px; }
#oge-email-status{ margin-top:10px; }

.oge-disclaimer{
  margin-top:22px; padding:14px 16px; background:#FBF9F5;
  border:1px solid var(--oge-line); border-left:3px solid var(--oge-accent);
  border-radius:6px; font-size:13px; color:var(--oge-muted);
}

.oge-error-box{
  margin-top:20px; padding:14px 16px; background:#FBF1EE;
  border:1px solid #E3C3B9; border-radius:8px; color:var(--oge-error); font-size:14px;
}

.oge-reset-row{ margin-top:24px; }

.oge-area-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:4px;
}
.oge-area-card{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:12px;
  text-align:left;
  background:var(--oge-surface);
  border:1px solid var(--oge-line);
  border-radius:14px;
  padding:16px;
  cursor:pointer;
  font-family:inherit;
  transition:border-color .15s ease, background .15s ease, transform .15s ease;
}
.oge-area-card:hover{
  border-color:var(--oge-primary);
  background:var(--oge-accent-soft);
  transform:translateY(-1px);
}
.oge-area-icon{ width:64px; height:64px; object-fit:contain; flex-shrink:0; border-radius:10px; }
.oge-area-text{ display:flex; flex-direction:column; gap:4px; }
.oge-area-title{ font-weight:700; font-size:15px; color:var(--oge-primary); }
.oge-area-desc{ font-size:12px; color:var(--oge-muted); line-height:1.4; }

.oge-back-btn{
  padding:6px 12px;
  font-size:13px;
  margin-bottom:14px;
}
.oge-area-instructions{
  font-size:14px;
  color:var(--oge-ink);
  background:var(--oge-accent-soft);
  border-radius:8px;
  padding:12px 14px;
  margin:0 0 16px;
}

@media (max-width:480px){
  .oge-area-grid{ grid-template-columns:1fr; }
  .oge-preview-wrap{ flex-direction:column; }
  .oge-preview-img{ width:100%; height:200px; }
  .oge-metric-grid{ grid-template-columns:1fr; }
}
