:root {
  color-scheme: dark;
  font-family:
    Inter,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  background: #07111c;
  color: #edf5ff;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background:
    linear-gradient(
      180deg,
      #081522 0%,
      #07111c 100%
    );
}

.shell {
  width: min(1400px, calc(100% - 32px));
  margin: 0 auto;
  padding: 24px 0 60px;
}

.hero,
.panel,
.card {
  border: 1px solid #223447;
  background: #101c28;
  border-radius: 18px;
}

.hero {
  padding: 28px;
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: center;
}

h1,
h2,
p {
  margin-top: 0;
}

h1 {
  font-size: clamp(30px, 4vw, 48px);
  margin-bottom: 8px;
}

h2 {
  margin-bottom: 8px;
}

p,
small {
  color: #9bb1c7;
}

.eyebrow {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  color: #55a8ff;
  margin-bottom: 10px;
}

.status {
  padding: 10px 14px;
  border: 1px solid #2d4359;
  border-radius: 999px;
  font-size: 13px;
}

.status.ok {
  color: #6fe5a3;
}

.status.error {
  color: #ff7e8d;
}

.metrics {
  display: grid;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 14px 0;
}

.card {
  padding: 20px;
}

.card span,
.card small {
  display: block;
}

.card strong {
  display: block;
  font-size: 32px;
  margin: 5px 0;
}

.panel {
  padding: 24px;
  margin-top: 14px;
}

.analyze-form {
  display: flex;
  gap: 10px;
  margin-top: 20px;
}

input,
button {
  min-height: 44px;
  border-radius: 10px;
  border: 1px solid #2b4055;
  font: inherit;
}

input {
  flex: 1;
  padding: 0 14px;
  background: #091522;
  color: #fff;
}

button {
  padding: 0 18px;
  background: #278cff;
  color: white;
  font-weight: 700;
}

button:disabled {
  opacity: .45;
}

.notice {
  margin-top: 15px;
  padding: 12px 14px;
  background: #13263a;
  border-radius: 10px;
  color: #9bb1c7;
  font-size: 13px;
}

.services {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.services span {
  padding: 8px 12px;
  border: 1px solid #294158;
  border-radius: 999px;
  color: #b8cce0;
  font-size: 13px;
}

@media (max-width: 760px) {
  .metrics {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .analyze-form {
    flex-direction: column;
  }
}


.hidden {
  display: none !important;
}


.muted {
  color: #8ea6bd;
}


.access-row {
  display: flex;
  gap: 10px;
  margin-top: 20px;
}


.access-row input {
  max-width: 360px;
}


button.secondary {
  background: #15283a;
  color: #cfe4f8;
}


.result-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
}


.description {
  max-width: 900px;
  margin: 18px 0 0;
}


.badge {
  display: inline-flex;
  padding: 8px 12px;
  border: 1px solid #34526e;
  border-radius: 999px;
  color: #7fc0ff;
  font-weight: 800;
  font-size: 12px;
}


.score-grid {
  display: grid;
  grid-template-columns:
    repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin-top: 22px;
}


.score-card {
  background: #0a1724;
  border: 1px solid #20374c;
  border-radius: 12px;
  padding: 15px;
}


.score-card span {
  display: block;
  color: #8ea6bd;
  font-size: 12px;
}


.score-card strong {
  display: block;
  margin-top: 6px;
  font-size: 26px;
}


.campaign-box {
  display: flex;
  gap: 12px;
  margin-top: 12px;
}


.campaign-box > div {
  flex: 1;
  background: #0a1724;
  border: 1px solid #20374c;
  border-radius: 12px;
  padding: 14px;
}


.campaign-box small,
.campaign-box strong {
  display: block;
}


.campaign-box small {
  color: #7893aa;
  margin-bottom: 4px;
}


.result-columns {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}


.result-columns article,
.pitch-box {
  background: #0a1724;
  border: 1px solid #20374c;
  border-radius: 12px;
  padding: 18px;
}


.result-columns h3,
.pitch-box h3 {
  margin-top: 0;
  font-size: 15px;
}


.result-columns li {
  margin-bottom: 8px;
  color: #bdd0e2;
}


.contact-box {
  line-height: 1.9;
}


.contact-box a {
  color: #69b2ff;
  text-decoration: none;
}


.pitch-box {
  margin-top: 14px;
}


.pitch-box p {
  white-space: pre-line;
  margin-bottom: 0;
}


@media (max-width: 1000px) {

  .score-grid {
    grid-template-columns:
      repeat(3, minmax(0, 1fr));
  }

}


@media (max-width: 760px) {

  .access-row,
  .result-head,
  .campaign-box {
    flex-direction: column;
  }

  .access-row input {
    max-width: none;
    width: 100%;
  }

  .score-grid,
  .result-columns {
    grid-template-columns:
      1fr;
  }

}


.history-wrap {
  margin-top: 18px;
  overflow-x: auto;
}


.history-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 1000px;
}


.history-table th,
.history-table td {
  padding: 13px 12px;
  border-bottom: 1px solid #20374c;
  text-align: left;
  vertical-align: top;
}


.history-table th {
  color: #7893aa;
  font-size: 11px;
  letter-spacing: .05em;
  text-transform: uppercase;
}


.history-table td {
  color: #bdd0e2;
  font-size: 13px;
}


.history-row {
  cursor: pointer;
}


.history-row:hover {
  background: #102235;
}


.history-table small {
  color: #6f879d;
}


/* ======================================================
   ICO DIRECTO · OUTREACH EDITOR
====================================================== */

#financingOutreachPanel input[type="text"],
#financingOutreachPanel input[type="email"],
#financingOutreachPanel select,
#financingOutreachPanel textarea {
    width: 100%;
    box-sizing: border-box;
}

