
:root {
  
  --ws-primary: #6d3bf5;
  --ws-primary-600: #5a2ae0;
  --ws-primary-100: #efe9ff;
  --ws-blue: #2f7df6;
  --ws-pink: #f0457f;
  --ws-yellow: #f7b928;
  --ws-green: #1fb86a;
  --ws-cyan: #18b5d4;
  --ws-orange: #f5742c;
  --ws-bg: #f6f3ff;
  --ws-surface: #ffffff;
  --ws-surface-2: #faf8ff;
  --ws-border: #e4def5;
  --ws-text: #1d1838;
  --ws-text-muted: #5f5a7a;
  --ws-danger: #d92f4b;
  --ws-focus: #2f7df6;
  --ws-gradient: linear-gradient(135deg, #7a4bff 0%, #5a2ae0 100%);

  
  --ws-font: Inter, "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --ws-fs-xs: .8125rem;
  --ws-fs-sm: .9375rem;
  --ws-fs-md: 1rem;
  --ws-fs-lg: 1.25rem;
  --ws-fs-xl: 1.625rem;
  --ws-fw-medium: 600;
  --ws-fw-bold: 750;

  
  --ws-s1: .25rem; --ws-s2: .5rem; --ws-s3: .75rem; --ws-s4: 1rem;
  --ws-s5: 1.5rem; --ws-s6: 2rem; --ws-s7: 3rem;

  
  --ws-r-sm: 8px; --ws-r-md: 14px; --ws-r-lg: 22px; --ws-r-pill: 999px;
  --ws-shadow-sm: 0 1px 2px rgb(60 30 140 / .08);
  --ws-shadow-md: 0 6px 20px rgb(60 30 140 / .10);
  --ws-shadow-lg: 0 18px 50px rgb(60 30 140 / .16);
  --ws-ring: 0 0 0 3px color-mix(in srgb, var(--ws-focus) 45%, transparent);

  
  --ws-ease: cubic-bezier(.22, .8, .3, 1);
  --ws-dur-fast: 120ms; --ws-dur: 200ms; --ws-dur-slow: 400ms;

  
  --ws-z-sticky: 20; --ws-z-header: 50; --ws-z-dialog: 100; --ws-z-toast: 120;

  
  --ws-bp-sm: 600px; --ws-bp-md: 900px; --ws-bp-lg: 1200px;
}

:root[data-theme="dark"], .won-wheel[data-theme="dark"] {
  --ws-bg: #120e24;
  --ws-surface: #1b1633;
  --ws-surface-2: #231d42;
  --ws-border: #372f63;
  --ws-text: #f1eeff;
  --ws-text-muted: #b3acd6;
  --ws-primary: #9c78ff;
  --ws-primary-600: #8a63ff;
  --ws-primary-100: #2b2150;
  --ws-shadow-md: 0 6px 20px rgb(0 0 0 / .4);
  --ws-shadow-lg: 0 18px 50px rgb(0 0 0 / .55);
}



@media (prefers-contrast: more) {
  :root { --ws-border: #5a4fa0; --ws-text-muted: var(--ws-text); }
}


.home-wheel, .won-wheel { font-family: var(--ws-font); color: var(--ws-text); }
.home-wheel { background: var(--ws-bg); padding: var(--ws-s5) var(--ws-s4); }
.won-wheel {
  max-width: 1240px; margin: 0 auto;
  display: grid; gap: var(--ws-s4);
  grid-template-columns: minmax(0, 1fr);
}
.won-wheel-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--ws-s3); }
.won-wheel-heading h2, .won-wheel-heading h3 { margin: 0; font-size: var(--ws-fs-xl); font-weight: var(--ws-fw-bold); letter-spacing: -.01em; }
.won-privacy, .won-note { color: var(--ws-text-muted); font-size: var(--ws-fs-xs); margin: 0; }

.won-wheel-layout { display: grid; gap: var(--ws-s4); grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 900px) { .won-wheel-layout { grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); } }


.won-stage-panel, .won-editor, .won-history {
  background: var(--ws-surface); border: 1px solid var(--ws-border);
  border-radius: var(--ws-r-lg); box-shadow: var(--ws-shadow-md); padding: var(--ws-s5);
}
.won-stage-panel { position: relative; display: grid; justify-items: center; gap: var(--ws-s3); }


.won-stage { position: relative; width: min(100%, 640px); aspect-ratio: 1; filter: drop-shadow(0 14px 28px rgb(80 40 200 / .22)); }
.won-stage canvas { width: 100%; height: 100%; display: block; border-radius: 50%; }
.won-pointer {
  position: absolute; z-index: 3; top: -6px; left: 50%; width: 38px; height: 44px; transform: translateX(-50%);
  background: var(--ws-gradient); clip-path: polygon(0 0, 100% 0, 50% 100%); filter: drop-shadow(0 3px 4px rgb(0 0 0 / .3));
}
.won-wheel .won-center-spin {
  position: absolute; z-index: 4; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 24%; aspect-ratio: 1; border-radius: 50%; border: 6px solid #fff;
  background: var(--ws-gradient); color: #fff; font: var(--ws-fw-bold) clamp(1rem, 3.2vw, 1.6rem)/1 var(--ws-font);
  letter-spacing: .04em; cursor: pointer; box-shadow: var(--ws-shadow-lg), inset 0 0 0 3px rgb(255 255 255 / .18);
  transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur);
}
.won-wheel .won-center-spin:hover:not(:disabled) { transform: translate(-50%, -50%) scale(1.05); }
.won-wheel .won-center-spin:active:not(:disabled) { transform: translate(-50%, -50%) scale(.97); }
.won-wheel .won-center-spin:disabled { opacity: .6; cursor: not-allowed; }


.won-wheel button, .won-result-dialog button {
  font: var(--ws-fw-medium) var(--ws-fs-sm)/1.2 var(--ws-font); min-height: 44px; padding: 0 var(--ws-s4);
  border-radius: var(--ws-r-md); border: 1px solid var(--ws-border); background: var(--ws-surface); color: var(--ws-text);
  cursor: pointer; transition: background var(--ws-dur-fast), border-color var(--ws-dur-fast), transform var(--ws-dur-fast);
}
.won-wheel button:hover:not(:disabled) { background: var(--ws-primary-100); border-color: var(--ws-primary); }
.won-wheel button:disabled { opacity: .5; cursor: not-allowed; }
.won-wheel .won-spin, .won-wheel form button[type="submit"], .won-result-dialog [data-action="spin-again"], .won-result [data-action="spin-again"] {
  background: var(--ws-gradient); color: #fff; border-color: transparent; box-shadow: var(--ws-shadow-sm);
}
.won-wheel .won-spin { min-width: 220px; min-height: 52px; font-size: var(--ws-fs-md); font-weight: var(--ws-fw-bold); border-radius: var(--ws-r-pill); }
.won-wheel .won-spin:hover:not(:disabled), .won-wheel form button[type="submit"]:hover:not(:disabled) { background: var(--ws-primary-600); color: #fff; }
.won-wheel [data-action="clear"], .won-wheel [data-action="reset"], .won-wheel [data-action="clear-history"] { color: var(--ws-danger); }

.won-wheel input[type="text"], .won-wheel input[type="number"], .won-wheel textarea, .won-wheel select {
  width: 100%; min-height: 44px; padding: var(--ws-s2) var(--ws-s3); font: inherit; color: var(--ws-text);
  background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md);
}
.won-wheel textarea { min-height: 96px; resize: vertical; }
.won-wheel label { display: block; font-size: var(--ws-fs-sm); font-weight: var(--ws-fw-medium); margin: var(--ws-s3) 0 var(--ws-s1); }
.won-wheel .won-option { display: flex; align-items: center; gap: var(--ws-s2); }
.won-wheel .won-option input { width: 20px; height: 20px; accent-color: var(--ws-primary); }
.won-wheel fieldset { border: 0; padding: 0; margin: 0 0 var(--ws-s4); min-width: 0; }
.won-wheel legend { font-size: var(--ws-fs-lg); font-weight: var(--ws-fw-bold); padding: 0; margin-bottom: var(--ws-s2); }
.won-input-action { display: grid; grid-template-columns: 1fr auto; gap: var(--ws-s2); }
.won-actions { display: flex; flex-wrap: wrap; gap: var(--ws-s2); margin: var(--ws-s3) 0; }


.won-entry-list { list-style: none; margin: var(--ws-s3) 0; padding: 0; display: grid; gap: var(--ws-s2); max-height: 360px; overflow: auto; }
.won-entry-list li { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--ws-s2); padding: var(--ws-s2) var(--ws-s3); background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); }
.won-pages { display: flex; align-items: center; justify-content: space-between; gap: var(--ws-s2); }
.won-settings { border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); padding: var(--ws-s3) var(--ws-s4); margin: var(--ws-s3) 0; }
.won-settings summary { cursor: pointer; font-weight: var(--ws-fw-bold); min-height: 44px; display: flex; align-items: center; }


.won-result { text-align: center; padding: var(--ws-s4); border-radius: var(--ws-r-lg); background: var(--ws-primary-100); border: 1px solid var(--ws-primary); width: 100%; }
.won-winner-label { margin: 0; color: var(--ws-text-muted); text-transform: uppercase; letter-spacing: .08em; font-size: var(--ws-fs-xs); }
.won-winner-name { margin: var(--ws-s1) 0 var(--ws-s3); font-size: clamp(1.5rem, 4vw, 2.25rem); color: var(--ws-primary); }
.won-result-dialog { overflow-x: hidden; border: 0; border-radius: var(--ws-r-lg); box-shadow: var(--ws-shadow-lg); padding: var(--ws-s5); max-width: min(92vw, 420px); background: var(--ws-surface); color: var(--ws-text); }
.won-result-dialog::backdrop { background: rgb(20 10 50 / .55); backdrop-filter: blur(3px); }
.won-history ol { margin: var(--ws-s3) 0 0; padding-left: var(--ws-s5); display: grid; gap: var(--ws-s1); }
.won-error { color: var(--ws-danger); }


.won-wheel :focus-visible, .won-result-dialog :focus-visible { outline: none; box-shadow: var(--ws-ring); }
@media (prefers-reduced-motion: reduce) { .won-wheel *, .won-result-dialog * { transition: none !important; animation: none !important; } }
@media (max-width: 899px) {
  .home-wheel { padding: var(--ws-s3); }
  .won-stage-panel, .won-editor, .won-history { padding: var(--ws-s4); border-radius: var(--ws-r-md); }
  .won-spin { position: sticky; bottom: var(--ws-s3); z-index: var(--ws-z-sticky); width: 100%; box-shadow: var(--ws-shadow-lg); }
}


.won-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.won-wheel[data-theme="dark"] { background: var(--ws-bg); color: var(--ws-text); padding: var(--ws-s4); border-radius: var(--ws-r-lg); }


.is-studio .won-stage-panel { grid-template-columns: auto minmax(0, 1fr); align-items: start; column-gap: var(--ws-s4); }
.is-studio .won-stage-panel > *:not(.won-rail) { grid-column: 2; }
.won-rail { grid-column: 1; grid-row: 1 / span 14; display: flex; flex-direction: column; gap: var(--ws-s2); padding: var(--ws-s2); background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); }
.won-wheel .won-rail-btn { min-width: 68px; min-height: 60px; padding: var(--ws-s2); font-size: var(--ws-fs-xs); border-radius: var(--ws-r-md); }


.won-tabs { display: flex; gap: var(--ws-s1); padding: var(--ws-s1); margin-bottom: var(--ws-s4); background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); overflow-x: auto; }
.won-wheel .won-tab { flex: 1 0 auto; border: 0; background: transparent; white-space: nowrap; }
.won-wheel .won-tab[aria-selected="true"] { background: var(--ws-surface); color: var(--ws-primary); box-shadow: var(--ws-shadow-sm); }
.won-tab-count { display: inline-block; min-width: 1.6em; padding: 0 .45em; border-radius: var(--ws-r-pill); background: var(--ws-primary); color: #fff; font-size: var(--ws-fs-xs); line-height: 1.7; text-align: center; }
.won-panel[hidden] { display: none; }
.won-h { margin: 0 0 var(--ws-s3); font-size: var(--ws-fs-lg); }
.won-sub { margin: var(--ws-s3) 0 var(--ws-s2); font-weight: var(--ws-fw-bold); }


.won-toolbar { display: flex; flex-wrap: wrap; gap: var(--ws-s2); margin: var(--ws-s2) 0; }
.won-wheel .won-toolbar button { min-height: 40px; padding: 0 var(--ws-s3); }
.won-wheel .won-toolbar button[hidden] { display: none; }
.won-dup { padding: var(--ws-s2) var(--ws-s3); border-radius: var(--ws-r-md); background: color-mix(in srgb, var(--ws-yellow) 22%, var(--ws-surface)); color: var(--ws-text); }
.won-warn { margin: 0 0 var(--ws-s3); padding: var(--ws-s2) var(--ws-s3); border-radius: var(--ws-r-md); background: color-mix(in srgb, var(--ws-yellow) 22%, var(--ws-surface)); font-size: var(--ws-fs-xs); color: var(--ws-text); }
.won-bulk textarea { width: 100%; }
.won-search-input { margin: var(--ws-s2) 0; }


.is-studio .won-entry-row { display: flex; align-items: center; gap: var(--ws-s2); }
.is-studio .won-entry-row input[type="text"] { flex: 1 1 auto; min-width: 0; }
.won-weight { margin: 0 !important; }
.won-wheel .won-weight-input { width: 78px; min-height: 40px; padding: 0 var(--ws-s2); }
.won-chance { min-width: 3.6em; text-align: right; font-variant-numeric: tabular-nums; font-weight: var(--ws-fw-bold); color: var(--ws-primary); }
.is-weighted .won-entry-row.is-excluded .won-chance { color: var(--ws-text-muted); }


.won-swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(56px, 1fr)); gap: var(--ws-s3); margin-bottom: var(--ws-s3); }
.won-wheel .won-swatch { width: 52px; height: 52px; min-height: 52px; padding: 0; border-radius: 50%; border: 3px solid var(--ws-surface); box-shadow: 0 0 0 1px var(--ws-border); }
.won-wheel .won-swatch[aria-checked="true"] { box-shadow: 0 0 0 3px var(--ws-primary); }


.won-tally-table { width: 100%; border-collapse: collapse; margin-bottom: var(--ws-s3); }
.won-tally-table th, .won-tally-table td { padding: var(--ws-s2); border-bottom: 1px solid var(--ws-border); text-align: left; }
.won-tally-table td:last-child, .won-tally-table th:last-child { text-align: right; width: 5em; }


