.hack{color:var(--color-text-primary,#414155);max-width:100%;overflow-x:clip}.hack-intro h1{font-size:36px;margin:16px 0 8px}.hack-intro p,.hack-card p{line-height:1.55}.hack-notice{background:#e4f2f5;padding:16px 20px;border-radius:16px;margin:24px 0;color:#414155}.hack-roles,.hack-steps,.hack-actions{display:flex;gap:10px;flex-wrap:wrap}.hack-roles{border-bottom:1px solid #e4e4e9;margin-bottom:24px}.hack-roles a{padding:12px 16px;text-decoration:none;color:inherit}.hack-roles a[aria-current]{border-bottom:3px solid #ef7b70;font-weight:700}.hack-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:24px}.hack-nav{display:flex;flex-direction:column;gap:4px;background:#f5f5f7;border-radius:20px;padding:10px;height:max-content}.hack-nav a{padding:12px 14px;text-decoration:none;color:inherit;border-radius:12px}.hack-nav a[aria-current]{background:white;font-weight:700}.hack-card{border:1px solid #eeeef1;border-radius:22px;background:white;padding:26px;margin-bottom:18px;box-shadow:0 6px 24px #41415508}.hack-card h2{font-size:24px;margin:0 0 16px}.hack-card h3{font-size:18px}.hack-hero{background:#f6fbfc}.hack-steps{margin:20px 0}.hack-steps span{background:#f3f3f6;padding:10px 14px;border-radius:12px}.hack-card form label{display:block;font-weight:600;margin:18px 0}.hack-card input:not([type=checkbox]),.hack-card textarea{display:block;width:100%;border:1px solid #d9d9e0;border-radius:12px;padding:12px;margin-top:8px;font:inherit;color:inherit;background:#fff}.hack-card textarea{resize:vertical}.hack-card label.hack-check{display:flex;gap:10px;align-items:baseline;font-weight:400}.hack-error{background:#f9e4e1;color:#8a3730;padding:16px;border-radius:14px;margin-bottom:16px}.hack-score{font-size:40px;font-weight:700}.hack-score small{font-size:16px}.hack-reset{margin:20px 0}.hack-reset button{border:0;background:none;color:#7e7e90;text-decoration:underline;cursor:pointer;font:inherit}.hack-list{display:grid;gap:14px}.hack-catalog-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}.hack-catalog-head h2{margin:0}.hack-show-toggle{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:-8px 0 18px}.hack-show{border-color:#ef7b70}.hack-reset-btn{border:0;background:none;color:#7e7e90;text-decoration:underline;cursor:pointer;font:inherit;padding:0}.hack-badge{font-size:13px;padding:6px 12px;border-radius:999px;background:#f3f3f6;white-space:nowrap}.hack-badge.b-blue{background:#e4f2f5}.hack-badge.b-coral{background:#fbe7e4}.hack-badge.b-gray{background:#f3f3f6}.hack-layout,.hack-content,.hack-card{min-width:0;max-width:100%}.hack-actions button,.hack-card .btn2{max-width:100%;white-space:normal;height:auto}.hack-card input,.hack-card textarea,.hack-card select{box-sizing:border-box;max-width:100%}.hack-table{-webkit-overflow-scrolling:touch}@media(max-width:760px){.hack-table--stack table{min-width:0}.hack-table--stack thead{display:none}.hack-table--stack tr{display:block;padding:10px 0;border-bottom:1px solid #eeeef1}.hack-table--stack td{display:block;border:0;padding:2px 0}.hack-table--stack td[data-label]:before{content:attr(data-label) ": ";color:#858595}.hack-table--stack td:first-child{float:right;padding:0}.hack-layout{display:block}.hack-nav{flex-direction:row;overflow:auto;white-space:nowrap;margin-bottom:18px}.hack-card{padding:20px}.hack-intro h1{font-size:30px}.hack-roles a{padding:12px 8px}}

.hack-card select{display:block;width:100%;border:1px solid #d9d9e0;border-radius:12px;padding:12px;margin-top:8px;font:inherit;color:inherit;background:white}.hack-table{overflow-x:auto;margin:20px 0}.hack-table table{border-collapse:collapse;width:100%;min-width:440px;text-align:left}.hack-table th,.hack-table td{padding:12px 10px;border-bottom:1px solid #eeeef1;vertical-align:top}.hack-table th{font-size:13px;color:#858595}.hack-card li{margin:8px 0}

.hack-stage{border-top:1px solid #eeeef1;padding:16px 0}.hack-stage summary{cursor:pointer;line-height:1.5}.hack-stage form{padding:4px 0 12px}

/* Keep the scenario, rather than the repeated page heading, visible on smaller screens. */
.hack-intro--detail h1 { font-size: clamp(26px, 2.5vw, 32px); line-height: 1.2; text-wrap: balance; margin: 12px 0 8px; }
.hack-intro--detail p { margin: 0; color: #777887; font-size: 14px; }
.hack-intro--detail p a { color: #4b73a7; }
.hack-notice { padding: 12px 16px; margin: 18px 0; font-size: 14px; line-height: 1.45; }
.hack-roles { margin-bottom: 18px; }
.hack-roles a { padding-top: 10px; padding-bottom: 10px; }
.hack-content, .hack-card, .hack-card form { min-width: 0; }
.hack-card input, .hack-card select, .hack-card textarea { box-sizing: border-box; }
.hack-card input[type=checkbox] { accent-color: #4b73a7; flex: 0 0 auto; }
.hack-actions { align-items: flex-start; }
.hack-actions form { max-width: 100%; }
.hack-table input[type=checkbox] { width: 18px; height: 18px; margin: 0; }
.hack-catalog-head h2 { flex: 1 1 240px; min-width: 0; text-wrap: balance; }
.hack-catalog-item p { overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .hack-intro--detail h1 { font-size: 26px; }
  .hack-notice { margin: 14px 0; }
  .hack-nav { max-width: 100%; padding: 6px; }
  .hack-nav a { flex: 0 0 auto; padding: 10px 12px; }
  .hack-roles { gap: 2px; }
  .hack-card { padding: 18px; border-radius: 18px; }
  .hack-card h2 { font-size: 21px; }
  .hack-actions form { flex: 1 1 100%; }
}
@media(max-width:760px){.hack .hack-table--stack table{min-width:0;width:100%%}}.hack-landing .hack-intro{margin-bottom:28px}
.hack-role-line{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 18px;color:#6f6f80;font-size:14px}
.hack-role-line a{color:#3973af;text-decoration:none}

.hack-actions a[aria-current="page"]{font-weight:700;text-decoration:none;color:#2f2f3f}
@media(max-width:760px){.hack-table--stack td[colspan]{float:none!important;text-align:left;padding:10px 0}}
.hack-stagebar{display:flex;gap:16px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:0 0 20px;padding:14px 16px;border:1px solid #e3e3ea;border-radius:12px;background:#fff}
.hack-stagebar__steps{display:flex;gap:8px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.hack-stagebar__step{padding:6px 12px;border-radius:999px;background:#f1f1f5;color:#6f6f80;font-size:14px}
.hack-stagebar__step.is-done{background:#e6f1e9;color:#2f6b43}
.hack-stagebar__step.is-current{background:#2f2f3f;color:#fff}
.hack-stagebar__next form{margin:0}
.hack-tabs{display:flex;gap:16px;flex-wrap:wrap;margin:0 0 16px;border-bottom:1px solid #e3e3ea}
.hack-tabs a{padding:8px 0;color:#6f6f80;text-decoration:none;border-bottom:2px solid transparent}
.hack-tabs a[aria-current="page"]{color:#2f2f3f;font-weight:700;border-bottom-color:#2f2f3f}

.hack-orghead { background: var(--color-bg-surface, #fff); border: 1px solid var(--color-border); border-radius: 20px; padding: 22px; margin: 0 0 20px; box-shadow: var(--shadow-card); }
.hack-orghead__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.hack-orghead__label { margin: 0 0 4px; font-size: 12px; font-weight: 600; color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: .04em; }
.hack-orghead__title { margin: 0; font-size: 22px; font-weight: 600; line-height: 1.3; color: var(--color-text-primary); }
.hack-orghead__back { color: var(--color-accent-link); text-decoration: none; font-size: 14px; white-space: nowrap; }
.hack-orghead__back:hover { text-decoration: underline; }
.hack-orghead__steps { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hack-orghead__step { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 50px; border: 1px solid var(--color-border); font-size: 14px; color: var(--color-text-secondary); background: var(--color-bg-surface, #fff); }
.hack-orghead__num { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--color-bg-athens); font-size: 12px; font-weight: 600; }
.hack-orghead__step.is-done { color: var(--color-text-secondary); }
.hack-orghead__step.is-done .hack-orghead__num { background: var(--color-accent-blue-light); color: var(--color-text-primary); }
.hack-orghead__step.is-current { color: var(--color-text-white); background: var(--color-bg-dark); border-color: var(--color-bg-dark); font-weight: 600; }
.hack-orghead__step.is-current .hack-orghead__num { background: rgba(255,255,255,.2); color: #fff; }
.hack-orghead__done { font-size: 12px; }
.hack-orghead__next { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--color-border); }
.hack-orghead__hint { margin: 0 0 8px; font-size: 12px; font-weight: 600; color: var(--color-text-secondary); }
.hack-orghead__next .btn2, .hack-orghead__next a.btn2 { max-width: 100%; white-space: normal; height: auto; }
.hack-section__current { margin: 0 0 16px; font-size: 20px; font-weight: 600; color: var(--color-text-primary); }
.hack-section__lead { margin: 0 0 14px; color: var(--color-text-secondary); line-height: 1.5; font-size: 14px; }
.hack-hint { margin: 12px 0; font-size: 14px; color: var(--color-text-secondary); line-height: 1.5; }
.hack-seg { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: 50px; background: var(--color-bg-athens); margin: 0 0 14px; }
.hack-seg a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 50px; color: var(--color-text-secondary); text-decoration: none; font-size: 14px; }
.hack-seg a span { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 50px; background: var(--color-bg-snuff); color: var(--color-text-primary); font-size: 12px; font-weight: 600; }
.hack-seg a[aria-current="page"] { background: var(--color-bg-dark); color: #fff; }
.hack-seg a[aria-current="page"] span { background: rgba(255,255,255,.2); color: #fff; }