#outreachSubject {
    min-height: 46px;
}

#outreachBody {
    min-height: 360px;
    resize: vertical;
    line-height: 1.6;
    font-family: inherit;
    font-size: 14px;
    white-space: pre-wrap;
}

#outreachEditor > article {
    margin-top: 20px;
}

#outreachEditor h3 {
    margin-bottom: 10px;
}

#financingOutreachPanel .result-columns article {
    min-width: 0;
}

.outreach-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 20px;
}


/* ======================================================
   ICO DIRECTO · FORM CONTROLS REFINEMENT
====================================================== */

#financingOutreachPanel select,
#financingOutreachPanel input[type="text"],
#financingOutreachPanel input[type="email"],
#financingOutreachPanel textarea {
    width: 100%;
    box-sizing: border-box;

    border: 1px solid rgba(120, 170, 220, 0.22);
    border-radius: 10px;

    background: #0b1926;
    color: #eef7ff;

    font: inherit;

    outline: none;

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}


/* INPUTS */

#financingOutreachPanel input[type="text"],
#financingOutreachPanel input[type="email"] {
    min-height: 46px;
    padding: 0 14px;
}


/* SELECTS */

#financingOutreachPanel select {
    min-height: 46px;

    padding:
        0 42px
        0 14px;

    appearance: none;
    -webkit-appearance: none;

    cursor: pointer;

    background-image:
        linear-gradient(
            45deg,
            transparent 50%,
            #75bfff 50%
        ),
        linear-gradient(
            135deg,
            #75bfff 50%,
            transparent 50%
        );

    background-position:
        calc(100% - 18px) 19px,
        calc(100% - 13px) 19px;

    background-size:
        5px 5px,
        5px 5px;

    background-repeat:
        no-repeat;
}


/* TEXTAREA */

#outreachBody {
    min-height: 340px;

    padding: 16px 18px;

    resize: vertical;

    line-height: 1.65;
    letter-spacing: 0.01em;

    font-family:
        Inter,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-size: 14px;

    background:
        linear-gradient(
            180deg,
            rgba(12, 29, 43, 0.98),
            rgba(8, 22, 34, 0.98)
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.025);
}


/* FOCUS */

#financingOutreachPanel select:focus,
#financingOutreachPanel input[type="text"]:focus,
#financingOutreachPanel input[type="email"]:focus,
#financingOutreachPanel textarea:focus {
    border-color: rgba(49, 153, 255, 0.72);

    box-shadow:
        0 0 0 3px rgba(49, 153, 255, 0.10);
}


/* HOVER */

#financingOutreachPanel select:hover,
#financingOutreachPanel input[type="text"]:hover,
#financingOutreachPanel input[type="email"]:hover,
#financingOutreachPanel textarea:hover {
    border-color: rgba(120, 190, 255, 0.38);
}


/* SELECT OPTIONS */

#financingOutreachPanel select option {
    background: #0b1926;
    color: #eef7ff;
}


/* TEXTAREA SCROLLBAR */

#outreachBody::-webkit-scrollbar {
    width: 10px;
}

#outreachBody::-webkit-scrollbar-track {
    background: rgba(255,255,255,0.02);
}

#outreachBody::-webkit-scrollbar-thumb {
    background: rgba(125, 180, 230, 0.22);
    border-radius: 10px;
}

#outreachBody::-webkit-scrollbar-thumb:hover {
    background: rgba(125, 180, 230, 0.36);
}


/* ======================================================
   WORKSPACE TABS
====================================================== */

.workspace-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;

    margin:
        4px
        0
        18px;

    padding: 6px;

    border:
        1px solid
        rgba(115, 175, 225, 0.16);

    border-radius: 16px;

    background:
        rgba(7, 20, 31, 0.74);

    position: sticky;
    top: 10px;

    z-index: 50;

    backdrop-filter:
        blur(14px);

    -webkit-backdrop-filter:
        blur(14px);
}


.workspace-tab {
    min-width: 0;
    min-height: 72px;

    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;

    column-gap: 12px;

    align-items: center;

    padding:
        12px 16px;

    border:
        1px solid transparent;

    border-radius: 11px;

    background:
        transparent;

    color:
        #9eb5c8;

    text-align: left;

    cursor: pointer;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease,
        transform .18s ease;
}


.workspace-tab:hover {
    background:
        rgba(36, 118, 186, 0.08);

    color:
        #e9f6ff;
}


.workspace-tab.active {
    border-color:
        rgba(55, 157, 255, 0.34);

    background:
        linear-gradient(
            135deg,
            rgba(29, 126, 214, 0.18),
            rgba(10, 32, 48, 0.78)
        );

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.035);

    color:
        #f2f9ff;
}


.workspace-tab-kicker {
    grid-row:
        1 / 3;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-width: 74px;

    min-height: 38px;

    padding:
        0 10px;

    border-radius: 8px;

    background:
        rgba(49, 153, 255, 0.10);

    color:
        #66b8ff;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: .12em;
}


.workspace-tab strong {
    font-size: 15px;
    line-height: 1.2;
}


.workspace-tab small {
    margin-top: 2px;

    color:
        #7792a8;

    font-size: 11px;
}


.workspace-view {
    display: block;
}


.workspace-hidden {
    display: none !important;
}


/* Remove excessive first-card spacing inside tabs */

.workspace-view > section:first-child {
    margin-top: 0;
}


/* MOBILE */

@media (max-width: 720px) {

    .workspace-tabs {
        grid-template-columns: 1fr;

        position: static;
    }

    .workspace-tab {
        min-height: 62px;
    }

}