.won-studio-cards { display: grid; gap: var(--ws-s4); grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); align-items: start; }
.won-card { background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); box-shadow: var(--ws-shadow-md); padding: var(--ws-s5); min-width: 0; }
.won-card h3, .won-studio-cards .won-history h3 { margin: 0 0 var(--ws-s3); font-size: var(--ws-fs-lg); }
.won-card textarea { width: 100%; font: .8125rem/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.won-lib-list { list-style: none; margin: var(--ws-s3) 0; padding: 0; display: grid; gap: var(--ws-s2); max-height: 320px; overflow: auto; }
.won-lib-item { display: grid; gap: var(--ws-s1); padding: var(--ws-s2) var(--ws-s3); background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); }
.won-lib-title { font-weight: var(--ws-fw-bold); overflow-wrap: anywhere; }
.won-lib-actions { display: flex; flex-wrap: wrap; gap: var(--ws-s1); }
.won-wheel .won-lib-actions button { min-height: 36px; padding: 0 var(--ws-s2); font-size: var(--ws-fs-xs); }
.won-banner { padding: var(--ws-s4); border: 2px solid var(--ws-primary); border-radius: var(--ws-r-md); background: var(--ws-primary-100); }


.won-wheel.is-high-contrast { --ws-border: #000; --ws-text: #000; --ws-text-muted: #1a1a1a; --ws-primary: #3b13b8; }
.won-wheel.is-high-contrast[data-theme="dark"] { --ws-border: #fff; --ws-text: #fff; --ws-text-muted: #f0f0f0; --ws-primary: #cdbbff; }
.won-wheel.is-high-contrast button, .won-wheel.is-high-contrast input, .won-wheel.is-high-contrast select, .won-wheel.is-high-contrast textarea { border-width: 2px; }


.won-wheel:fullscreen { overflow: auto; background: var(--ws-bg); padding: var(--ws-s5); }
.won-wheel:fullscreen .won-editor, .won-wheel:fullscreen .won-studio-cards, .won-wheel:fullscreen .won-rail { display: none; }
.won-wheel:fullscreen .won-wheel-layout, .won-wheel:fullscreen .is-studio .won-stage-panel { grid-template-columns: 1fr; }
.won-wheel:fullscreen .won-stage { width: min(78vh, 92vw); }


html.won-embed [data-won-hidden] { display: none !important; }
html.won-embed .won-studio-cards, html.won-embed .won-rail, html.won-embed .won-privacy { display: none; }
html.won-obs, html.won-obs body, html.won-obs .home-wheel { background: transparent !important; }
html.won-obs .won-editor, html.won-obs .won-wheel-heading, html.won-obs .won-note { display: none; }

@media (max-width: 899px) {
  .is-studio .won-stage-panel { grid-template-columns: minmax(0, 1fr); }
  .is-studio .won-stage-panel > * { grid-column: 1 !important; }
  .won-rail { order: 10; grid-row: auto; flex-direction: row; flex-wrap: wrap; justify-content: center; }
  .won-wheel .won-rail-btn { min-width: 64px; }
  .won-wheel .won-tab { flex: 1 1 auto; }
}
@media print { .won-rail, .won-tabs, .won-studio-cards .won-card:not(.won-history) { display: none; } }



.is-studio .won-wheel-layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "stage" "editor" "quick" "side"; }
.is-studio .won-stage-panel { grid-area: stage; }
.is-studio .won-editor { grid-area: editor; }
.is-studio .won-qa { grid-area: quick; }
.is-studio .won-side-cards { grid-area: side; display: grid; gap: var(--ws-s4); grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); align-items: start; }
@media (min-width: 900px) {
  .is-studio .won-wheel-layout { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); grid-template-areas: "stage editor" "stage side" "quick quick"; }
  .is-studio .won-qa-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
}
@media (min-width: 1200px) {
  .is-studio .won-wheel-layout { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) 232px; grid-template-areas: "stage editor quick" "stage side side"; }
  .is-studio .won-qa-list { display: grid; grid-template-columns: 1fr; }
}
.won-qa-list { display: grid; gap: var(--ws-s2); }
.won-wheel .won-qa-btn { display: flex; align-items: center; gap: var(--ws-s3); justify-content: flex-start; width: 100%; text-align: left; }
.won-ico { display: inline-grid; place-items: center; width: 1.6em; height: 1.6em; border-radius: var(--ws-r-sm); background: var(--ws-primary-100); color: var(--ws-primary); font-size: 1rem; line-height: 1; flex: none; }


.won-bar { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; gap: var(--ws-s2); width: 100%; padding: var(--ws-s2); background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); }
.won-wheel .won-bar-btn, .won-wheel .won-bar .won-bar-spin { flex: 1 1 88px; flex-direction: column; display: flex; align-items: center; justify-content: center; gap: var(--ws-s1); min-height: 64px; padding: var(--ws-s2); font-size: var(--ws-fs-xs); }
.won-wheel .won-bar .won-bar-spin { min-width: 0; border-radius: var(--ws-r-md); background: var(--ws-primary-100); color: var(--ws-primary); border: 1px solid var(--ws-primary); box-shadow: none; font-size: var(--ws-fs-sm); }
.won-wheel .won-bar .won-bar-spin::before { content: "◉"; font-size: 1.3rem; line-height: 1; }
.won-wheel .won-bar .won-bar-spin:hover:not(:disabled) { background: var(--ws-primary); color: #fff; }
.won-bar-auto { align-self: center; padding: 0 var(--ws-s3); }


.won-switch { display: flex !important; align-items: center; justify-content: space-between; gap: var(--ws-s3); margin: var(--ws-s2) 0 !important; cursor: pointer; }
.won-switch input[role="switch"] { appearance: none; -webkit-appearance: none; position: relative; width: 46px; height: 26px; margin: 0; flex: none; border-radius: var(--ws-r-pill); background: var(--ws-border); cursor: pointer; transition: background var(--ws-dur-fast); }
.won-switch input[role="switch"]::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: var(--ws-shadow-sm); transition: transform var(--ws-dur-fast); }
.won-switch input[role="switch"]:checked { background: var(--ws-primary); }
.won-switch input[role="switch"]:checked::after { transform: translateX(20px); }
.won-switch input[role="switch"]:focus-visible { outline: none; box-shadow: var(--ws-ring); }
.won-field-row { display: grid; grid-template-columns: 1fr 1.2fr; align-items: center; gap: var(--ws-s2); margin: var(--ws-s2) 0; }
.won-field-row label { margin: 0 !important; }
.won-wheel input[type="search"] { width: 100%; min-height: 44px; padding: var(--ws-s2) var(--ws-s3); font: inherit; color: var(--ws-text); background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); }


