/* The front door to Revolution: deep teal, warm paper, and simple teaching art. */
body[data-page='home'] { --home-ink:#f0eddf; --home-muted:#a9b8b2; --home-gold:#d2b77b; --home-mint:#b4dfc9; --home-line:#c7d9bb22; background:#091c21; color:var(--home-ink); }
body[data-page='home'] .site-header { max-width:1440px; padding:22px 5%; border-color:var(--home-line); color:var(--home-ink); }
body[data-page='home'] .brand-seal { background:#284347; color:#e4ce94; border:1px solid #b0b69b40; }
body[data-page='home'] .wordmark { color:#eeeede; font-size:16px; }
body[data-page='home'] .wordmark small { color:#a9bcb3; }
body[data-page='home'] .header-right { gap:12px; }
body[data-page='home'] .header-right .feel-toggle,body[data-page='home'] .layout-toggle { color:#d3dfd3; background:#162d33; border-color:#a5b69b30; }
body[data-page='home'] .header-right .text-button { color:#c7d7c9; }
body[data-page='home'] #table-menu { background:#11292e; border-color:#a5b69b30; }
body[data-page='home'] .site-footer { border-color:var(--home-line); color:#a3b6aa; padding:26px 5%; }
body[data-page='home'] dialog { color:#29352c; }
.home-page { max-width:1440px; margin:auto; padding:0 5%; }
.home-page h1,.home-page h2,.home-page h3 { font-family:Georgia,'Times New Roman',serif; font-weight:400; }
.home-page button,.home-page a { -webkit-tap-highlight-color:transparent; }
.home-page button:focus-visible,.home-page a:focus-visible { outline:3px solid #d8b974; outline-offset:5px; }
.home-kicker { display:block; font:700 10px/1.5 var(--sans,system-ui,sans-serif); letter-spacing:2px; color:var(--home-gold); }
.home-star { font-size:16px; vertical-align:-1px; padding-right:8px; }
.home-hero { padding:52px 0 62px; display:grid; grid-template-columns:minmax(0,1.18fr) minmax(320px,.72fr); grid-template-areas:'lead play' 'art play'; gap:30px 7%; align-items:center; }
.home-lead { grid-area:lead; align-self:end; }
.home-lead h1 { margin:19px 0 21px; color:#f5f0df; font-size:clamp(58px,6.5vw,89px); line-height:.94; letter-spacing:-3.7px; }
.home-lead h1 em { font-style:italic; color:var(--home-mint); }
.home-intro { margin:0; max-width:420px; color:#bcc8be; font-size:14px; line-height:1.75; }
.home-facts { display:flex; flex-wrap:wrap; gap:20px; list-style:none; padding:0; margin:24px 0 0; color:#b0c1b5; font-size:11px; }
.home-facts li { position:relative; }
.home-facts li+li:before { content:''; position:absolute; width:3px; height:3px; border-radius:50%; background:#839184; left:-12px; top:6px; }
.home-facts b { font-weight:650; color:#e4e7d6; }
.home-showcase { grid-area:art; width:100%; position:relative; margin:0; overflow:hidden; border-radius:6px 36px 6px 6px; border:1px solid #adbd9240; height:280px; background:#0b1b20; isolation:isolate; }
.home-showcase:after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(transparent 40%,#07171cbd); }
.home-showcase img { width:100%; height:100%; object-fit:contain; object-position:center; display:block; padding-bottom:30px; }
.home-showcase figcaption { position:absolute; z-index:2; bottom:22px; left:25px; right:25px; display:flex; align-items:center; justify-content:space-between; gap:14px; color:#e6e8d7; }
.home-showcase figcaption span:first-child { font-size:8px; letter-spacing:1.8px; font-weight:700; }
.home-showcase figcaption span:last-child { font:italic 22px Georgia,serif; }
.home-art-mark { position:absolute; top:18px; left:22px; z-index:2; color:#eed9a4; font:italic 29px Georgia,serif; text-shadow:0 2px 8px #092229; }
.home-page .home-play-panel { grid-area:play; align-self:center; color:#233a34; padding:28px 30px 24px; border:1px solid #ded4b7; border-radius:11px; background:linear-gradient(130deg,#f2ecdc,#e7e5d8); box-shadow:0 28px 55px #03121566,inset 0 0 0 5px #ffffff21; }
.home-panel-top { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:19px; }
.home-play-panel .home-kicker { color:#6d7054; font-size:9px; letter-spacing:1.6px; }
.home-panel-seal { border:1px solid #a7a081; width:29px; height:33px; border-radius:3px 3px 10px 10px; font:italic 22px Georgia,serif; display:grid; place-items:center; color:#7c744d; }
.home-play-panel h2 { color:#263a34; font-size:43px; line-height:.98; letter-spacing:-1.6px; margin:0 0 14px; }
.home-play-panel .home-panel-intro { color:#687362; font-size:12px; line-height:1.65; margin:0 0 24px; max-width:310px; }
.home-play-panel .field-label { color:#596750; font-size:9px; letter-spacing:1.3px; }
.home-play-panel input { background:#fffdf4; color:#243a34; border:1px solid #bec2ac; min-height:47px; font-size:13px; border-radius:5px; padding:13px 12px; }
.home-play-panel input::placeholder { color:#7b8270; opacity:1; }
.home-play-panel input:focus { border-color:#417968; box-shadow:0 0 0 3px #41796820; }
.home-play-panel .setup-actions { margin-top:12px; gap:8px; }
.home-play-panel .setup-actions .button { min-height:48px; font-size:12px; border-radius:5px; }
.home-play-panel .button.primary { background:#244b42; color:#f1ecd9; border-color:#244b42; box-shadow:0 3px 0 #153c32; justify-content:space-between; }
.home-play-panel .button.primary:hover:not(:disabled) { background:#305d50; }
.home-play-panel .button.primary span { font-size:18px; line-height:1; color:#b5d9ba; }
.home-play-panel .button.outline { background:#e1e5d8; color:#364e40; border-color:#a8b79d; }
.home-play-panel .button.outline:hover:not(:disabled) { background:#d5dfcc; }
.home-practice-mark { color:#718360; font-size:18px; }
.home-play-panel .divider { font-size:8px; letter-spacing:1.25px; color:#69745f; margin:22px 0 13px; }
.home-play-panel .divider:before,.home-play-panel .divider:after { background:#b7bca688; }
.home-play-panel .join-row { grid-template-columns:minmax(0,1fr) auto; gap:7px; }
.home-play-panel .join-row input { min-width:0; font-size:12px; letter-spacing:2px; }
.home-play-panel .button.dark { padding:11px 14px; min-height:47px; font-size:11px; background:#d5dbcb; border-color:#adb89f; color:#304a3c; gap:12px; }
.home-play-panel .button.dark:hover:not(:disabled) { background:#c8d4bf; }
.home-play-note { font-size:10px; line-height:1.6; color:#738069; text-align:center; margin:13px 0 0; }
.home-play-divider { height:1px; background:#b7bca688; margin:21px 0 17px; }
.home-rule-link { display:inline-flex; align-items:center; justify-content:space-between; gap:18px; padding:0; background:none; border:0; color:#c5dacb; font:600 11px/1.5 var(--sans,system-ui,sans-serif); cursor:pointer; text-align:left; }
.home-rule-link span { font-size:18px; font-weight:400; }
.home-rule-link:hover { color:#f2dfad; }
.home-play-panel .home-rule-link { width:100%; font-size:10px; color:#53694e; }
.home-play-panel .home-rule-link:hover { color:#1d4e3c; }
.home-play-panel .home-resume { display:flex; justify-content:space-between; width:100%; font-size:11px; color:#325c45; margin-top:12px; padding:9px 0 0; }
.home-primer { border-top:1px solid var(--home-line); padding-top:59px; }
.home-section-heading { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:29px; }
.home-section-heading h2 { font-size:clamp(36px,4.5vw,58px); letter-spacing:-1.7px; line-height:1.03; margin:16px 0 0; color:#f1ead9; }
.home-section-heading h2 em { font-style:italic; color:#b8cdbd; }
.home-section-heading>p { max-width:300px; color:#a9beb0; font-size:12px; line-height:1.8; margin-bottom:3px; }
.home-secret-intro { display:flex; gap:29px; align-items:center; padding:23px 0 31px; margin-bottom:9px; }
.home-secret-cards { width:90px; min-width:90px; height:80px; position:relative; }
.home-secret-cards span { position:absolute; width:48px; height:66px; border:1px solid #82987b; border-radius:4px; display:grid; place-items:center; color:#b6c7a5; font:italic 31px Georgia,serif; background:repeating-linear-gradient(45deg,#1a3b3e 0 2px,#183538 2px 6px); box-shadow:inset 0 0 0 4px #1b3739,inset 0 0 0 5px #83966c77,0 7px 14px #020e1744; }
.home-secret-cards span:first-child { left:8px; top:6px; transform:rotate(-14deg); }
.home-secret-cards span:last-child { left:36px; top:8px; transform:rotate(13deg); }
.home-step { display:block; font-size:8px; letter-spacing:1.55px; font-weight:700; color:#a6b68e; }
.home-secret-intro h3 { font-size:26px; color:#e6e5d2; margin:8px 0 7px; letter-spacing:-.6px; }
.home-secret-intro p { color:#9cb2a3; font-size:12px; line-height:1.75; margin:0; max-width:620px; }
.home-rule-scene { display:grid; grid-template-columns:1.06fr 1fr; border:1px solid #9ba88a28; border-radius:8px; overflow:hidden; background:#11292e; margin-bottom:22px; min-height:320px; }
.home-rule-picture { position:relative; overflow:hidden; min-height:360px; }
.home-rule-picture:after { content:''; position:absolute; inset:0; background:linear-gradient(transparent 60%,#07171ab8); pointer-events:none; }
.home-rule-picture img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:center top; display:block; }
.home-scene-label { position:absolute; left:25px; right:25px; bottom:23px; z-index:1; color:#ebe6cf; font-size:9px; font-weight:700; letter-spacing:1.75px; display:flex; align-items:center; justify-content:space-between; gap:15px; }
.home-scene-label i { font-style:normal; letter-spacing:1px; font-size:8px; color:#e1d4a6; padding:7px 9px; border:1px solid #d3c88c55; border-radius:3px; background:#1a302aa3; }
.home-rule-copy { align-self:center; padding:34px 40px; }
.home-rule-copy h3 { font-size:43px; line-height:1.05; margin:15px 0 15px; letter-spacing:-1.3px; color:#e9e5ce; }
.home-rule-copy>p { font-size:12px; line-height:1.8; color:#adbcac; max-width:350px; margin:0; }
.home-example { display:flex; gap:13px; border-top:1px solid #aabc982e; margin-top:24px; padding-top:18px; }
.home-example-icon { width:24px; height:28px; flex:none; display:grid; place-items:center; color:#c3b37b; font:italic 27px Georgia,serif; }
.home-example strong { display:block; color:#ced7c4; font-size:11px; font-weight:600; margin-bottom:6px; }
.home-example div>span { display:block; color:#94ad9d; font-size:10px; line-height:1.7; }
.home-rule-block { grid-template-columns:1fr 1.06fr; }
.home-rule-block .home-rule-picture { grid-column:2; grid-row:1; }
.home-rule-block .home-rule-copy { grid-column:1; grid-row:1; }
.home-rule-block .home-rule-copy h3 { color:#d4d8e3; }
.home-rule-block .home-step { color:#a5a6bc; }
.home-rule-block .home-example-icon { color:#bcb2d3; }
.home-coup-note { display:grid; grid-template-columns:53px minmax(0,1fr) auto; gap:25px; align-items:center; margin:30px 0 58px; padding:24px 0; border-bottom:1px solid var(--home-line); }
.home-coup-mark { width:52px; height:52px; border:1px solid #a49a7055; background:#a8975b10; border-radius:50%; color:#c1ae77; font:italic 28px Georgia,serif; display:grid; place-items:center; box-shadow:inset 0 0 0 5px #091c21,inset 0 0 0 6px #a49a7030; }
.home-coup-note h3 { color:#d5d9c7; font-family:var(--sans,system-ui,sans-serif); font-size:12px; font-weight:600; letter-spacing:0; margin:9px 0 7px; }
.home-coup-note p { color:#8da798; font-size:11px; line-height:1.8; margin:0; max-width:675px; }
.home-coup-note>.home-rule-link { margin-left:20px; font-size:10px; white-space:nowrap; }
.home-closing { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:0 0 68px; }
.home-closing h2 { color:#e8e9d7; font-size:44px; letter-spacing:-1.2px; margin:13px 0; }
.home-closing p { color:#94ac9d; font-size:12px; margin:0; }
.home-back-to-play { color:#cee3c9; border-color:#78987b70; background:#1c3a38; min-width:170px; font-size:12px; justify-content:space-between; }
.home-back-to-play:hover { background:#294e45!important; }
.home-invited .home-play-panel { border-color:#b8cbb0; box-shadow:0 20px 60px #020d1866,0 0 36px #a7d5a60b; }
.home-invited .home-play-panel .button.dark { background:#244b42; color:#f1ecd9; border-color:#244b42; }
.home-invited .home-play-panel .join-row { grid-template-columns:1fr; }
.home-invited .home-play-panel .join-row .button { min-height:49px; font-size:13px; justify-content:space-between; }
@media(min-width:1450px){.home-hero{gap:35px 9%;}.home-showcase{height:300px;}}
@media(max-width:1000px){
  .home-hero { grid-template-columns:minmax(0,1fr) minmax(300px,.85fr); gap:25px 5%; padding-top:39px; }
  .home-lead h1 { font-size:64px; letter-spacing:-2.6px; }
  .home-play-panel h2 { font-size:38px; }
  .home-page .home-play-panel { padding:25px 24px 22px; }
  .home-showcase { height:250px; }
  .home-showcase figcaption { bottom:18px; left:18px; right:18px; flex-wrap:wrap; gap:8px; }
  .home-showcase figcaption span:last-child { font-size:19px; }
  .home-rule-copy { padding:29px; }
  .home-rule-copy h3 { font-size:37px; }
  .home-coup-note { gap:18px; grid-template-columns:45px minmax(0,1fr); }
  .home-coup-mark { width:43px; height:43px; }
  .home-coup-note>.home-rule-link { grid-column:2; margin-left:0; justify-content:start; }
}
@media(max-width:700px){
  body[data-page='home'] .site-header { padding:15px 5%; }
  body[data-page='home'] .wordmark { font-size:13px; letter-spacing:1.5px; gap:8px; }
  body[data-page='home'] .wordmark small { display:none; }
  body[data-page='home'] .brand-seal { width:28px; height:33px; font-size:23px; }
  body[data-page='home'] .header-right { gap:5px; }
  body[data-page='home'] .header-right .feel-toggle,body[data-page='home'] .layout-toggle { min-height:33px; padding:6px 8px; font-size:9px; }
  body[data-page='home'] #theme-open { max-width:100px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  body[data-page='home'] .site-footer { font-size:8px; letter-spacing:1px; gap:12px; }
  body[data-page='home'] .site-footer span:nth-child(2) { font-size:13px; }
  .home-page { padding:0 5%; }
  .home-hero { display:flex; flex-direction:column; align-items:stretch; gap:20px; padding:24px 0 38px; }
  .home-lead { order:0; align-self:auto; position:relative; }
  .home-lead h1 { font-size:54px; line-height:.94; letter-spacing:-2.2px; margin:14px 0; }
  .home-lead h1 br:nth-child(2) { display:none; }
  .home-lead h1 em { display:block; }
  .home-intro { font-size:12px; line-height:1.7; max-width:310px; }
  .home-kicker { font-size:9px; letter-spacing:1.6px; }
  .home-facts { gap:23px; margin-top:14px; font-size:10px; }
  .home-facts li+li:before { left:-13px; top:5px; }
  .home-page .home-play-panel { order:1; align-self:auto; width:100%; padding:20px 24px; border-radius:9px; }
  .home-play-panel h2 { font-size:32px; line-height:1; margin-bottom:12px; }
  .home-play-panel h2 br { display:none; }
  .home-panel-top { display:none; }
  .home-play-panel .home-panel-intro { font-size:11px; margin-bottom:14px; }
  .home-play-panel .setup-actions .button,.home-play-panel .button.dark { font-size:12px; min-height:47px; }
  .home-play-panel input { font-size:16px; }
  .home-play-panel .join-row input { font-size:16px; }
  .home-play-panel .divider { margin-top:20px; }
  .home-play-divider { margin:18px 0 15px; }
  .home-showcase { order:2; height:250px; border-radius:5px 27px 5px 5px; }
  .home-showcase figcaption { flex-wrap:nowrap; left:18px; right:18px; }
  .home-showcase figcaption span:first-child { font-size:7px; letter-spacing:1px; }
  .home-showcase figcaption span:last-child { font-size:18px; }
  .home-primer { padding-top:33px; }
  .home-section-heading { display:block; margin-bottom:17px; }
  .home-section-heading h2 { font-size:37px; letter-spacing:-1.25px; margin-top:14px; }
  .home-section-heading>p { margin:17px 0 0; font-size:11px; line-height:1.75; max-width:330px; }
  .home-secret-intro { gap:20px; padding:16px 0 28px; }
  .home-secret-cards { width:63px; min-width:63px; height:72px; }
  .home-secret-cards span { width:39px; height:55px; font-size:25px; }
  .home-secret-cards span:first-child { left:1px; }
  .home-secret-cards span:last-child { left:23px; }
  .home-secret-intro .home-step { font-size:7px; letter-spacing:.9px; }
  .home-secret-intro h3 { font-size:24px; margin:7px 0; }
  .home-secret-intro p { font-size:11px; line-height:1.65; }
  .home-rule-scene,.home-rule-block { display:flex; flex-direction:column; margin-bottom:18px; border-radius:7px; }
  .home-rule-picture { min-height:225px; height:225px; }
  .home-rule-copy { padding:26px 23px; }
  .home-rule-copy h3 { font-size:36px; margin:13px 0; }
  .home-rule-copy>p { font-size:11px; }
  .home-example { margin-top:20px; padding-top:16px; }
  .home-example strong { font-size:10px; }
  .home-example div>span { font-size:10px; }
  .home-scene-label { left:20px; right:20px; bottom:18px; font-size:8px; letter-spacing:1.2px; }
  .home-scene-label i { font-size:7px; padding:6px 8px; letter-spacing:.6px; }
  .home-coup-note { padding:13px 0 28px; margin:24px 0 32px; gap:16px; }
  .home-coup-note h3 { font-size:12px; line-height:1.5; }
  .home-coup-note p { font-size:10px; }
  .home-coup-mark { align-self:start; margin-top:3px; }
  .home-coup-note .home-step { font-size:7px; letter-spacing:1px; }
  .home-closing { display:block; padding:0 0 38px; }
  .home-closing h2 { font-size:34px; letter-spacing:-1px; }
  .home-closing p { font-size:11px; }
  .home-back-to-play { margin-top:20px; min-width:170px; }
  .home-invited .home-hero { padding-top:27px; }
  .home-invited .home-lead h1 { font-size:47px; margin-bottom:0; }
  .home-invited .home-intro,.home-invited .home-facts { display:none; }
}
@media(max-width:370px){
  .home-lead h1 { font-size:54px; }
  .home-page .home-play-panel { padding:21px 19px; }
  .home-rule-picture { min-height:205px; height:205px; }
  .home-showcase { height:230px; }
  body[data-page='home'] .wordmark { font-size:11px; }
  body[data-page='home'] .layout-toggle { font-size:8px; padding:6px; }
  body[data-page='home'] #theme-open { max-width:82px; }
}
@media(prefers-reduced-motion:reduce){.home-page * { scroll-behavior:auto!important; transition:none!important; }}
html[data-motion='reduced'] .home-page * { scroll-behavior:auto!important; transition:none!important; }
/* The primer now teaches with large subjects and one short idea per panel. */
.home-mechanics-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.home-mechanics-grid .home-rule-scene { display:flex; flex-direction:column; margin:0; min-height:0; background:#10292e; }
.home-mechanics-grid .home-rule-picture { width:100%; height:auto; min-height:0; aspect-ratio:3/2; }
.home-mechanics-grid .home-rule-picture:after { display:none; }
.home-mechanics-grid .home-rule-picture img { object-fit:contain; }
.home-mechanics-grid .home-rule-copy { align-self:stretch; padding:24px 28px 27px; border-top:1px solid #9ba88a22; }
.home-mechanics-grid .home-rule-copy h3 { font-size:35px; margin:11px 0; }
.home-mechanics-grid .home-rule-copy>p { font-size:13px; line-height:1.65; min-height:44px; }
.home-mechanics-grid .home-rule-link { margin-top:21px; font-size:12px; min-height:32px; }
.home-section-heading>.home-rule-link { margin-bottom:5px; }
.home-coup-note h3 { font:400 24px Georgia,serif; }
.home-coup-note p { font-size:13px; }
@media(max-width:700px){
 .home-mechanics-grid { grid-template-columns:1fr; gap:18px; }
 .home-mechanics-grid .home-rule-copy { padding:22px; }
 .home-mechanics-grid .home-rule-copy h3 { font-size:32px; }
 .home-mechanics-grid .home-rule-copy>p { min-height:0; }
 .home-section-heading>.home-rule-link { margin-top:20px; }
 .home-coup-note h3 { font-size:22px; }
 .home-coup-note p { font-size:12px; }
 .home-showcase { height:auto; aspect-ratio:1.65; }
 .home-showcase img { padding-bottom:27px; }
}