html,body{margin:0;padding:0;min-height:100%;}
body{background:#cbdadd;}
.shay-life-wheel {
  --slw-ink:#4c5558;
  --slw-deep:#56686d;
  --slw-muted:#778083;
  --slw-line:rgba(76,85,88,.15);
  --slw-paper:#fdfbf8;
  --slw-cream:#f6f1e9;
  --slw-blue:#c5d7da;

  width:100%;
  margin:0;
  padding:0;
  color:var(--slw-ink);
  font-family:Georgia, "Times New Roman", serif;
  background:
    radial-gradient(circle at 24% 23%, rgba(255,255,255,.58) 0%, rgba(255,255,255,0) 34%),
    linear-gradient(145deg, #e3ddd1 0%, #cfdddf 54%, #bfd4d8 100%);
}

.shay-life-wheel,
.shay-life-wheel * {
  box-sizing:border-box;
}

.shay-life-wheel .slw-page {
  width:min(1500px,100%);
  margin:0 auto;
  padding:0 34px 68px;
}

/* Intro */
.shay-life-wheel .slw-hero {
  max-width:980px;
  padding-top:178px;
  margin:0 0 56px;
}

.shay-life-wheel .slw-eyebrow {
  margin:0 0 12px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:#6f7b7e;
}

.shay-life-wheel .slw-hero h1 {
  margin:0;
  color:#65777b;
  font-family:"Cormorant Garamond", "Bodoni Moda", Georgia, "Times New Roman", serif;
  font-size:clamp(58px,8vw,110px);
  font-weight:500;
  line-height:.92;
  letter-spacing:-.02em;
  text-transform:uppercase;
}

.shay-life-wheel .slw-hero p {
  max-width:720px;
  margin:24px 0 0;
  color:#596568;
  font-size:clamp(17px,1.55vw,21px);
  line-height:1.58;
}

/* Interactive area */
.shay-life-wheel .slw-app-shell {
  display:grid;
  grid-template-columns:minmax(0,1fr) 390px;
  gap:52px;
  align-items:center;
}

.shay-life-wheel .slw-wheel-column {
  min-width:0;
}

.shay-life-wheel .slw-wheel-wrap {
  position:relative;
  width:min(760px,100%);
  aspect-ratio:1;
  margin:0 auto;
}

.shay-life-wheel .slw-outer-ring {
  position:absolute;
  inset:0;
  border-radius:50%;
  background:
    conic-gradient(
      from -20deg,
      #d5deeb 0deg 40deg,
      #eadfcf 40deg 80deg,
      #d9e3d5 80deg 120deg,
      #ecd9d2 120deg 160deg,
      #e4d6cc 160deg 200deg,
      #e6d5d9 200deg 240deg,
      #ddd6e3 240deg 280deg,
      #e4d8dd 280deg 320deg,
      #d8ded6 320deg 360deg
    );
  box-shadow:
    0 0 0 1px rgba(85,99,103,.24),
    inset 0 0 0 1px rgba(255,255,255,.9),
    0 28px 70px rgba(83,100,104,.12);
}

.shay-life-wheel .slw-inner {
  position:absolute;
  inset:9.5%;
  border-radius:50%;
  background:rgba(255,255,255,.66);
  overflow:hidden;
  box-shadow:0 0 0 1px rgba(255,255,255,.92);
}

.shay-life-wheel .slw-inner svg {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.shay-life-wheel .slw-level-circle {
  fill:none;
  stroke:rgba(255,255,255,.72);
  stroke-width:.45;
}

.shay-life-wheel .slw-spoke {
  stroke:rgba(255,255,255,.88);
  stroke-width:.8;
}

.shay-life-wheel .slw-score-polygon {
  fill:rgba(92,107,112,.17);
  stroke:#7d898d;
  stroke-width:1.25;
  vector-effect:non-scaling-stroke;
  transition:all .18s ease;
}

.shay-life-wheel .slw-center-dot {
  fill:#8c9699;
}

.shay-life-wheel .slw-ring-label {
  position:absolute;
  width:138px;
  transform:translate(-50%,-50%);
  text-align:center;
  color:#687477;
  font-family:Arial, Helvetica, sans-serif;
  font-size:11px;
  line-height:1.25;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  cursor:text;
  border-radius:6px;
  padding:3px 5px;
  outline:none;
}

.shay-life-wheel .slw-ring-label:focus {
  background:rgba(255,255,255,.86);
  box-shadow:0 0 0 1px rgba(91,99,102,.22);
}

.shay-life-wheel .slw-score-node {
  position:absolute;
  transform:translate(-50%,-50%);
  width:58px;
  z-index:2;
}

.shay-life-wheel .slw-wheel-score {
  width:58px;
  height:38px;
  padding:0 5px;
  border:1px solid rgba(118,132,136,.34);
  border-radius:9px;
  background:rgba(255,255,255,.94);
  color:#566165;
  font:600 13px Arial, Helvetica, sans-serif;
  text-align:center;
  outline:none;
  box-shadow:0 3px 10px rgba(76,85,88,.05);
}

.shay-life-wheel .slw-wheel-score:focus {
  border-color:#55676c;
  box-shadow:0 0 0 2px rgba(85,103,108,.12);
}

/* Editor panel */
.shay-life-wheel .slw-panel {
  border:1px solid rgba(255,255,255,.72);
  border-radius:24px;
  background:rgba(253,251,248,.92);
  padding:34px 30px 28px;
  box-shadow:0 20px 60px rgba(83,100,104,.10);
  backdrop-filter:blur(8px);
}

.shay-life-wheel .slw-panel h2 {
  margin:0;
  font-size:clamp(48px,5vw,78px);
  font-weight:500;
  line-height:.92;
  color:#637579;
  font-family:"Cormorant Garamond", "Bodoni Moda", Georgia, "Times New Roman", serif;
  text-transform:uppercase;
  letter-spacing:-.02em;
}

.shay-life-wheel .slw-panel-kicker {
  margin:0 0 14px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:9px;
  font-weight:700;
  letter-spacing:.31em;
  color:#7d8587;
  text-transform:uppercase;
}

.shay-life-wheel .slw-panel-copy {
  margin:18px 0 18px;
  color:#70787a;
  font-size:15.5px;
  line-height:1.58;
}

.shay-life-wheel .slw-scale-note {
  display:grid;
  grid-template-columns:auto auto minmax(24px,1fr) auto auto;
  align-items:center;
  gap:7px;
  margin:0 0 22px;
  color:#8a8f90;
  font:600 8px Arial, Helvetica, sans-serif;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.shay-life-wheel .slw-scale-note span:first-child,
.shay-life-wheel .slw-scale-note span:last-child {
  color:#5e6a6d;
  font-size:11px;
}

.shay-life-wheel .slw-scale-line {
  height:1px;
  background:#d7d4ce;
}

.shay-life-wheel .slw-column-headings {
  display:grid;
  grid-template-columns:minmax(0,1fr) 68px;
  gap:9px;
  margin:0 0 7px;
  color:#9a9690;
  font:700 9px Arial, Helvetica, sans-serif;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.shay-life-wheel .slw-column-headings span:last-child {
  text-align:right;
}

.shay-life-wheel .slw-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) 68px;
  gap:9px;
  align-items:center;
  margin-bottom:8px;
}

.shay-life-wheel .slw-category-edit,
.shay-life-wheel .slw-score-edit {
  height:43px;
  border:1px solid #e1ddd7;
  border-radius:9px;
  background:#fff;
  color:#687073;
  outline:none;
  box-shadow:none;
}

.shay-life-wheel .slw-category-edit {
  width:100%;
  padding:0 13px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:15px;
}

.shay-life-wheel .slw-score-edit {
  width:100%;
  padding:0 7px;
  text-align:center;
  font:600 13px Arial, Helvetica, sans-serif;
}

.shay-life-wheel .slw-category-edit:focus,
.shay-life-wheel .slw-score-edit:focus {
  border-color:#95a3a6;
  box-shadow:0 0 0 2px rgba(127,142,147,.10);
}

.shay-life-wheel .slw-row:nth-child(1) .slw-category-edit{border-left:4px solid #d5deeb;padding-left:10px;}
.shay-life-wheel .slw-row:nth-child(2) .slw-category-edit{border-left:4px solid #eadfcf;padding-left:10px;}
.shay-life-wheel .slw-row:nth-child(3) .slw-category-edit{border-left:4px solid #d9e3d5;padding-left:10px;}
.shay-life-wheel .slw-row:nth-child(4) .slw-category-edit{border-left:4px solid #ecd9d2;padding-left:10px;}
.shay-life-wheel .slw-row:nth-child(5) .slw-category-edit{border-left:4px solid #e4d6cc;padding-left:10px;}
.shay-life-wheel .slw-row:nth-child(6) .slw-category-edit{border-left:4px solid #e6d5d9;padding-left:10px;}
.shay-life-wheel .slw-row:nth-child(7) .slw-category-edit{border-left:4px solid #ddd6e3;padding-left:10px;}
.shay-life-wheel .slw-row:nth-child(8) .slw-category-edit{border-left:4px solid #e4d8dd;padding-left:10px;}
.shay-life-wheel .slw-row:nth-child(9) .slw-category-edit{border-left:4px solid #d8ded6;padding-left:10px;}

.shay-life-wheel .slw-panel-actions {
  display:flex;
  gap:8px;
  margin-top:18px;
}

.shay-life-wheel button {
  cursor:pointer;
  font:inherit;
}

.shay-life-wheel .slw-secondary-btn {
  min-height:46px;
  padding:0 14px;
  border:1px solid #c9c5be;
  border-radius:9px;
  background:transparent;
  color:#62696b;
  font-size:13px;
  box-shadow:none;
}

.shay-life-wheel .slw-secondary-btn:hover {
  background:#f3f1ed;
  color:#4c5456;
}

/* Instructions */
.shay-life-wheel .slw-instructions {
  margin:94px 0 0;
  padding:64px 62px 54px;
  border-radius:28px;
  background:rgba(247,243,237,.92);
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 24px 70px rgba(79,96,100,.08);
}

.shay-life-wheel .slw-instructions-intro {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
  column-gap:64px;
  align-items:end;
  padding-bottom:34px;
  border-bottom:1px solid rgba(77,89,92,.13);
}

.shay-life-wheel .slw-instructions-intro .slw-eyebrow {
  grid-column:1 / -1;
}

.shay-life-wheel .slw-instructions h2 {
  margin:0;
  max-width:760px;
  color:#607276;
  font-family:"Cormorant Garamond", "Bodoni Moda", Georgia, "Times New Roman", serif;
  font-size:clamp(42px,5vw,72px);
  font-weight:500;
  line-height:.95;
  letter-spacing:-.02em;
  text-transform:uppercase;
}

.shay-life-wheel .slw-instructions-intro p {
  margin:0;
  color:#6e7779;
  font-size:16px;
  line-height:1.58;
}

.shay-life-wheel .slw-steps {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  margin-top:38px;
}

.shay-life-wheel .slw-step {
  min-height:190px;
  padding:5px 34px 0;
  border-right:1px solid rgba(77,89,92,.13);
}

.shay-life-wheel .slw-step:first-child {
  padding-left:0;
}

.shay-life-wheel .slw-step:last-child {
  padding-right:0;
  border-right:0;
}

.shay-life-wheel .slw-step-number {
  display:block;
  margin-bottom:18px;
  color:#9aa4a6;
  font:600 10px Arial, Helvetica, sans-serif;
  letter-spacing:.20em;
}

.shay-life-wheel .slw-step h3 {
  margin:0 0 10px;
  color:#536367;
  font-family:"Cormorant Garamond", "Bodoni Moda", Georgia, "Times New Roman", serif;
  font-size:31px;
  font-weight:500;
  line-height:.98;
}

.shay-life-wheel .slw-step p {
  margin:0;
  color:#70787a;
  font-size:14.5px;
  line-height:1.58;
}

.shay-life-wheel .slw-reflection {
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:50px;
  margin-top:42px;
  padding:30px 0;
  border-top:1px solid rgba(77,89,92,.13);
  border-bottom:1px solid rgba(77,89,92,.13);
}

.shay-life-wheel .slw-reflection-label {
  margin:0 0 8px;
  color:#617276;
  font:700 10px Arial, Helvetica, sans-serif;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.shay-life-wheel .slw-reflection p {
  margin:0;
  color:#6b7577;
  font-size:16px;
  line-height:1.5;
}

.shay-life-wheel .slw-reflection ul {
  margin:0;
  padding:0;
  list-style:none;
}

.shay-life-wheel .slw-reflection li {
  position:relative;
  margin:0 0 8px;
  padding-left:20px;
  color:#556266;
  font-size:15px;
  line-height:1.5;
}

.shay-life-wheel .slw-reflection li::before {
  content:"";
  position:absolute;
  left:0;
  top:.64em;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#9aabad;
}

.shay-life-wheel .slw-purpose {
  max-width:850px;
  margin:32px 0 0;
  color:#526165;
  font-size:18px;
  line-height:1.55;
}

@media (max-width:1050px) {
  .shay-life-wheel .slw-hero {
    padding-top:140px;
  }

  .shay-life-wheel .slw-app-shell {
    grid-template-columns:1fr;
    gap:48px;
  }

  .shay-life-wheel .slw-panel {
    width:min(760px,100%);
    margin:0 auto;
  }

  .shay-life-wheel .slw-instructions {
    padding:50px 42px 44px;
  }

  .shay-life-wheel .slw-instructions-intro {
    grid-template-columns:1fr;
    gap:18px;
  }
}

@media (max-width:760px) {
  .shay-life-wheel .slw-page {
    padding:0 16px 40px;
  }

  .shay-life-wheel .slw-hero {
    padding-top:100px;
    margin-bottom:38px;
  }

  .shay-life-wheel .slw-hero p {
    margin-top:18px;
    font-size:16px;
  }

  .shay-life-wheel .slw-app-shell {
    gap:38px;
  }

  .shay-life-wheel .slw-ring-label {
    width:84px;
    font-size:8px;
    letter-spacing:.09em;
  }

  .shay-life-wheel .slw-score-node {
    width:46px;
  }

  .shay-life-wheel .slw-wheel-score {
    width:46px;
    height:32px;
    font-size:11px;
  }

  .shay-life-wheel .slw-panel {
    padding:24px 18px 21px;
    border-radius:18px;
  }

  .shay-life-wheel .slw-panel h2 {
    font-size:46px;
  }

  .shay-life-wheel .slw-instructions {
    margin-top:58px;
    padding:38px 22px 34px;
    border-radius:20px;
  }

  .shay-life-wheel .slw-steps {
    grid-template-columns:1fr;
    margin-top:25px;
  }

  .shay-life-wheel .slw-step,
  .shay-life-wheel .slw-step:first-child,
  .shay-life-wheel .slw-step:last-child {
    min-height:0;
    padding:22px 0;
    border-right:0;
    border-bottom:1px solid rgba(77,89,92,.13);
  }

  .shay-life-wheel .slw-step:last-child {
    border-bottom:0;
  }

  .shay-life-wheel .slw-step-number {
    margin-bottom:12px;
  }

  .shay-life-wheel .slw-reflection {
    grid-template-columns:1fr;
    gap:18px;
    margin-top:18px;
  }

  .shay-life-wheel .slw-purpose {
    font-size:16px;
  }
}

@media print {
  .shay-life-wheel {
    background:#fff;
  }

  .shay-life-wheel .slw-hero,
  .shay-life-wheel .slw-panel,
  .shay-life-wheel .slw-instructions {
    display:none !important;
  }

  .shay-life-wheel .slw-app-shell {
    display:block;
  }

  .shay-life-wheel .slw-wheel-wrap {
    width:7.2in;
  }
}