.site-header { background: var(--ws-surface, #fff); border-bottom: 1px solid var(--ws-border, #e4def5); box-shadow: 0 4px 20px rgb(60 30 140 / .07); }
.site-header .header-inner { max-width: 1240px; }
.site-header .nav-list a, .site-header .tools-disclosure > summary { border-radius: var(--ws-r-pill, 999px); padding: .55rem 1rem; color: var(--ws-text, #1d1838); text-decoration: none; transition: background var(--ws-dur-fast, .12s); }
.site-header .nav-list a:hover, .site-header .tools-disclosure > summary:hover, .site-header .tools-disclosure[open] > summary { background: var(--ws-primary-100, #efe9ff); color: var(--ws-primary, #6d3bf5); }
.site-header .nav-list .current-menu-item > a, .site-header .nav-list .current_page_item > a, .site-header .nav-list a[aria-current="page"] { background: var(--ws-primary-100, #efe9ff); color: var(--ws-primary, #6d3bf5); }
.site-header .header-cta, .site-header .header-cta.button { background: var(--ws-gradient, #6d3bf5); color: #fff; border: 0; border-radius: var(--ws-r-md, 14px); padding: .7rem 1.4rem; font-weight: 700; box-shadow: var(--ws-shadow-md); text-decoration: none; }
.site-header .header-cta:hover { filter: brightness(1.08); }
.site-header .tools-dropdown { border-radius: var(--ws-r-md, 14px); border: 1px solid var(--ws-border, #e4def5); box-shadow: var(--ws-shadow-lg, 0 18px 50px rgb(60 30 140 / .16)); }
.won-theme-toggle { display: inline-flex; padding: 3px; border-radius: var(--ws-r-pill, 999px); border: 1px solid var(--ws-border, #e4def5); background: var(--ws-surface-2, #faf8ff); }
.won-theme-toggle button { min-width: 38px; min-height: 36px; padding: 0 .6rem; border: 0; border-radius: var(--ws-r-pill, 999px); background: transparent; color: var(--ws-text-muted, #5f5a7a); cursor: pointer; font-size: 1.05rem; line-height: 1; }
.won-theme-toggle button[aria-pressed="true"] { background: var(--ws-primary, #6d3bf5); color: #fff; }
.won-theme-toggle button:focus-visible { outline: none; box-shadow: var(--ws-ring); }


.won-tool-chips { max-width: 1240px; margin: var(--ws-s3, .75rem) auto; padding: 0 var(--ws-s4, 1rem); }
.won-tool-chips ul { display: flex; gap: var(--ws-s2, .5rem); margin: 0; padding: 0 0 var(--ws-s1, .25rem); list-style: none; overflow-x: auto; scrollbar-width: thin; }
.won-chip { display: inline-flex; align-items: center; gap: .55rem; white-space: nowrap; padding: .45rem 1rem .45rem .5rem; border-radius: var(--ws-r-pill, 999px); background: var(--ws-surface, #fff); border: 1px solid var(--ws-border, #e4def5); color: var(--ws-text, #1d1838); font: 600 var(--ws-fs-sm, .9375rem)/1.2 var(--ws-font, system-ui); text-decoration: none; box-shadow: var(--ws-shadow-sm); min-height: 44px; }
.won-chip:hover { border-color: var(--ws-primary, #6d3bf5); color: var(--ws-primary, #6d3bf5); }
.won-chip.is-current { border-color: var(--ws-primary, #6d3bf5); box-shadow: 0 0 0 2px var(--ws-primary-100, #efe9ff), var(--ws-shadow-sm); color: var(--ws-primary, #6d3bf5); }
.won-chip-icon { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--ws-primary-100, #efe9ff); font-size: 1rem; line-height: 1; }
.won-chip:focus-visible { outline: none; box-shadow: var(--ws-ring); }


.won-homepage .home-hero { max-width: 1240px; margin: 0 auto; padding: var(--ws-s3, .75rem) var(--ws-s4, 1rem); display: flex; flex-wrap: wrap; align-items: center; gap: var(--ws-s2) var(--ws-s5); text-align: left; }
.won-homepage .home-hero h1 { margin: 0; font-size: clamp(1.15rem, 2.4vw, 1.6rem); line-height: 1.2; flex: 1 1 22rem; }
.won-homepage .home-hero .hero-intro { margin: 0; flex: 2 1 28rem; font-size: var(--ws-fs-sm, .9375rem); color: var(--ws-text-muted, #5f5a7a); }
.won-homepage .home-hero .hero-actions { margin: 0; }

.won-wheel .won-tab { flex: 1 1 0; padding: 0 .5rem; font-size: var(--ws-fs-sm); min-width: 0; }


@media (max-width: 520px) {
  .is-studio .won-entry-row.has-weight { flex-wrap: wrap; row-gap: .4rem; }
  .is-studio .won-entry-row.has-weight input[type="text"] { flex: 1 1 7rem; min-width: 7rem; }
  .is-studio .won-entry-row.has-weight .won-weight { margin-left: auto !important; }
}




html:has(.is-studio) body { background: linear-gradient(#f7f4ff 0, #fff 520px); }
.is-studio.won-wheel, .won-tool-chips { width: min(calc(100vw - 3rem), 1560px); max-width: none; margin-inline: calc(50% - min(50vw - 1.5rem, 780px)); }
.is-studio.won-wheel { padding: 0; background: none; }
.home-wheel:has(.is-studio) { padding: 0; background: none; }
.won-homepage { display: flex; flex-direction: column; }
.won-homepage > .won-tool-chips { order: -2; }
.won-homepage > .home-wheel { order: -1; }
.won-homepage .home-hero { margin-top: var(--ws-s6); padding-block: var(--ws-s5) var(--ws-s4); justify-content: center; text-align: center; }
.is-studio .won-wheel-heading, .is-studio .won-privacy { display: none; } 
.is-studio .won-privacy { display: block; position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.site-main:has(.is-studio) { padding-block: var(--ws-s4); }


.site-header { position: sticky; top: 0; z-index: var(--ws-z-header); }
.site-header .header-inner.container { width: min(calc(100% - 3rem), 1560px); max-width: none; padding-block: .55rem; gap: var(--ws-s5); }
.site-header .site-brand { max-width: 18rem; }
.site-header .custom-logo { max-height: 46px; width: auto; }
#primary-navigation { display: flex; align-items: center; gap: .25rem; flex: 1 1 auto; }
.site-header .nav-list { display: flex; align-items: center; gap: .25rem; margin: 0; padding: 0; list-style: none; }
.site-header .won-home-pill, .site-header .nav-list a, .site-header .tools-disclosure > summary { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; font-weight: 650; }
.site-header .won-home-pill { padding: .55rem 1rem; border-radius: var(--ws-r-pill); color: var(--ws-text); text-decoration: none; }
.site-header .won-home-pill:hover { background: var(--ws-primary-100); color: var(--ws-primary); }
.site-header .won-home-pill[aria-current="page"] { background: var(--ws-primary-100); color: var(--ws-primary); }
.won-nav-ico { display: inline-grid; place-items: center; font-size: 1.05rem; color: var(--ws-primary); line-height: 1; }
.site-header .tools-disclosure > summary::after { content: ""; }
.site-header .tools-disclosure { position: relative; }
.won-btn-outline { display: inline-flex; align-items: center; min-height: 44px; padding: .6rem 1.3rem; border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); background: var(--ws-surface); color: var(--ws-text); font-weight: 700; text-decoration: none; }
.won-btn-outline:hover { border-color: var(--ws-primary); color: var(--ws-primary); }
.site-header .header-cta { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 48rem) { .won-btn-outline { display: none; } }


.won-tool-chips { margin-block: var(--ws-s4); padding: 0; }
.won-tool-chips ul { gap: var(--ws-s3); padding: var(--ws-s1) 2px var(--ws-s2); }
.won-chip { padding: .5rem 1.15rem .5rem .55rem; font-size: var(--ws-fs-md); }
.won-chip-icon { width: 36px; height: 36px; font-size: 1.15rem; }


.is-studio .won-wheel-layout { gap: var(--ws-s4); }
@media (min-width: 1200px) {
  .is-studio .won-wheel-layout { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr) 232px; }
  .won-bar { flex-wrap: nowrap; }
}
.is-studio .won-stage-panel, .is-studio .won-editor, .won-card, .won-studio-cards .won-history { border-radius: var(--ws-r-lg); box-shadow: 0 8px 30px rgb(80 50 170 / .08); }
.is-studio .won-stage-panel { padding: var(--ws-s5); }
.is-studio .won-stage { width: min(100%, 640px); container-type: inline-size; }
.is-studio .won-stage canvas { filter: drop-shadow(0 12px 22px rgb(90 50 200 / .22)); }


.won-rail { background: var(--ws-surface); box-shadow: var(--ws-shadow-sm); }
.won-wheel .won-rail-btn { border: 0; background: transparent; gap: 4px; min-width: 64px; }
.won-rail .won-ico { width: 44px; height: 44px; border-radius: var(--ws-r-md); background: var(--ws-surface); border: 1px solid var(--ws-border); font-size: 1.25rem; }
.won-rail-btn:hover .won-ico { background: var(--ws-primary-100); border-color: var(--ws-primary); }


.is-studio .won-wheel .won-center-spin, .won-wheel .won-center-spin { display: grid; place-items: center; align-content: center; gap: .1em; width: 25%; font-size: clamp(.85rem, 5cqw, 2.1rem); letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; border-width: 7px; box-shadow: 0 10px 30px rgb(90 40 220 / .45), inset 0 6px 14px rgb(255 255 255 / .28), inset 0 -8px 14px rgb(40 10 130 / .35); }
.won-wheel .won-center-spin::after { content: "▶"; font-size: .55em; line-height: 1; }
.won-wheel.is-spinning .won-center-spin::after { content: ""; }


.won-bar { padding: var(--ws-s2) var(--ws-s3); background: var(--ws-surface); gap: 0; box-shadow: var(--ws-shadow-sm); }
.won-wheel .won-bar .won-bar-btn, .won-wheel .won-bar .won-bar-spin { border: 0; border-radius: 0; background: transparent; box-shadow: none; flex: 1 1 0; }
.won-wheel .won-bar .won-bar-btn + .won-bar-btn, .won-wheel .won-bar .won-bar-spin + .won-bar-btn { border-left: 1px solid var(--ws-border); }
.won-wheel .won-bar .won-bar-spin { background: var(--ws-primary-100); border-radius: var(--ws-r-md); color: var(--ws-primary); }
.won-wheel .won-bar .won-bar-btn .won-ico { background: transparent; font-size: 1.35rem; }
.won-bar-auto { flex: 0 0 auto; padding-left: var(--ws-s4); border-left: 1px solid var(--ws-border); }


.is-studio .won-entry-list { gap: var(--ws-s2); max-height: 370px; }
.is-studio .won-entry-row { display: flex; align-items: center; gap: .6rem; padding: .35rem .6rem .35rem .3rem; border-radius: var(--ws-r-md); background: var(--ws-surface); border: 1px solid var(--ws-border); }
.won-wheel .won-handle { min-width: 26px; min-height: 36px; padding: 0; border: 0; background: transparent; color: var(--ws-text-muted); cursor: grab; letter-spacing: -2px; font-size: 1.1rem; }
.won-wheel .won-handle:active { cursor: grabbing; }
.won-dot { width: 26px; height: 26px; border-radius: 50%; flex: none; background: var(--ws-border); box-shadow: inset 0 0 0 2px rgb(255 255 255 / .55); }
.won-check input { width: 18px; height: 18px; accent-color: var(--ws-primary); }
.is-studio .won-entry-row button[data-action="delete"] { font-size: 0; width: 40px; min-width: 40px; padding: 0; border-color: transparent; background: transparent; color: var(--ws-danger); }
.is-studio .won-entry-row button[data-action="delete"]::before { content: "🗑"; font-size: 1.05rem; }
.won-entry-row.is-dragging { opacity: .45; }
.won-entry-row.is-over { outline: 2px dashed var(--ws-primary); outline-offset: 2px; }
.is-studio .won-entry-row.is-excluded { opacity: .55; }
.won-paste { margin: var(--ws-s3) 0; padding: var(--ws-s2) var(--ws-s3); border: 1px dashed var(--ws-border); border-radius: var(--ws-r-md); }
.won-paste summary { cursor: pointer; font-weight: var(--ws-fw-bold); min-height: 40px; display: flex; align-items: center; }
.won-wheel [data-form="add"] label { display: none; }
.won-wheel [data-form="add"] input[type="text"] { min-height: 48px; }
.won-wheel .won-input-action button[type="submit"] { min-width: 96px; min-height: 48px; }
.is-studio .won-wheel legend, .is-studio legend { font-size: var(--ws-fs-xl); }


.won-card h3, .won-studio-cards .won-history h3 { display: flex; align-items: center; gap: .5rem; }
@media (min-width: 1200px) { .won-studio-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.won-studio-cards .won-history ol { list-style: none; margin: var(--ws-s3) 0 0; padding: 0; counter-reset: n; display: block; }
.won-studio-cards .won-history li { counter-increment: n; display: flex; align-items: center; gap: .7rem; padding: .5rem 0; border-bottom: 1px solid var(--ws-border); }
.won-studio-cards .won-history li::before { content: counter(n); flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--ws-primary-100); color: var(--ws-primary); font-weight: 700; font-size: var(--ws-fs-xs); }
.won-studio-cards .won-history li:only-child:not(:has(time))::before { content: none; }
.won-studio-cards .won-history li span { flex: 1; font-weight: 600; }
.won-studio-cards .won-history li time { color: var(--ws-text-muted); font-size: var(--ws-fs-xs); }
.won-lib-list { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 380px; }
.won-lib-item { justify-items: center; text-align: center; padding: var(--ws-s3); }
.won-thumb { position: relative; width: 68px; height: 68px; border-radius: 50%; box-shadow: 0 0 0 3px #fff, 0 0 0 4px var(--ws-border); }
.won-thumb::after { content: ""; position: absolute; inset: 38%; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px rgb(0 0 0 / .06); }
.won-lib-actions { justify-content: center; }
.won-side-cards .won-card { padding: var(--ws-s4); }
.won-swatches { grid-template-columns: repeat(4, 1fr); justify-items: center; }
.won-wheel .won-swatch { width: 54px; height: 54px; min-height: 54px; }
.won-qa h3 { font-size: var(--ws-fs-lg); }
.won-qa-btn { min-height: 52px; font-weight: 650; }
.won-qa-btn .won-ico { background: transparent; font-size: 1.25rem; }


.won-result-dialog { border-radius: var(--ws-r-lg); }
@media (prefers-reduced-motion: no-preference) { .won-wheel .won-center-spin { transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur); } .won-chip, .won-rail-btn .won-ico, .won-card { transition: border-color var(--ws-dur-fast), background var(--ws-dur-fast), transform var(--ws-dur-fast); } .won-chip:hover { transform: translateY(-1px); } }


.won-ico svg, .won-nav-ico svg { width: 1.15em; height: 1.15em; display: block; }
.won-rail .won-ico { font-size: 1.15rem; }
.won-wheel .won-bar .won-bar-btn .won-ico, .won-wheel .won-bar .won-bar-spin .won-ico { font-size: 1.25rem; }
.won-wheel .won-bar .won-bar-btn, .won-wheel .won-bar .won-bar-spin { padding: var(--ws-s2) var(--ws-s1); font-size: .72rem; white-space: nowrap; min-width: 0; }
.won-wheel .won-bar .won-bar-spin::before { content: none; }
.is-studio .won-entry-row button[data-action="delete"]::before { content: ""; width: 1.1rem; height: 1.1rem; display: block; margin: auto; background: currentColor; -webkit-mask: var(--ws-trash) center / contain no-repeat; mask: var(--ws-trash) center / contain no-repeat; }
:root { --ws-trash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6M10 11v6M14 11v6M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2'/%3E%3C/svg%3E"); }


html:has(.is-studio) { overflow-x: clip; }
.is-studio .won-stage-panel { padding: var(--ws-s4); column-gap: var(--ws-s3); }
.won-rail { width: 72px; padding: var(--ws-s1); align-self: start; }
.won-wheel .won-rail-btn { min-width: 0; width: 100%; padding: var(--ws-s1); }
@media (min-width: 1200px) {
  .is-studio .won-wheel-layout { grid-template-columns: minmax(0, 1.28fr) minmax(0, 1fr) 200px; }
}


.won-switch input[role="switch"] { height: 26px; min-height: 26px; padding: 0; border: 0; }
.won-swatches { grid-template-columns: repeat(4, 1fr); gap: var(--ws-s2); }
.won-wheel .won-swatch { width: 42px; height: 42px; min-height: 42px; }
.won-field-row { grid-template-columns: 1fr; gap: var(--ws-s1); }
.won-side-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1199px) { .won-side-cards { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } }


.won-homepage > .won-tool-chips { order: -3 !important; }
.won-homepage > .home-wheel { order: -2 !important; }
.won-homepage > .home-hero { order: 2 !important; display: block !important; position: static !important; height: auto !important; width: min(100%, 65rem); margin: var(--ws-s6) auto 0 !important; padding: var(--ws-s5) 0 var(--ws-s4) !important; opacity: 1 !important; transform: none !important; text-align: center; }
.won-homepage > .home-hero h1 { font-size: clamp(1.8rem, 3.4vw, 2.8rem); max-width: 23ch; margin: 0 auto var(--ws-s3); line-height: 1.12; }
.won-homepage > .home-hero .hero-intro { max-width: 53rem; margin: 0 auto var(--ws-s4); color: var(--ws-text-muted); font-size: var(--ws-fs-md); }
.won-homepage > .home-hero .hero-actions { display: flex; flex-wrap: wrap; gap: var(--ws-s3); justify-content: center; }


.won-entries-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--ws-s3); flex-wrap: wrap; margin: 0 0 var(--ws-s3); }
.won-entries-title { margin: 0; font-size: var(--ws-fs-xl); display: flex; align-items: center; gap: .6rem; }
.won-entries-head .won-note { margin-top: .25rem; }
.won-entries-actions { display: flex; flex-wrap: wrap; gap: var(--ws-s2); }
.won-wheel .won-btn-primary { background: var(--ws-gradient); color: #fff; border: 0; display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; box-shadow: var(--ws-shadow-md); }
.won-wheel .won-btn-primary:hover:not(:disabled) { background: var(--ws-primary-600); color: #fff; }
.won-btn-plus { font-size: 1.2rem; line-height: 1; }
.won-tab-ico svg, .won-h-ico svg { width: 1.15em; height: 1.15em; vertical-align: -.2em; }
.won-tab-ico { margin-right: .4rem; color: var(--ws-primary); display: inline-block; }
.won-h-ico { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: var(--ws-r-md); background: var(--ws-primary-100); color: var(--ws-primary); }
.won-wheel .won-tab { font-size: var(--ws-fs-sm); }

.won-wheel .won-tab { font-size: .8125rem; padding: 0 .35rem; white-space: nowrap; }
.won-tab-ico { margin-right: .25rem; }
.won-tab-count { margin-left: .2rem; }


.won-wheel input.won-dot { -webkit-appearance: none; appearance: none; width: 26px; min-width: 26px; height: 26px; min-height: 26px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer; flex: none; }
.won-wheel input.won-dot::-webkit-color-swatch-wrapper { padding: 0; }
.won-wheel input.won-dot::-webkit-color-swatch { border: 2px solid rgb(255 255 255 / .65); border-radius: 50%; box-shadow: 0 0 0 1px var(--ws-border); }
.won-wheel input.won-dot::-moz-color-swatch { border: 2px solid rgb(255 255 255 / .65); border-radius: 50%; }
.won-wheel input[type="range"] { width: 100%; min-height: 28px; padding: 0; border: 0; background: none; accent-color: var(--ws-primary); }


html[data-theme="dark"] { --won-ink: #f1eeff; --won-paper: #120e24; --won-surface: #1b1633; --won-border: #372f63; --won-accent: #b79cff; --home-soft: #1f1a3a; --home-shadow: 0 10px 26px #0006; }
html[data-theme="dark"] body { background: var(--ws-bg); color: var(--ws-text); }
html[data-theme="dark"]:has(.is-studio) body { background: linear-gradient(#17112e 0, #120e24 520px); }
html[data-theme="dark"] .site-brand { background: #fff; border-radius: 12px; padding: 2px 10px; }
html[data-theme="dark"] .site-header { background: var(--ws-surface); border-color: var(--ws-border); box-shadow: 0 4px 20px #0006; }
html[data-theme="dark"] .site-header .tools-dropdown { background: var(--ws-surface); color: var(--ws-text); }
html[data-theme="dark"] .site-header .tools-dropdown a { color: var(--ws-text); }
html[data-theme="dark"] .won-wheel { background: transparent; color: var(--ws-text); }
html[data-theme="dark"] .won-chip, html[data-theme="dark"] .won-btn-outline { background: var(--ws-surface); color: var(--ws-text); border-color: var(--ws-border); }
html[data-theme="dark"] .won-wheel button:not(.won-btn-primary):not(.won-center-spin):not(.won-swatch) { color: var(--ws-text); }
html[data-theme="dark"] .won-wheel input[type="text"], html[data-theme="dark"] .won-wheel input[type="number"], html[data-theme="dark"] .won-wheel input[type="search"], html[data-theme="dark"] .won-wheel textarea, html[data-theme="dark"] .won-wheel select { background: var(--ws-surface-2); color: var(--ws-text); border-color: var(--ws-border); }
html[data-theme="dark"] .won-switch input[role="switch"] { background: #4a4180; }
html[data-theme="dark"] .won-switch input[role="switch"]:checked { background: var(--ws-primary); }
html[data-theme="dark"] .won-stage canvas { filter: drop-shadow(0 12px 26px rgb(0 0 0 / .55)); }
html[data-theme="dark"] .won-result-dialog { background: var(--ws-surface); color: var(--ws-text); }
html[data-theme="dark"] .won-dup, html[data-theme="dark"] .won-warn { background: #3a3114; color: #ffe9a8; }
html[data-theme="dark"] .won-banner { background: var(--ws-surface-2); }
html[data-theme="dark"] .won-rail, html[data-theme="dark"] .won-bar, html[data-theme="dark"] .won-tabs { background: var(--ws-surface); }
html[data-theme="dark"] .won-wheel .won-tab[aria-selected="true"] { background: var(--ws-surface-2); }
html[data-theme="dark"] .won-wheel .won-bar .won-bar-spin { background: var(--ws-primary-100); color: var(--ws-primary); }
html[data-theme="dark"] .won-thumb::after { background: var(--ws-surface); }
html[data-theme="dark"] .won-wheel .won-swatch { border-color: var(--ws-surface); }


html[data-theme="dark"] .won-wheel fieldset, html[data-theme="dark"] .won-wheel details, html[data-theme="dark"] .won-wheel .won-panel { background: transparent; }
html[data-theme="dark"] .won-wheel button:not(.won-btn-primary):not(.won-center-spin):not(.won-swatch):not(.won-bar-spin):not(.won-tab):not(.won-rail-btn):not(.won-bar-btn):not(.won-handle) { background: var(--ws-surface-2); color: var(--ws-text); border-color: var(--ws-border); }
html[data-theme="dark"] .won-wheel .won-rail-btn, html[data-theme="dark"] .won-wheel .won-bar-btn, html[data-theme="dark"] .won-wheel .won-tab, html[data-theme="dark"] .won-wheel .won-handle { background: transparent; color: var(--ws-text); }
html[data-theme="dark"] .won-wheel .won-tab[aria-selected="true"] { background: var(--ws-primary-100); color: #fff; }
html[data-theme="dark"] .won-wheel .won-ico { background: var(--ws-primary-100); border-color: var(--ws-border); }
html[data-theme="dark"] .won-wheel .won-btn-primary { color: #fff; }
html[data-theme="dark"] .won-entry-row, html[data-theme="dark"] .won-lib-item, html[data-theme="dark"] .won-paste { background: var(--ws-surface-2); border-color: var(--ws-border); }
html[data-theme="dark"] .won-qa { background: var(--ws-surface); }
html[data-theme="dark"] .won-wheel .won-weight-input:disabled { background: transparent; color: var(--ws-text-muted); }
html[data-theme="dark"] .won-tally-table th, html[data-theme="dark"] .won-tally-table td, html[data-theme="dark"] .won-studio-cards .won-history li { border-color: var(--ws-border); }
html[data-theme="dark"] .won-wheel label, html[data-theme="dark"] .won-wheel legend, html[data-theme="dark"] .won-wheel h2, html[data-theme="dark"] .won-wheel h3 { color: var(--ws-text); }


.won-wheel button.won-btn-primary, html[data-theme="dark"] .won-wheel button.won-btn-primary { background: var(--ws-gradient) !important; color: #fff !important; border: 0 !important; }
.won-wheel button.won-btn-primary:hover:not(:disabled) { background: var(--ws-primary-600) !important; }


html[data-theme="dark"] .home-process-flow li, html[data-theme="dark"] .home-odds-panel, html[data-theme="dark"] .home-again-branches > section,
html[data-theme="dark"] .home-route-grid li, html[data-theme="dark"] .home-visual, html[data-theme="dark"] .home-randomness,
html[data-theme="dark"] .random-diagram li, html[data-theme="dark"] .sample-names li, html[data-theme="dark"] .sample-winner,
html[data-theme="dark"] .duplicate-entries li, html[data-theme="dark"] .home-step, html[data-theme="dark"] .home-use-card, html[data-theme="dark"] .home-tool-card {
  background: var(--ws-surface) !important; border-color: var(--ws-border) !important; color: var(--ws-text) !important; box-shadow: none;
}
html[data-theme="dark"] .duplicate-entries .duplicate-match { background: var(--ws-primary-100) !important; color: var(--ws-text) !important; }
html[data-theme="dark"] .hero-intro, html[data-theme="dark"] .home-values p, html[data-theme="dark"] .home-odds-panel p { color: var(--ws-text-muted); }


.is-studio .won-wheel-layout { align-items: stretch; }
.is-studio .won-stage-panel { align-content: center; }
.is-studio .won-qa { align-self: start; }
.is-studio .won-editor { display: flex; flex-direction: column; }
.is-studio .won-editor > .won-panel:not([hidden]) { flex: 1; }
.is-studio .won-entry-list { max-height: 300px; }
.is-studio [data-role="entry-controls"] > .won-actions { display: none; } 
.won-wheel .won-search-input, .won-wheel input[type="search"] { min-height: 40px; }


.is-studio .won-side-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: var(--ws-s4); }
.is-studio .won-side-cards > .won-card { display: flex; flex-direction: column; padding: var(--ws-s4); }

.is-studio .won-studio-cards, .won-studio-cards { align-items: stretch; margin-top: var(--ws-s4); gap: var(--ws-s4); }
.won-studio-cards > .won-card, .won-studio-cards > .won-history { display: flex; flex-direction: column; height: 100%; margin: 0; padding: var(--ws-s4); }
@media (min-width: 1200px) { .won-studio-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 700px) and (max-width: 1199px) { .won-studio-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 699px) { .won-studio-cards, .is-studio .won-side-cards { grid-template-columns: minmax(0, 1fr); } }


.won-card > h3, .won-studio-cards .won-history h3, .won-card-head h3 { margin: 0 0 var(--ws-s3); font-size: var(--ws-fs-lg); line-height: 1.2; display: flex; align-items: center; gap: .6rem; }
.won-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--ws-s2); margin-bottom: var(--ws-s3); }
.won-card-head h3 { margin: 0; }
.won-card-head .won-switch { margin: 0 !important; flex: none; }
.won-card-head .won-switch span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.won-studio-cards .won-history .won-wheel-heading { margin-bottom: var(--ws-s2); }
.won-studio-cards .won-history .won-wheel-heading h3 { margin: 0; }
.won-studio-cards .won-history .won-wheel-heading button { min-height: 36px; padding: 0 var(--ws-s3); font-size: var(--ws-fs-xs); }
.won-studio-cards .won-history .won-note { font-size: var(--ws-fs-xs); margin: 0 0 var(--ws-s2); }
.won-studio-cards .won-history ol { margin-top: 0; flex: 1; }


.won-field-row { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: var(--ws-s2); margin: var(--ws-s2) 0; }
.won-field-row label { font-size: var(--ws-fs-sm); margin: 0 !important; }
.won-field-row select { min-height: 40px; padding: 0 var(--ws-s2); }
.won-volume-row { grid-template-columns: auto minmax(0, 1fr) auto; }
.won-volume-row button { min-height: 36px; padding: 0 var(--ws-s3); font-size: var(--ws-fs-xs); }
.won-side-cards .won-switch { margin: var(--ws-s2) 0 !important; font-size: var(--ws-fs-sm); }
.won-side-cards .won-note { font-size: var(--ws-fs-xs); margin-top: auto; padding-top: var(--ws-s2); }


.won-lib-list { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: var(--ws-s2); max-height: 300px; margin: var(--ws-s2) 0; }
.won-lib-item { position: relative; padding: var(--ws-s2); gap: var(--ws-s1); }
.won-lib-item .won-lib-title { font-size: var(--ws-fs-xs); }
.won-lib-menu { position: absolute; top: 4px; right: 4px; }
.won-lib-menu summary { list-style: none; cursor: pointer; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; font-weight: 800; color: var(--ws-text-muted); }
.won-lib-menu summary::-webkit-details-marker { display: none; }
.won-lib-menu summary:hover, .won-lib-menu[open] summary { background: var(--ws-primary-100); color: var(--ws-primary); }
.won-lib-menu[open] .won-lib-actions { position: absolute; z-index: 5; top: 30px; right: 0; width: 140px; flex-direction: column; align-items: stretch; padding: var(--ws-s2); background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); box-shadow: var(--ws-shadow-lg); }
.won-lib-menu[open] .won-lib-actions button { width: 100%; justify-content: flex-start; }


.won-card .won-warn { font-size: .75rem; padding: var(--ws-s2); margin-bottom: var(--ws-s2); }
.won-card .won-input-action { grid-template-columns: minmax(0, 1fr) auto; }
.won-card .won-input-action input { min-height: 40px; }
.won-card textarea { min-height: 60px; }

.won-export-actions { display: grid; gap: var(--ws-s2); grid-template-columns: 1fr; }
.won-export-actions button { width: 100%; justify-content: flex-start; display: flex; align-items: center; gap: .6rem; min-height: 46px; }
.won-card .won-ico { background: var(--ws-primary-100); }


.is-studio .won-wheel-heading { display: flex; }                       
.is-studio > .won-wheel-heading, .is-studio > .won-privacy { display: none; } 
.is-studio > .won-privacy { display: block; }
.won-side-cards .won-card > h3, .won-side-cards .won-card-head h3 { font-size: 1.05rem; }
.won-side-cards .won-field-row label { font-size: var(--ws-fs-xs); line-height: 1.25; }
.won-side-cards .won-field-row select { min-width: 0; padding: 0 var(--ws-s2); font-size: var(--ws-fs-xs); }
.won-side-cards .won-field-row { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.won-side-cards .won-switch { margin: var(--ws-s1) 0 !important; }
.won-side-cards .won-swatches { margin: 0; }
.is-studio .won-entry-list { max-height: 252px; }


.won-wheel .won-toolbar { gap: var(--ws-s1); }
.won-wheel .won-toolbar button { min-height: 36px; padding: 0 .65rem; font-size: .8125rem; }
.is-studio [data-role="entry-controls"] > .won-note { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: var(--ws-s1) 0; }


.won-templates { display: grid; grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: var(--ws-s2); margin-top: var(--ws-s3); }
.won-wheel button.won-tpl { display: flex; align-items: center; justify-content: flex-start; gap: .5rem; min-height: 44px; padding: 0 var(--ws-s2); font-size: var(--ws-fs-xs); text-align: left; }
.won-tpl-ico { font-size: 1.15rem; line-height: 1; }
.won-wheel button.won-img-btn { width: 40px; min-width: 40px; height: 40px; min-height: 40px; padding: 0; display: grid; place-items: center; border-radius: var(--ws-r-md); flex: none; overflow: hidden; }
.won-img-thumb { width: 100%; height: 100%; object-fit: cover; display: block; }
.won-wheel button.won-img-clear { width: 28px; min-width: 28px; min-height: 28px; height: 28px; padding: 0; border-radius: 50%; color: var(--ws-danger); flex: none; font-size: 1rem; line-height: 1; }
.won-img-btn.is-flash { animation: won-flash 0.6s ease-in-out 3; }
@keyframes won-flash { 50% { box-shadow: 0 0 0 4px var(--ws-primary); } }
.won-winner-img { display: block; width: 96px; height: 96px; margin: 0 auto var(--ws-s3); border-radius: 50%; object-fit: cover; border: 4px solid #fff; box-shadow: var(--ws-shadow-md); }
.won-wheel-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ws-s2); margin-bottom: var(--ws-s3); }
.won-wtab { display: inline-flex; align-items: center; border: 1px solid var(--ws-border); background: var(--ws-surface); border-radius: var(--ws-r-pill); overflow: hidden; }
.won-wtab.is-active { border-color: var(--ws-primary); box-shadow: 0 0 0 2px var(--ws-primary-100); }
.won-wheel .won-wtab button { border: 0; background: transparent; min-height: 40px; border-radius: 0; }
.won-wheel .won-wtab.is-active .won-wtab-name { color: var(--ws-primary); font-weight: 700; }
.won-wheel .won-wtab-x { width: 34px; padding: 0; color: var(--ws-text-muted); }
.won-wheel .won-wtab-new { display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; border-radius: var(--ws-r-pill); }
.won-wheel .won-wtab-new .won-ico { width: 1.4em; height: 1.4em; }
.won-combined { margin-top: var(--ws-s4); }
html[data-theme="dark"] .won-wtab { background: var(--ws-surface); }



.won-wheel input.won-visually-hidden, input.won-visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important; padding: 0 !important; border: 0 !important; overflow: hidden; clip: rect(0 0 0 0); }
@media (max-width: 699px) {
  .won-bar { flex-wrap: wrap; }
  .won-wheel .won-bar .won-bar-btn, .won-wheel .won-bar .won-bar-spin { flex: 1 1 84px; min-width: 84px; }
  .won-bar-auto { flex: 1 1 100%; border-left: 0; padding: var(--ws-s2) var(--ws-s3) 0; justify-content: space-between; }
  .won-wheel-tabs { overflow-x: auto; flex-wrap: nowrap; }
  .is-studio .won-stage-panel { padding: var(--ws-s3); }
  .won-rail { flex-direction: row; width: auto; }
  .won-wheel .won-rail-btn { min-width: 56px; }
}




.tool-content { display: flex; flex-direction: column; }
.tool-content > .entry-content { display: contents; }
.tool-content > .won-tool-chips { order: -3 !important; }
.tool-content .won-wheel, .tool-content .won-grouping, .tool-content .won-picker { order: -2 !important; }
.tool-content > .related-section { order: 99; }
.tool-content .entry-content > h1 { margin-top: var(--ws-s6); }
.tool-content > .won-tool-chips, .tool-content .won-grouping, .tool-content .won-picker { width: min(calc(100vw - 3rem), 1560px); max-width: none; margin-inline: calc(50% - min(50vw - 1.5rem, 780px)); }
.tool-content { max-width: none; width: 100%; }

.tool-content .entry-content > :not(.won-wheel):not(.won-grouping):not(.won-picker) { max-width: none; margin-inline: 0; width: 100%; }
.tool-content .entry-content > :is(p, ul, ol, dl, blockquote, h1, h2, h3, h4):not(.won-wheel):not(.won-grouping):not(.won-picker) { max-width: 52rem; }


.tool-content .won-grouping, .tool-content .won-picker { --group-ink: var(--ws-text); --group-line: var(--ws-border); --group-accent: var(--ws-primary); border: 0; background: none; padding: 0; margin-block: var(--ws-s4) var(--ws-s5); color: var(--ws-text); font-family: var(--ws-font); box-shadow: none; }
.tool-content .won-grouping > h2, .tool-content .won-picker > h2 { font-size: var(--ws-fs-xl); margin: 0 0 var(--ws-s1); }
.tool-content .won-group-note, .tool-content .won-picker-note { color: var(--ws-text-muted); font-size: var(--ws-fs-xs); margin: 0 0 var(--ws-s3); }
.tool-content .won-group-layout, .tool-content .won-picker-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--ws-s4); align-items: stretch; }
.tool-content .won-group-layout > div, .tool-content .won-picker-layout > div { background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); box-shadow: 0 8px 30px rgb(80 50 170 / .08); padding: var(--ws-s5); min-width: 0; }
.tool-content .won-grouping fieldset, .tool-content .won-picker fieldset { border: 0; padding: 0; margin: 0 0 var(--ws-s3); background: transparent; }
.tool-content .won-grouping legend, .tool-content .won-picker legend { font-size: var(--ws-fs-lg); font-weight: var(--ws-fw-bold); padding: 0; margin-bottom: var(--ws-s2); color: var(--ws-text); }
.tool-content .won-grouping label, .tool-content .won-picker label { font-size: var(--ws-fs-sm); font-weight: var(--ws-fw-medium); color: var(--ws-text); margin: var(--ws-s3) 0 var(--ws-s1); }
.tool-content .won-grouping input:not([type="checkbox"]), .tool-content .won-grouping textarea, .tool-content .won-grouping select,
.tool-content .won-picker input:not([type="checkbox"]), .tool-content .won-picker textarea, .tool-content .won-picker select { background: var(--ws-surface-2); color: var(--ws-text); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); min-height: 44px; padding: var(--ws-s2) var(--ws-s3); font: inherit; }
.tool-content .won-grouping button, .tool-content .won-picker button { background: var(--ws-surface); color: var(--ws-text); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); min-height: 44px; font-weight: var(--ws-fw-medium); transition: background var(--ws-dur-fast), border-color var(--ws-dur-fast), transform var(--ws-dur-fast); }
.tool-content .won-grouping button:hover:not(:disabled), .tool-content .won-picker button:hover:not(:disabled) { background: var(--ws-primary-100); border-color: var(--ws-primary); }
.tool-content .won-grouping button:disabled, .tool-content .won-picker button:disabled { opacity: .5; }
.tool-content .won-grouping button.won-group-generate, .tool-content .won-picker button.won-picker-draw, .tool-content .won-group-input-action button:not([data-action]), .tool-content .won-picker-input-action button:not([data-action]) { background: var(--ws-gradient) !important; color: #fff !important; border: 0 !important; font-weight: 700; box-shadow: var(--ws-shadow-md); }
.tool-content .won-group-generate, .tool-content .won-picker-draw { width: 100%; min-height: 54px !important; font-size: var(--ws-fs-md); border-radius: var(--ws-r-pill) !important; margin-top: var(--ws-s2); }
.tool-content .won-group-generate:hover:not(:disabled), .tool-content .won-picker-draw:hover:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); }
.tool-content .won-group-actions, .tool-content .won-picker-actions { display: flex; flex-wrap: wrap; gap: var(--ws-s2); }
.tool-content .won-participant-list, .tool-content .won-picker-entry-list { list-style: none; margin: var(--ws-s3) 0; padding: 0; display: grid; gap: var(--ws-s2); max-height: 340px; overflow: auto; }
.tool-content .won-participant-list li, .tool-content .won-picker-entry-list li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--ws-s2); padding: .35rem .6rem; background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); }
.tool-content .won-participant-list li button, .tool-content .won-picker-entry-list li button { color: var(--ws-danger); border-color: transparent; background: transparent; }
.tool-content .won-group-check input { accent-color: var(--ws-primary); width: 18px; height: 18px; min-height: 0; }
.tool-content .won-picker-option { display: flex; align-items: center; gap: var(--ws-s2); }
.tool-content .won-picker-option input { width: 20px; height: 20px; min-height: 0; accent-color: var(--ws-primary); }


.tool-content .won-group-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: var(--ws-s3); margin: var(--ws-s3) 0; }
.tool-content .won-group-card { --c: var(--ws-primary); background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-top: 6px solid var(--c); border-radius: var(--ws-r-md); padding: var(--ws-s4); box-shadow: var(--ws-shadow-sm); animation: won-pop var(--ws-dur-slow) var(--ws-ease) both; }
.tool-content .won-group-card:nth-child(6n+1) { --c: #7a4bff; } .tool-content .won-group-card:nth-child(6n+2) { --c: #f0457f; } .tool-content .won-group-card:nth-child(6n+3) { --c: #1fb86a; }
.tool-content .won-group-card:nth-child(6n+4) { --c: #f7b928; } .tool-content .won-group-card:nth-child(6n+5) { --c: #2f7df6; } .tool-content .won-group-card:nth-child(6n) { --c: #f5742c; }
.tool-content .won-group-card h3 { color: var(--c); margin: 0 0 var(--ws-s2); }
.tool-content .won-group-card ul, .tool-content .won-group-card ol { margin: 0; padding-left: 1.2rem; }
.tool-content .won-picker-winners { display: grid; gap: var(--ws-s2); margin: var(--ws-s3) 0; }
.tool-content .won-picker-winner { display: flex; align-items: center; gap: var(--ws-s3); padding: var(--ws-s3) var(--ws-s4); background: var(--ws-primary-100); border: 1px solid var(--ws-primary); border-radius: var(--ws-r-md); animation: won-pop var(--ws-dur-slow) var(--ws-ease) both; }
.tool-content .won-picker-winner-name { font-size: var(--ws-fs-xl); font-weight: var(--ws-fw-bold); color: var(--ws-primary); }
.tool-content .won-picker-history { background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); padding: var(--ws-s5); margin-top: var(--ws-s4); }
@keyframes won-pop { from { opacity: 0; transform: scale(.94) translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .tool-content .won-group-card, .tool-content .won-picker-winner { animation: none; } }
@media (max-width: 899px) { .tool-content .won-group-layout, .tool-content .won-picker-layout { grid-template-columns: minmax(0, 1fr); } .tool-content .won-group-layout > div, .tool-content .won-picker-layout > div { padding: var(--ws-s4); } }


.breadcrumbs { font-size: var(--ws-fs-sm); color: var(--ws-text-muted); }
.breadcrumbs a { color: var(--ws-primary); text-decoration: none; }
.archive-header { margin: var(--ws-s4) 0 var(--ws-s5); }
.archive-header h1 { font-size: clamp(1.9rem, 3.6vw, 2.9rem); line-height: 1.1; letter-spacing: -.02em; margin: 0 0 var(--ws-s3); color: var(--ws-text); }
.archive-intro, .archive-description { color: var(--ws-text-muted); max-width: 52rem; }
.hub-group { margin: var(--ws-s6) 0; }
.hub-group > h2 { display: flex; align-items: center; gap: .6rem; font-size: var(--ws-fs-xl); margin: 0 0 var(--ws-s4); color: var(--ws-text); }
.hub-group > h2::before { content: ""; width: 12px; height: 28px; border-radius: 6px; background: var(--ws-gradient); }
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: var(--ws-s4); }
.card-grid .card, .card-grid > article { background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); padding: var(--ws-s5); box-shadow: 0 8px 30px rgb(80 50 170 / .07); transition: transform var(--ws-dur) var(--ws-ease), border-color var(--ws-dur), box-shadow var(--ws-dur); position: relative; }
.card-grid .card:hover, .card-grid > article:hover { transform: translateY(-3px); border-color: var(--ws-primary); box-shadow: 0 14px 40px rgb(80 50 170 / .16); }
.card-grid .card h2, .card-grid .card h3 { font-size: var(--ws-fs-lg); margin: 0 0 var(--ws-s2); }
.card-grid .card h2 a, .card-grid .card h3 a { color: var(--ws-text); text-decoration: none; }
.card-grid .card h2 a::after, .card-grid .card h3 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.card-grid .card p { color: var(--ws-text-muted); margin: 0; font-size: var(--ws-fs-sm); }


.editorial-content { max-width: none; margin-inline: 0; color: var(--ws-text); }

.editorial-content .entry-content > :is(p, ul, ol, dl, blockquote, h2, h3, h4) { max-width: 52rem !important; }
.editorial-content .entry-header h1, .editorial-content h1 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); line-height: 1.12; letter-spacing: -.02em; color: var(--ws-text); }
.editorial-content h2 { font-size: var(--ws-fs-xl); margin: var(--ws-s6) 0 var(--ws-s3); color: var(--ws-text); }
.editorial-content h3 { font-size: var(--ws-fs-lg); color: var(--ws-text); }
.editorial-content a, .tool-content .entry-content a:not(.button) { color: var(--ws-primary); text-underline-offset: 3px; }
.won-quick, .direct-answer { background: var(--ws-primary-100); border: 1px solid var(--ws-border); border-left: 5px solid var(--ws-primary); border-radius: var(--ws-r-md); padding: var(--ws-s4) var(--ws-s5); color: var(--ws-text); }
.won-toc { background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); padding: var(--ws-s5); box-shadow: var(--ws-shadow-sm); }
.won-toc a { color: var(--ws-primary); }
.guide-table-wrap table, .editorial-content table { width: 100%; border-collapse: collapse; background: var(--ws-surface); border-radius: var(--ws-r-md); overflow: hidden; }
.guide-table-wrap th, .guide-table-wrap td, .editorial-content th, .editorial-content td { padding: var(--ws-s3); border-bottom: 1px solid var(--ws-border); text-align: left; }
.guide-table-wrap th, .editorial-content th { background: var(--ws-primary-100); color: var(--ws-text); }
.guide-faq details, .editorial-content details, .tool-content .entry-content details { background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); padding: var(--ws-s3) var(--ws-s4); margin: var(--ws-s2) 0; transition: border-color var(--ws-dur-fast); }
.guide-faq details[open], .editorial-content details[open], .tool-content .entry-content details[open] { border-color: var(--ws-primary); }
.guide-faq summary, .editorial-content summary, .tool-content .entry-content summary { cursor: pointer; font-weight: var(--ws-fw-bold); min-height: 40px; display: flex; align-items: center; color: var(--ws-text); }
.guide-cta { background: var(--ws-gradient); color: #fff; border-radius: var(--ws-r-lg); padding: var(--ws-s5); }
.guide-cta a, .guide-cta h2, .guide-cta p { color: #fff; }
.won-author, .won-related, .won-extras, .won-sources { color: var(--ws-text); }
.won-author { display: flex; gap: var(--ws-s4); align-items: center; background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); padding: var(--ws-s4); }
.won-eeat { border-color: var(--ws-border); }
.won-rating { background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); }
.button, a.button { background: var(--ws-gradient); color: #fff; border: 0; border-radius: var(--ws-r-md); font-weight: 700; text-decoration: none; }
.button-secondary, a.button-secondary { background: var(--ws-surface); color: var(--ws-primary); border: 1px solid var(--ws-border); }


.site-footer { margin-top: var(--ws-s7); background: linear-gradient(160deg, #1d1838 0%, #2a2150 100%); color: #e9e4ff; border: 0; }
.site-footer .footer-grid { padding-block: var(--ws-s6); width: min(calc(100% - 3rem), 1560px); max-width: none; gap: var(--ws-s6); }
.site-footer h2 { font-size: var(--ws-fs-md); letter-spacing: .06em; text-transform: uppercase; color: #fff; margin-bottom: var(--ws-s3); }
.site-footer a { color: #d9d1f0; text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.site-footer .footer-brand-name { color: #fff; font-weight: 800; font-size: var(--ws-fs-lg); }
.site-footer .footer-description { color: #bdb5e0; }
.site-footer .footer-list { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--ws-s2); }
.site-footer .footer-logo-link { display: inline-block; background: #fff; border-radius: 12px; padding: 6px 12px; }
.site-footer .footer-note { border-top: 1px solid rgb(255 255 255 / .12); padding-block: var(--ws-s4); width: min(calc(100% - 3rem), 1560px); max-width: none; color: #bdb5e0; display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--ws-s2); }
@media (max-width: 899px) { .site-footer .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .site-footer .footer-grid { grid-template-columns: minmax(0, 1fr); } }


html[data-theme="dark"] .card-grid .card, html[data-theme="dark"] .card-grid > article { box-shadow: none; }
html[data-theme="dark"] .won-quick, html[data-theme="dark"] .direct-answer { background: var(--ws-surface-2); }
html[data-theme="dark"] .editorial-content img, html[data-theme="dark"] .guide-figure img { filter: brightness(.92); }
html[data-theme="dark"] .site-footer { background: linear-gradient(160deg, #0d0a1c 0%, #1b1633 100%); }


html:not([data-theme="dark"]) body { background: linear-gradient(#f7f4ff 0, #fff 520px) fixed; }



:is(body.single-won_guide, body.single-won_knowledge, body.single-won_use_case, body.page:not(.home)) main.site-main > :not(.won-tool-chips) { width: 100%; max-width: none; margin-inline: 0; }
:is(body.single-won_guide, body.single-won_knowledge, body.single-won_use_case, body.page:not(.home)) main.site-main > .breadcrumbs { max-width: none; }
.editorial-content, .editorial-content .entry-header, .editorial-content .entry-content, .editorial-content .entry-content > *, .editorial-content > .direct-answer { max-width: none !important; margin-inline: 0 !important; }
.editorial-content .entry-content > * + * { margin-top: var(--ws-s3); }
.editorial-content .guide-table-wrap { overflow-x: auto; }
.editorial-content img, .editorial-content video, .won-extras img, .won-extras iframe { max-width: 100%; height: auto; }
.won-extras { max-width: none !important; margin-inline: 0 !important; padding-inline: 0 !important; }
.editorial-content .direct-answer, .editorial-content .entry-header .direct-answer { width: 100%; box-sizing: border-box; }
.won-video-frame { border-radius: var(--ws-r-lg); overflow: hidden; box-shadow: var(--ws-shadow-md); }


.won-related a, .won-extras a, .won-author a, .won-eeat a, .won-sources a, .entry-meta a, .won-toc a, .archive-intro a, .breadcrumbs a { color: var(--ws-primary); text-underline-offset: 3px; }
.won-related h2, .won-extras h2, .won-sources h2 { color: var(--ws-text); }


.card-grid .card .won-quick { background: transparent; border: 0; border-left: 3px solid var(--ws-border); border-radius: 0; padding: 0 0 0 var(--ws-s3); margin: var(--ws-s3) 0 0; font-size: var(--ws-fs-xs); color: var(--ws-text-muted); }


.site-footer .footer-list li { margin: 0; padding: 0; }
.site-footer .footer-list a, .site-footer nav a { display: inline-block; padding: .3rem 0; min-height: 0; font-weight: 400; }
.site-footer .footer-list { gap: var(--ws-s1); }
.site-footer input[type="search"], .site-footer input[type="text"] { background: rgb(255 255 255 / .08); color: #fff; border: 1px solid rgb(255 255 255 / .2); border-radius: var(--ws-r-md); }
.site-footer button { background: transparent; color: #fff; border: 1px solid rgb(255 255 255 / .3); border-radius: var(--ws-r-md); }

.editorial-content .direct-answer, .editorial-content .entry-header > p { max-width: none !important; }


.won-social { list-style: none; display: flex; flex-wrap: wrap; gap: var(--ws-s3); margin: var(--ws-s4) 0 0; padding: 0; }
.won-social-link { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgb(255 255 255 / .1); color: #fff; border: 1px solid rgb(255 255 255 / .18); transition: transform var(--ws-dur) var(--ws-ease), background var(--ws-dur), border-color var(--ws-dur); }
.won-social-link:hover { transform: translateY(-2px); background: var(--ws-primary); border-color: var(--ws-primary); color: #fff; }
.won-social-link:focus-visible { outline: none; box-shadow: var(--ws-ring); }
@media (prefers-reduced-motion: reduce) { .won-social-link { transition: none; } .won-social-link:hover { transform: none; } }


.footer-dmca { margin: 0; display: flex; align-items: center; }
.footer-dmca a { display: inline-flex; min-height: 44px; align-items: center; }
.footer-dmca img { width: 121px; height: 24px; max-width: none; }
.site-footer .footer-note { gap: var(--ws-s3, 1rem); flex-wrap: wrap; }


.site-header .tools-disclosure > summary { cursor: pointer; list-style: none; user-select: none; }
.site-header .tools-disclosure > summary::-webkit-details-marker { display: none; }
.site-header .tools-disclosure > summary::after { content: ""; width: .5rem; height: .5rem; margin-left: .15rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform var(--ws-dur, .2s) var(--ws-ease, ease); }
.site-header .tools-disclosure[open] > summary::after { transform: translateY(1px) rotate(-135deg); }
.site-header .tools-disclosure .tools-dropdown {
  position: absolute; z-index: 80; inset-inline: auto; left: 0; top: calc(100% + .6rem); width: min(48rem, calc(100vw - 2rem));
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ws-s4, 1rem) var(--ws-s5, 1.5rem); padding: var(--ws-s5, 1.5rem);
  background: var(--ws-surface, #fff); color: var(--ws-text, #1d1838); border: 1px solid var(--ws-border, #e4def5); border-radius: var(--ws-r-lg, 22px);
  box-shadow: var(--ws-shadow-lg, 0 18px 50px rgb(60 30 140 / .16)); max-height: none; overflow: visible;
}
.site-header .tools-dropdown section { min-width: 0; }
.site-header .tools-dropdown h2 { display: flex; align-items: center; gap: .5rem; margin: 0 0 var(--ws-s2, .5rem); font-size: var(--ws-fs-xs, .8rem); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ws-primary, #6d3bf5); white-space: normal; }
.site-header .tools-dropdown h2::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: var(--ws-primary, #6d3bf5); }
.site-header .tools-dropdown section:nth-of-type(2) h2 { color: var(--ws-blue, #2f7df6); } .site-header .tools-dropdown section:nth-of-type(2) h2::before { background: var(--ws-blue, #2f7df6); }
.site-header .tools-dropdown section:nth-of-type(3) h2 { color: var(--ws-orange, #f5742c); } .site-header .tools-dropdown section:nth-of-type(3) h2::before { background: var(--ws-orange, #f5742c); }
.site-header .tools-dropdown ul { display: grid; gap: .1rem; margin: 0; padding: 0; list-style: none; }
.site-header .tools-dropdown li a { display: flex; align-items: center; width: 100%; min-height: 40px; padding: .4rem .7rem; border-radius: var(--ws-r-md, 12px); color: var(--ws-text, #1d1838); font-weight: 600; text-decoration: none; white-space: normal; }
.site-header .tools-dropdown li a:hover, .site-header .tools-dropdown li a:focus-visible { background: var(--ws-primary-100, #efe9ff); color: var(--ws-primary, #6d3bf5); outline: none; box-shadow: var(--ws-ring, none); }
.site-header .tools-dropdown .all-tools { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 1.4rem; border: 0; border-radius: var(--ws-r-md, 12px); background: var(--ws-gradient, linear-gradient(135deg, #7a4bff, #5a2ae0)); color: #fff; font-weight: 800; text-decoration: none; box-shadow: 0 6px 16px rgb(90 42 224 / .3); }
.site-header .tools-dropdown .all-tools:hover { filter: brightness(1.08); color: #fff; }
@media (max-width: 48rem) {
  .site-header .tools-disclosure .tools-dropdown { position: static; width: 100%; grid-template-columns: minmax(0, 1fr); box-shadow: none; margin-top: var(--ws-s2, .5rem); padding: var(--ws-s3, .75rem); max-height: 65vh; overflow-y: auto; }
}
@media (prefers-reduced-motion: reduce) { .site-header .tools-disclosure > summary::after { transition: none; } }


body.home .won-homepage { --hs-r: var(--ws-r-lg); font-family: var(--ws-font); color: var(--ws-text); }


body.home .won-homepage .home-editorial, body.home .won-homepage .won-merge, body.home .won-homepage .won-more {
  --tone: var(--ws-primary); position: relative; isolation: isolate; display: flow-root;
  padding: clamp(1.25rem, 3vw, 2.5rem); margin-block: var(--ws-s6); border-radius: var(--hs-r);
  border: 1px solid color-mix(in srgb, var(--tone) 18%, var(--ws-border));
  background: linear-gradient(135deg, color-mix(in srgb, var(--tone) 9%, var(--ws-surface)), color-mix(in srgb, var(--tone) 2%, var(--ws-surface)) 70%);
  box-shadow: var(--ws-shadow-md); color: var(--ws-text);
}
body.home .won-homepage [aria-labelledby="how-title"] { --tone: var(--ws-blue); }
body.home .won-homepage [aria-labelledby="use-cases-title"] { --tone: var(--ws-primary); }
body.home .won-homepage [aria-labelledby="winner-title"] { --tone: var(--ws-primary); }
body.home .won-homepage [aria-labelledby="trust-title"] { --tone: var(--ws-green); }
body.home .won-homepage [aria-labelledby="chances-title"] { --tone: var(--ws-primary); }
body.home .won-homepage [aria-labelledby="duplicates-title"] { --tone: var(--ws-pink); }
body.home .won-homepage [aria-labelledby="remove-title"] { --tone: var(--ws-orange); }
body.home .won-homepage [aria-labelledby="storage-title"] { --tone: var(--ws-blue); }
body.home .won-homepage [aria-labelledby="examples-title"] { --tone: var(--ws-cyan); }
body.home .won-homepage [aria-labelledby="comparison-title"] { --tone: var(--ws-primary); }
body.home .won-homepage #random-wheel { --tone: var(--ws-pink); }
body.home .won-homepage .won-more { --tone: var(--ws-blue); }

.won-eyebrow { display: inline-flex; align-items: center; gap: .4rem; margin-bottom: var(--ws-s2); padding: .2rem .8rem; border-radius: var(--ws-r-pill); background: color-mix(in srgb, var(--tone) 14%, var(--ws-surface)); color: var(--tone); font-size: var(--ws-fs-xs); font-weight: var(--ws-fw-bold); letter-spacing: .06em; text-transform: uppercase; }
.won-eyebrow::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; }
body.home .won-homepage .home-section-title { color: var(--ws-text); font-weight: 800; letter-spacing: -.03em; font-size: clamp(1.7rem, 3vw, 2.4rem); }
body.home .won-homepage .home-editorial p, body.home .won-homepage .won-merge p, body.home .won-homepage .won-more p, body.home .won-homepage .won-merge li { color: var(--ws-text); line-height: 1.7; }
body.home .won-homepage .home-editorial > p, body.home .won-homepage .won-merge > p, body.home .won-homepage .won-more > p { max-width: 54rem; }
body.home .won-homepage .home-editorial a, body.home .won-homepage .won-merge a, body.home .won-homepage .won-more a { color: var(--ws-primary); text-underline-offset: 3px; }
body.home .won-homepage .home-editorial a:focus-visible, body.home .won-homepage .won-merge a:focus-visible, body.home .won-homepage .won-more a:focus-visible { outline: none; box-shadow: var(--ws-ring); border-radius: 4px; }


body.home .won-homepage [data-won-deco] { display: flex; flex-direction: column; }
.won-deco { pointer-events: none; order: 99; width: min(18rem, 80%); margin: var(--ws-s4) auto 0; }
.won-deco svg { width: 100%; height: auto; display: block; }
@media (min-width: 1000px) {
  body.home .won-homepage [data-won-deco] { display: block; }
  body.home .won-homepage [data-won-deco] > :is(.won-eyebrow, h2, p) { max-width: min(52rem, calc(100% - 24rem)); }
  .won-deco { position: absolute; z-index: 0; top: var(--ws-s5); right: var(--ws-s5); width: 22rem; margin: 0; }
}


body.home .won-homepage .home-steps { counter-reset: hs; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ws-s6); list-style: none; padding: 0; margin: var(--ws-s5) 0; }
body.home .won-homepage .home-step { counter-increment: hs; position: relative; padding: var(--ws-s5); border-radius: var(--ws-r-lg); background: linear-gradient(160deg, color-mix(in srgb, var(--ws-primary) 10%, var(--ws-surface)), var(--ws-surface)); border: 1px solid var(--ws-border); box-shadow: var(--ws-shadow-sm); }
body.home .won-homepage .home-step:nth-child(2) { background: linear-gradient(160deg, color-mix(in srgb, var(--ws-yellow) 14%, var(--ws-surface)), var(--ws-surface)); }
body.home .won-homepage .home-step:nth-child(3) { background: linear-gradient(160deg, color-mix(in srgb, var(--ws-green) 12%, var(--ws-surface)), var(--ws-surface)); }
body.home .won-homepage .home-step::before { content: "0" counter(hs); position: absolute; top: var(--ws-s3); left: var(--ws-s3); display: grid; place-items: center; min-width: 2.3rem; height: 2.3rem; border-radius: var(--ws-r-md); background: var(--ws-surface); color: var(--ws-primary); font-weight: 800; box-shadow: var(--ws-shadow-sm); }
@media (min-width: 900px) { body.home .won-homepage .home-step:not(:last-child)::after { content: "→"; position: absolute; right: calc(var(--ws-s6) / -1 - .15rem); top: 50%; width: var(--ws-s6); text-align: center; color: var(--ws-primary); font-size: 1.4rem; font-weight: 800; } }
body.home .won-homepage .home-step h3 { color: var(--ws-text); }
body.home .won-homepage .home-icon-badge { display: grid; place-items: center; width: 4rem; height: 4rem; margin: 0 0 var(--ws-s3) auto; border-radius: 1.2rem; background: var(--ws-gradient); color: #fff; box-shadow: 0 8px 20px rgb(90 42 224 / .3); }
body.home .won-homepage .home-icon-badge .home-icon { width: 30px; height: 30px; }


body.home .won-homepage .home-use-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: var(--ws-s4); margin-top: var(--ws-s5); }
@media (min-width: 1100px) { body.home .won-homepage .home-use-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
body.home .won-homepage .home-use-card { --c: var(--ws-primary); padding: var(--ws-s4); border-radius: var(--ws-r-lg); background: linear-gradient(170deg, color-mix(in srgb, var(--c) 10%, var(--ws-surface)), var(--ws-surface) 60%); border: 1px solid color-mix(in srgb, var(--c) 22%, var(--ws-border)); box-shadow: var(--ws-shadow-sm); transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur) var(--ws-ease); }
body.home .won-homepage .home-use-card:hover { transform: translateY(-4px); box-shadow: var(--ws-shadow-lg); }
body.home .won-homepage .home-use-card:nth-child(2) { --c: var(--ws-pink); } body.home .won-homepage .home-use-card:nth-child(3) { --c: var(--ws-blue); }
body.home .won-homepage .home-use-card:nth-child(4) { --c: var(--ws-green); } body.home .won-homepage .home-use-card:nth-child(5) { --c: var(--ws-orange); }
body.home .won-homepage .home-use-card .home-icon-badge { margin: 0 0 var(--ws-s3); background: linear-gradient(135deg, color-mix(in srgb, var(--c) 80%, #fff), var(--c)); box-shadow: 0 8px 18px color-mix(in srgb, var(--c) 35%, transparent); }
body.home .won-homepage .home-use-card h3 { color: var(--ws-text); }
body.home .won-homepage .home-use-card p { color: var(--ws-text-muted); font-size: var(--ws-fs-sm); }


body.home .won-homepage .home-visual { background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); box-shadow: var(--ws-shadow-sm); margin-top: var(--ws-s5); }
body.home .won-homepage .home-visual h3 { color: var(--ws-text); }
body.home .won-homepage .home-visual figcaption, body.home .won-homepage .home-figure-note { color: var(--ws-text-muted); }
body.home .won-homepage .home-process-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ws-s3); list-style: none; margin: var(--ws-s4) 0; padding: 0; }
body.home .won-homepage .home-process-flow li { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--ws-s3); align-items: center; padding: var(--ws-s3); border-radius: var(--ws-r-md); background: var(--ws-surface-2); border: 1px solid var(--ws-border); }
body.home .won-homepage .home-process-flow li > svg { grid-row: span 2; width: 40px; height: 40px; padding: 9px; border-radius: 12px; background: var(--ws-primary-100); color: var(--ws-primary); }
body.home .won-homepage .home-process-flow li > span { color: var(--ws-text-muted); font-size: var(--ws-fs-sm); }
body.home .won-homepage .home-odds-grid { gap: var(--ws-s4); }
body.home .won-homepage .home-odds-panel { background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); }
body.home .won-homepage .home-entry-chips li { background: var(--ws-surface); border-color: var(--ws-border); border-radius: var(--ws-r-pill); color: var(--ws-text); }
body.home .won-homepage .home-odds-track { background: var(--ws-primary-100); height: .7rem; }
body.home .won-homepage .home-odds-fill { background: linear-gradient(90deg, var(--ws-primary), var(--ws-cyan)); }
body.home .won-homepage .home-odds-panel:nth-child(2) .home-odds-50 { background: linear-gradient(90deg, var(--ws-pink), var(--ws-orange)); }
body.home .won-homepage .home-again-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); display: grid; gap: var(--ws-s3); list-style: none; padding: 0; margin: var(--ws-s4) 0; }
body.home .won-homepage .home-again-flow > li { padding: var(--ws-s3) var(--ws-s4); border-radius: var(--ws-r-md); background: var(--ws-surface-2); border: 1px solid var(--ws-border); }
body.home .won-homepage .home-again-flow > li p { margin: 0; color: var(--ws-text-muted); }
body.home .won-homepage .home-again-flow > li:last-child { grid-column: 1 / -1; }
body.home .won-homepage .home-again-branches { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: var(--ws-s3); align-items: stretch; background: transparent !important; border: 0 !important; padding: 0 !important; }
body.home .won-homepage .home-again-branches section { padding: var(--ws-s4); border-radius: var(--ws-r-md); border: 1px solid; }
body.home .won-homepage .home-again-branches section:first-child { background: color-mix(in srgb, var(--ws-green) 12%, var(--ws-surface)); border-color: color-mix(in srgb, var(--ws-green) 40%, var(--ws-border)); }
body.home .won-homepage .home-again-branches section:last-child { background: color-mix(in srgb, var(--ws-orange) 12%, var(--ws-surface)); border-color: color-mix(in srgb, var(--ws-orange) 40%, var(--ws-border)); }
body.home .won-homepage .home-again-branches h4 { margin: 0 0 var(--ws-s2); color: var(--ws-text); }
body.home .won-homepage .home-or { align-self: center; padding: .35rem .6rem; border-radius: var(--ws-r-pill); background: var(--ws-primary-100); color: var(--ws-primary); font-weight: 800; font-size: var(--ws-fs-xs); }
body.home .won-homepage .home-example-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: var(--ws-s4); margin-top: var(--ws-s5); }
body.home .won-homepage .home-example-card { --c: var(--ws-primary); padding: var(--ws-s4); border-radius: var(--ws-r-md); background: var(--ws-surface); border: 1px solid var(--ws-border); border-top: 4px solid var(--c); box-shadow: var(--ws-shadow-sm); }
body.home .won-homepage .home-example-card:nth-child(2) { --c: var(--ws-pink); } body.home .won-homepage .home-example-card:nth-child(3) { --c: var(--ws-green); } body.home .won-homepage .home-example-card:nth-child(4) { --c: var(--ws-orange); }
body.home .won-homepage .home-example-card h3 { margin: 0 0 var(--ws-s2); color: var(--c); font-size: var(--ws-fs-md); }
body.home .won-homepage .home-example-card p { margin: 0; color: var(--ws-text); }
body.home .won-homepage .home-route-grid { gap: var(--ws-s3); }
body.home .won-homepage .home-route-grid li { background: var(--ws-surface-2); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur) var(--ws-ease); }
body.home .won-homepage .home-route-grid li:hover { transform: translateY(-3px); box-shadow: var(--ws-shadow-md); }
body.home .won-homepage .home-route-grid li > span { color: var(--ws-primary); }
body.home .won-homepage .home-route-grid p { color: var(--ws-text-muted); }


body.home .won-homepage .won-merge h3, body.home .won-homepage .won-more h3 { position: relative; margin: var(--ws-s6) 0 var(--ws-s2); padding-left: var(--ws-s3); color: var(--ws-text); font-size: var(--ws-fs-xl); }
body.home .won-homepage .won-merge h3::before, body.home .won-homepage .won-more h3::before { content: ""; position: absolute; left: 0; top: .2em; bottom: .2em; width: 4px; border-radius: 4px; background: linear-gradient(180deg, var(--ws-primary), var(--ws-pink)); }
body.home .won-homepage .won-merge :is(ul, ol) { max-width: 54rem; padding-left: 1.4rem; display: grid; gap: var(--ws-s2); }
body.home .won-homepage .won-merge li::marker { color: var(--ws-primary); font-weight: 800; }
body.home .won-homepage .won-merge > h2.home-section-title:not(#won-merge-title) { margin-top: var(--ws-s7); }
body.home .won-homepage .won-glance { width: 100%; max-width: none; border-collapse: separate; border-spacing: 0; background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); overflow: hidden; box-shadow: var(--ws-shadow-sm); }
body.home .won-homepage .won-glance th, body.home .won-homepage .won-glance td { padding: var(--ws-s3) var(--ws-s4); text-align: left; border-bottom: 1px solid var(--ws-border); color: var(--ws-text); vertical-align: top; }
body.home .won-homepage .won-glance th { width: 28%; background: var(--ws-primary-100); font-weight: var(--ws-fw-bold); }
body.home .won-homepage .won-glance tr:last-child :is(th, td) { border-bottom: 0; }
body.home .won-homepage .won-glance tr:nth-child(even) td { background: var(--ws-surface-2); }


@media (max-width: 1000px) { body.home .won-homepage .home-process-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 899px) { body.home .won-homepage .home-steps { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) {
  body.home .won-homepage .home-again-flow { grid-template-columns: minmax(0, 1fr); }
  body.home .won-homepage .home-process-flow { grid-template-columns: minmax(0, 1fr); }
  body.home .won-homepage .home-again-branches { grid-template-columns: minmax(0, 1fr); }
  body.home .won-homepage .home-or { justify-self: center; }
  body.home .won-homepage .home-odds-grid { grid-template-columns: minmax(0, 1fr); }
  body.home .won-homepage .home-route-grid { grid-template-columns: minmax(0, 1fr); }
  body.home .won-homepage .won-glance { display: block; overflow-x: auto; }
  body.home .won-homepage .won-glance th { width: auto; }
}
@media (prefers-reduced-motion: reduce) { body.home .won-homepage * { transition: none !important; } body.home .won-homepage .home-use-card:hover, body.home .won-homepage .home-route-grid li:hover { transform: none; } }


.won-feat { margin-block: clamp(3rem, 6vw, 5rem); font-family: var(--ws-font); color: var(--ws-text); }
.won-feat-head { text-align: center; max-width: 52rem; margin: 0 auto var(--ws-s6); }
.won-feat-pill { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .9rem; border-radius: var(--ws-r-pill); background: var(--ws-primary-100); color: var(--ws-primary); font-size: var(--ws-fs-xs); font-weight: var(--ws-fw-bold); letter-spacing: .06em; text-transform: uppercase; box-shadow: var(--ws-shadow-sm); }
.won-feat-head h2 { margin: var(--ws-s3) 0 var(--ws-s3); font-size: clamp(2rem, 4.6vw, 3.2rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.08; color: var(--ws-text); }
.won-feat-head h2 span { color: var(--ws-primary); }
.won-feat-head p { margin: 0 auto; max-width: 44rem; color: var(--ws-text-muted); font-size: var(--ws-fs-md); line-height: 1.6; }

.won-feat-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ws-s5); align-items: stretch; }
.won-feat-card { --tone: var(--ws-primary); position: relative; display: grid; grid-template-columns: minmax(7rem, 9.5rem) minmax(0, 1fr); column-gap: var(--ws-s3); align-items: center; align-content: start; padding: var(--ws-s5) var(--ws-s4) var(--ws-s4); border-radius: var(--ws-r-lg); border: 1px solid color-mix(in srgb, var(--tone) 22%, var(--ws-border)); background: linear-gradient(135deg, color-mix(in srgb, var(--tone) 17%, var(--ws-surface)), color-mix(in srgb, var(--tone) 5%, var(--ws-surface))); box-shadow: var(--ws-shadow-sm); transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur) var(--ws-ease); }
.won-feat-card:hover, .won-feat-card:focus-within { transform: translateY(-4px); box-shadow: var(--ws-shadow-lg); }
.won-feat-peach { --tone: var(--ws-orange); } .won-feat-sky { --tone: var(--ws-blue); } .won-feat-pink { --tone: var(--ws-pink); } .won-feat-mint { --tone: var(--ws-green); }
.won-feat-num { position: absolute; top: var(--ws-s3); left: var(--ws-s3); display: grid; place-items: center; min-width: 2.1rem; height: 2.1rem; padding-inline: .4rem; border-radius: var(--ws-r-md); background: var(--ws-surface); color: var(--tone); font-size: var(--ws-fs-sm); font-weight: var(--ws-fw-bold); box-shadow: var(--ws-shadow-sm); }
.won-feat-art { width: 100%; height: auto; aspect-ratio: 160 / 130; transition: transform var(--ws-dur-slow) var(--ws-ease); }
.won-feat-card:hover .won-feat-art { transform: scale(1.05) rotate(-1deg); }
.won-feat-body { padding-top: var(--ws-s4); min-width: 0; }
.won-feat h3 { margin: 0 0 var(--ws-s2); font-size: var(--ws-fs-lg); line-height: 1.2; font-weight: 800; letter-spacing: -.01em; color: var(--ws-text); }
.won-feat-body p { margin: 0 0 var(--ws-s3); color: var(--ws-text-muted); font-size: var(--ws-fs-sm); line-height: 1.5; }
.won-feat-more, .won-feat-try { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; padding: 0 1.15rem; border-radius: var(--ws-r-pill); font: inherit; font-size: var(--ws-fs-sm); font-weight: var(--ws-fw-bold); cursor: pointer; transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur) var(--ws-ease), background var(--ws-dur); }
.won-feat-more { background: var(--ws-surface) !important; color: var(--ws-primary) !important; border: 1px solid var(--ws-border) !important; box-shadow: var(--ws-shadow-sm); }
.won-feat-more:hover { transform: translateY(-1px); box-shadow: var(--ws-shadow-md); }
.won-feat-more svg { transition: transform var(--ws-dur) var(--ws-ease); }
.won-feat-more[aria-expanded="true"] svg { transform: rotate(90deg); }
.won-feat-try { background: var(--ws-gradient) !important; color: #fff !important; border: 0 !important; box-shadow: 0 6px 16px rgb(90 42 224 / .3); }
.won-feat-try:hover { transform: translateY(-1px); }
.won-feat-panel { grid-column: 1 / -1; margin-top: var(--ws-s4); padding: var(--ws-s4); border-radius: var(--ws-r-md); background: var(--ws-surface); border: 1px solid var(--ws-border); }
.won-feat-panel ul { margin: 0 0 var(--ws-s3); padding-left: 1.1rem; display: grid; gap: var(--ws-s2); color: var(--ws-text); font-size: var(--ws-fs-sm); }
.won-feat a:focus-visible, .won-feat button:focus-visible { outline: none; box-shadow: var(--ws-ring); }

@media (max-width: 1040px) { .won-feat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .won-feat-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 400px) { .won-feat-card { grid-template-columns: 1fr; } .won-feat-art { max-width: 11rem; margin-inline: auto; } .won-feat-body { padding-top: var(--ws-s2); } }
@media (prefers-reduced-motion: reduce) { .won-feat *, .won-feat *::before, .won-feat *::after { transition: none !important; } .won-feat-card:hover { transform: none; } }


.won-faq { container-type: inline-size; margin-block: var(--ws-s7); padding: var(--ws-s6) var(--ws-s5); border-radius: var(--ws-r-lg); background: linear-gradient(180deg, var(--ws-surface-2), var(--ws-bg)); border: 1px solid var(--ws-border); font-family: var(--ws-font); }
.won-faq-head { text-align: center; max-width: 44rem; margin: 0 auto var(--ws-s5); }
.won-faq-pill { display: inline-flex; align-items: center; padding: .2rem .8rem; border-radius: var(--ws-r-pill); background: var(--ws-primary-100); color: var(--ws-primary); font-size: var(--ws-fs-xs); font-weight: var(--ws-fw-bold); letter-spacing: .06em; text-transform: uppercase; }
.won-faq-head h2 { margin: var(--ws-s2) 0 0; font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 800; letter-spacing: -.02em; color: var(--ws-text); }
.won-faq .won-grad { color: var(--ws-primary); }
.won-faq-sub { margin: var(--ws-s2) 0 0; color: var(--ws-text-muted); }


.won-faq-tools { display: grid; gap: var(--ws-s3); margin-bottom: var(--ws-s4); }
.won-faq-search { max-width: 100%; box-sizing: border-box; display: flex; align-items: center; gap: var(--ws-s2); padding: .35rem .35rem .35rem var(--ws-s4); background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-pill); box-shadow: var(--ws-shadow-md); color: var(--ws-primary); }
.won-faq-search:focus-within { box-shadow: var(--ws-ring), var(--ws-shadow-md); }
.won-faq-search input { flex: 1 1 0; width: 0; min-width: 0; border: 0 !important; background: transparent !important; box-shadow: none !important; padding: .55rem .25rem !important; color: var(--ws-text); font: inherit; outline: none; }
.won-faq-search input::-webkit-search-cancel-button { display: none; }
.won-faq-go { border-radius: var(--ws-r-pill) !important; background: var(--ws-gradient) !important; color: #fff !important; border: 0 !important; padding: .6rem 1.4rem !important; min-height: 44px; font-weight: var(--ws-fw-bold); }
.won-faq-clear { background: transparent !important; color: var(--ws-text-muted) !important; border: 0 !important; padding: 0 .6rem !important; min-width: 44px; min-height: 44px; font-size: 1.4rem; line-height: 1; }
.won-faq-chips { display: flex; flex-wrap: wrap; gap: var(--ws-s2); }
.won-faq-chip { background: var(--ws-surface) !important; color: var(--ws-text) !important; border: 1px solid var(--ws-border) !important; border-radius: var(--ws-r-pill) !important; padding: .5rem 1rem !important; min-height: 44px; font-size: var(--ws-fs-sm); font-weight: var(--ws-fw-medium); box-shadow: var(--ws-shadow-sm); transition: transform var(--ws-dur) var(--ws-ease), background var(--ws-dur); }
.won-faq-chip:hover { transform: translateY(-1px); }
.won-faq-chip[aria-pressed="true"] { background: var(--ws-gradient) !important; color: #fff !important; border-color: transparent !important; }


.won-faq-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ws-s5); }
.won-faq-main, .won-faq-aside, .won-faq-tools { min-width: 0; }
@container (min-width: 760px) { .won-faq-layout { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: start; } .won-faq-aside { position: sticky; top: 5.5rem; } }
.won-faq-aside { padding: var(--ws-s5); border-radius: var(--ws-r-lg); background: linear-gradient(160deg, var(--ws-primary-100), var(--ws-surface)); border: 1px solid var(--ws-border); box-shadow: var(--ws-shadow-sm); }
.won-faq-aside-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--ws-s3); }
.won-faq-aside-top > div { flex: 1 1 100%; }
.won-faq-art { flex: 0 0 auto; width: min(100%, 13rem); height: auto; }
.won-faq-aside-title { margin: var(--ws-s2) 0 var(--ws-s2) !important; font-size: clamp(1.4rem, 3vw, 1.9rem) !important; font-weight: 800; line-height: 1.1; color: var(--ws-text); }
.won-faq-aside-title span { color: var(--ws-primary); }
.won-faq-aside p { margin: 0; color: var(--ws-text-muted); font-size: var(--ws-fs-sm); }
.won-faq-help { list-style: none; margin: var(--ws-s5) 0 0; padding: 0; display: grid; gap: var(--ws-s3); }
.won-faq-help-item { display: flex; align-items: center; gap: var(--ws-s3); padding: var(--ws-s3); background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-md); color: var(--ws-text); text-decoration: none; transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur); }
.won-faq-help-item:hover { transform: translateY(-2px); box-shadow: var(--ws-shadow-md); }
.won-faq-help-item strong { display: block; font-size: var(--ws-fs-md); }
.won-faq-help-item span span { display: block; color: var(--ws-text-muted); font-size: var(--ws-fs-sm); }
.won-faq-help-ico { flex: 0 0 auto; display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--ws-r-md); background: var(--ws-primary-100); color: var(--ws-primary); }
.won-faq-help-guides .won-faq-help-ico { background: color-mix(in srgb, var(--ws-green) 18%, transparent); color: var(--ws-green); }
.won-faq-help-help .won-faq-help-ico { background: color-mix(in srgb, var(--ws-pink) 16%, transparent); color: var(--ws-pink); }
.won-faq a:focus-visible, .won-faq button:focus-visible, .won-faq summary:focus-visible { outline: none; box-shadow: var(--ws-ring); }


.won-faq-list details { margin: 0 0 var(--ws-s3) !important; padding: 0 !important; background: var(--ws-surface) !important; border: 1px solid var(--ws-border) !important; border-radius: var(--ws-r-md) !important; box-shadow: var(--ws-shadow-sm); overflow: hidden; transition: box-shadow var(--ws-dur) var(--ws-ease), border-color var(--ws-dur); }
.won-faq-list details[open] { border-color: var(--ws-primary) !important; box-shadow: var(--ws-shadow-md); background: linear-gradient(180deg, var(--ws-primary-100), var(--ws-surface) 70%) !important; }
.won-faq-list summary { display: flex !important; align-items: center; gap: var(--ws-s3); min-height: 56px; padding: var(--ws-s3) var(--ws-s4) !important; list-style: none; cursor: pointer; font-weight: var(--ws-fw-bold) !important; color: var(--ws-text); }
.won-faq-list summary::-webkit-details-marker { display: none; }
.won-faq-list summary::after { content: ""; flex: 0 0 auto; margin-left: auto; width: .6rem; height: .6rem; border-right: 2.5px solid var(--ws-text); border-bottom: 2.5px solid var(--ws-text); transform: rotate(-45deg); transition: transform var(--ws-dur) var(--ws-ease); }
.won-faq-list details[open] > summary::after { transform: rotate(45deg); border-color: var(--ws-primary); }
.won-q { flex: 0 0 auto; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--ws-primary-100); color: var(--ws-primary); font-weight: 800; font-size: var(--ws-fs-sm); }
.won-faq-list details > :not(summary) { margin: 0 !important; padding: 0 var(--ws-s4) var(--ws-s4) calc(var(--ws-s4) + 2rem + var(--ws-s3)); color: var(--ws-text-muted); max-width: none !important; }
.won-faq-list details > p + p { padding-top: 0; }
.won-faq-list details[hidden] { display: none; }
.won-faq-empty { padding: var(--ws-s4); text-align: center; color: var(--ws-text-muted); background: var(--ws-surface); border: 1px dashed var(--ws-border); border-radius: var(--ws-r-md); }
@supports (interpolate-size: allow-keywords) { .won-faq-list details { interpolate-size: allow-keywords; } .won-faq-list details::details-content { block-size: 0; overflow: hidden; transition: block-size var(--ws-dur-slow) var(--ws-ease), content-visibility var(--ws-dur-slow) allow-discrete; } .won-faq-list details[open]::details-content { block-size: auto; } }
.won-faq.is-simple .won-faq-tools { display: none; }

@media (max-width: 640px) {
  .won-faq { padding: var(--ws-s5) var(--ws-s3); }
  .won-faq-aside-top { flex-direction: column-reverse; align-items: flex-start; }
  .won-faq-art { max-width: 9rem; }
  .won-faq-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
  .won-faq-chip { flex: 0 0 auto; }
  .won-faq-list details > :not(summary) { padding-left: var(--ws-s4); }
}


body:is([class*="single-won_"], .home) main.site-main { display: flex; flex-direction: column; }
body:is([class*="single-won_"], .home) .won-extras { order: 10; }
body:is([class*="single-won_"], .home) .won-author { order: 20; }
body:is([class*="single-won_"], .home) .won-author {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--ws-s5); align-items: center; position: relative;
  max-width: 76rem !important; width: 100%; margin: var(--ws-s6) auto; padding: var(--ws-s6); border-radius: var(--ws-r-lg);
  background: linear-gradient(120deg, var(--ws-primary-100), var(--ws-surface-2) 80%); border: 1px solid var(--ws-border); box-shadow: var(--ws-shadow-md);
}
body:is([class*="single-won_"], .home) .won-author-img { width: 120px; height: 120px; border-radius: 50%; border: 4px solid var(--ws-surface); box-shadow: 0 0 0 3px var(--ws-primary), 0 10px 30px rgb(109 59 245 / .35); }
body:is([class*="single-won_"], .home) .won-author-badge { display: inline-block; margin-bottom: var(--ws-s2); padding: .2rem .8rem; border-radius: var(--ws-r-pill); background: var(--ws-surface); color: var(--ws-primary); border: 1px solid var(--ws-border); font-size: var(--ws-fs-xs); font-weight: var(--ws-fw-bold); letter-spacing: .06em; text-transform: uppercase; }
body:is([class*="single-won_"], .home) .won-author h2 { margin: 0 0 var(--ws-s2); font-size: var(--ws-fs-md); color: var(--ws-text-muted); font-weight: var(--ws-fw-medium); }
body:is([class*="single-won_"], .home) .won-author-name { margin: 0 !important; font-size: var(--ws-fs-lg); color: var(--ws-text); }
body:is([class*="single-won_"], .home) .won-author-main p { color: var(--ws-text-muted); }
body:is([class*="single-won_"], .home) .won-author-side { grid-column: 1 / -1; display: grid; gap: var(--ws-s3); padding-top: var(--ws-s4); border-top: 1px solid var(--ws-border); }
body:is([class*="single-won_"], .home) .won-author-focus-title { margin: 0; font-size: var(--ws-fs-xs); font-weight: var(--ws-fw-bold); letter-spacing: .06em; text-transform: uppercase; color: var(--ws-primary); }
body:is([class*="single-won_"], .home) .won-author-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--ws-s2); }
body:is([class*="single-won_"], .home) .won-author-chips li { padding: .35rem .8rem; border-radius: var(--ws-r-pill); background: var(--ws-surface); border: 1px solid var(--ws-border); color: var(--ws-text); font-size: var(--ws-fs-sm); }
body:is([class*="single-won_"], .home) .won-author-social { margin: 0; }
body:is([class*="single-won_"], .home) .won-author-social .won-social-link { background: var(--ws-surface); color: var(--ws-primary); border-color: var(--ws-border); }
body:is([class*="single-won_"], .home) .won-author-social .won-social-link:hover { background: var(--ws-primary); color: #fff; }
@media (min-width: 900px) {
  body:is([class*="single-won_"], .home) .won-author { grid-template-columns: auto minmax(0, 1.4fr) minmax(0, 1fr); }
  body:is([class*="single-won_"], .home) .won-author-side { grid-column: auto; border-top: 0; padding: 0 0 0 var(--ws-s5); border-left: 1px solid var(--ws-border); }
}
@media (max-width: 640px) {
  body:is([class*="single-won_"], .home) .won-author { grid-template-columns: 1fr; text-align: left; padding: var(--ws-s5) var(--ws-s4); }
  body:is([class*="single-won_"], .home) .won-author-img { width: 96px; height: 96px; }
}
@media (prefers-reduced-motion: reduce) { .won-faq *, .won-faq *::before, .won-faq *::after { transition: none !important; } }

@media (max-width: 420px) { .won-faq-go { padding: .6rem 1rem !important; } .won-faq-search { padding-left: var(--ws-s3); } }


.won-rel { background: var(--ws-bg); border-top: 1px solid var(--ws-border); margin-top: var(--ws-s7); padding: var(--ws-s7) 0; font-family: var(--ws-font); color: var(--ws-text); }
.won-rel-inner > *, .won-rel-block { min-width: 0; }
.won-rel-inner { width: min(100% - 2rem, 76rem); margin-inline: auto; display: grid; gap: var(--ws-s7); }


.won-rel-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--ws-s4); flex-wrap: wrap; margin-bottom: var(--ws-s5); }
.won-rel-eyebrow { display: inline-block; margin: 0 0 var(--ws-s2); padding: .2rem .65rem; border-radius: var(--ws-r-pill); background: var(--ws-primary-100); color: var(--ws-primary); font-size: var(--ws-fs-xs); font-weight: var(--ws-fw-bold); letter-spacing: .06em; text-transform: uppercase; }
.won-rel h2 { margin: 0; font-size: clamp(1.7rem, 3.4vw, 2.4rem); line-height: 1.1; font-weight: 800; letter-spacing: -.02em; color: var(--ws-text); }
.won-rel h2 span { color: var(--ws-primary); }
.won-rel-lead { margin: var(--ws-s2) 0 0; color: var(--ws-text-muted); font-size: var(--ws-fs-sm); max-width: 38rem; }
.won-rel-actions { display: flex; align-items: center; gap: var(--ws-s3); flex-wrap: wrap; }
.won-rel-all, .won-rel-shuffle { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; padding: 0 1.1rem; border-radius: var(--ws-r-pill); font: inherit; font-size: var(--ws-fs-sm); font-weight: var(--ws-fw-medium); text-decoration: none; cursor: pointer; transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur) var(--ws-ease), background var(--ws-dur); }
.won-rel-all { background: var(--ws-primary-100); color: var(--ws-primary); border: 1px solid transparent; }
.won-rel-shuffle { background: var(--ws-surface); color: var(--ws-text); border: 1px solid var(--ws-border); box-shadow: var(--ws-shadow-sm); }
.won-rel-all:hover, .won-rel-shuffle:hover { transform: translateY(-1px); box-shadow: var(--ws-shadow-md); }
.won-rel-shuffle:active svg { transform: rotate(180deg); }
.won-rel-shuffle svg { transition: transform var(--ws-dur-slow) var(--ws-ease); }


.won-rel-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ws-s5); transition: opacity var(--ws-dur) var(--ws-ease), transform var(--ws-dur) var(--ws-ease); }
.won-rel-grid.is-swapping { opacity: 0; transform: translateY(6px); }
.won-rel-card { position: relative; display: flex; flex-direction: column; background: var(--ws-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-r-lg); box-shadow: var(--ws-shadow-sm); overflow: hidden; transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur) var(--ws-ease); }
.won-rel-card:hover, .won-rel-card:focus-within { transform: translateY(-4px); box-shadow: var(--ws-shadow-lg); }
.won-rel-media { position: relative; aspect-ratio: 8 / 5; overflow: hidden; background: var(--ws-primary-100); }
.won-rel-media > svg, .won-rel-media > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform var(--ws-dur-slow) var(--ws-ease); }
.won-rel-card:hover .won-rel-media > svg, .won-rel-card:hover .won-rel-media > img { transform: scale(1.04); }
.won-rel-num, .won-rel-tag { position: absolute; z-index: 1; top: var(--ws-s3); font-size: var(--ws-fs-xs); font-weight: var(--ws-fw-bold); }
.won-rel-num { left: var(--ws-s3); display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: var(--ws-r-md); background: var(--ws-surface); color: var(--ws-primary); box-shadow: var(--ws-shadow-sm); }
.won-rel-tag { right: var(--ws-s3); padding: .25rem .7rem; border-radius: var(--ws-r-pill); background: var(--ws-primary); color: #fff; }
.won-rel-body { display: flex; flex-direction: column; gap: var(--ws-s3); flex: 1; padding: var(--ws-s4) var(--ws-s4) var(--ws-s5); }
.won-rel h3.won-rel-title { margin: 0; font-size: var(--ws-fs-lg); line-height: 1.2; font-weight: 800; letter-spacing: -.01em; }
.won-rel-title a { color: var(--ws-text); text-decoration: none; }
.won-rel-title a::after { content: ""; position: absolute; inset: 0; z-index: 2; } 
.won-rel-desc { margin: 0; color: var(--ws-text-muted); font-size: var(--ws-fs-sm); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.won-rel-badges { list-style: none; margin: auto 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--ws-s2); }
.won-rel-badges li { padding: .3rem .65rem; border-radius: var(--ws-r-md); background: var(--ws-surface-2); border: 1px solid var(--ws-border); color: var(--ws-text); font-size: var(--ws-fs-xs); font-weight: var(--ws-fw-medium); }


.won-rel-cta { position: relative; z-index: 3; display: flex; align-items: center; justify-content: center; gap: .5rem; min-height: 46px; padding: 0 1.4rem; border-radius: var(--ws-r-md); background: var(--ws-gradient); color: #fff !important; font-weight: var(--ws-fw-bold); text-decoration: none; box-shadow: 0 6px 16px rgb(90 42 224 / .35); transition: transform var(--ws-dur) var(--ws-ease), box-shadow var(--ws-dur) var(--ws-ease); }
.won-rel-cta:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgb(90 42 224 / .45); }
.won-rel-foot { display: flex; align-items: center; justify-content: space-between; gap: var(--ws-s3); margin-top: auto; padding-top: var(--ws-s2); }
.won-rel-read { color: var(--ws-text-muted); font-size: var(--ws-fs-sm); }
.won-rel-link { position: relative; z-index: 3; display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; color: var(--ws-primary); font-weight: var(--ws-fw-bold); font-size: var(--ws-fs-sm); text-decoration: none; }
.won-rel-link:hover { text-decoration: underline; }
.won-rel a:focus-visible, .won-rel button:focus-visible { outline: none; box-shadow: var(--ws-ring); border-radius: var(--ws-r-md); }


.won-rel-banner { display: flex; align-items: center; justify-content: space-between; gap: var(--ws-s5); flex-wrap: wrap; padding: var(--ws-s6) var(--ws-s6); border-radius: var(--ws-r-lg); border: 1px solid var(--ws-border); background: linear-gradient(120deg, var(--ws-primary-100), var(--ws-surface-2) 70%); }
.won-rel-banner h2 { font-size: clamp(1.5rem, 3vw, 2rem); }
.won-rel-banner p:not(.won-rel-eyebrow) { margin: var(--ws-s2) 0 0; max-width: 36rem; color: var(--ws-text-muted); }
.won-rel-banner .won-rel-cta { flex: 0 0 auto; padding-inline: 2rem; }


@media (max-width: 960px) {
  .won-rel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .won-rel-grid > :nth-child(3) { grid-column: 1 / -1; }
  .won-rel-grid > :nth-child(3) .won-rel-media { aspect-ratio: 16 / 7; }
}

@media (max-width: 640px) {
  .won-rel { padding: var(--ws-s6) 0; }
  .won-rel-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: var(--ws-s4); padding-bottom: var(--ws-s3); margin-inline: -1rem; padding-inline: 1rem; scroll-padding-inline: 1rem; -webkit-overflow-scrolling: touch; }
  .won-rel-grid > * { flex: 0 0 86%; scroll-snap-align: start; }
  .won-rel-grid > :nth-child(3) .won-rel-media { aspect-ratio: 8 / 5; }
  .won-rel-banner { padding: var(--ws-s5); }
  .won-rel-banner .won-rel-cta { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .won-rel *, .won-rel *::before, .won-rel *::after { transition: none !important; animation: none !important; }
  .won-rel-card:hover { transform: none; }
}

