.home{min-height:100dvh;background:radial-gradient(ellipse at 78% 35%,#e6dfcc70,transparent 55%),var(--marble);display:flex;flex-direction:column}.home .mast{max-width:1280px;width:100%;margin:auto;padding:26px 48px;box-sizing:border-box}.home .mast nav{display:flex;gap:24px}.home #home{flex:1;width:100%;max-width:1280px;margin:auto}.home-hero{min-height:510px;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:28px;padding:30px 48px}.home h1{font-family:var(--display);font-weight:400;font-size:56px;line-height:1.08;letter-spacing:-.02em;margin:16px 0 24px}.home-intro{font-size:17px;line-height:1.7;color:var(--ink-2)}.home-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}.gate-note{font-size:12px;color:var(--ink-2);margin:12px 0 20px}.text-link{background:none;border:0;padding:0;text-align:left;font-size:13px;color:var(--ink-2);box-shadow:none}.home-scene{height:455px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.home-god{height:275px;margin-bottom:18px}.home-god img{width:250px;height:100%;object-fit:contain;animation:jupiter-idle 6s ease-in-out infinite}.home-generals{display:flex;align-items:flex-end;justify-content:center;width:100%;height:160px}.home-generals img{width:26%;height:155px;object-fit:contain;margin:0 -4px}.home #home-status{text-align:center;min-height:20px;margin:8px 20px;font-size:13px}.home .front-footer{margin-top:auto;padding:20px;font-size:12px;color:var(--ink-2)}.home-panel,.tutorial-shell{max-width:900px;padding:25px 28px 35px;margin:auto}.home-panel h1{font-size:40px}.start-options{display:grid;grid-template-columns:1fr 1fr;gap:20px}.start-options article{padding:25px;background:#fff8;border:1px solid #d7d0c4;border-radius:16px}.home h2{font:24px var(--display);margin:0 0 12px}.home-panel p{line-height:1.6;color:var(--ink-2)}.home-panel form{display:grid;gap:15px;margin-top:24px}.home-panel label{display:grid;gap:7px;font-size:13px}.home-panel input,.home-panel select{width:100%;box-sizing:border-box}.lobby-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.join-name{max-width:300px;margin-bottom:28px}.lobby-row{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #d7d0c4;padding:22px 0}.lobby-row h2{font-size:24px}.lobby-row p{margin:4px 0}.lobby-row small{color:var(--ink-2)}.no-tables{padding:30px 0}.waiting-panel{text-align:center}.waiting-panel>.text-link{display:block}.waiting-art{height:220px}.waiting-art img{height:100%;object-fit:contain}.tutorial-shell{max-width:820px}.tutorial-progress{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.12em;margin:20px 0 9px}.tutorial-shell progress{display:block;width:100%;height:4px;accent-color:var(--red);border:0}.lesson{display:grid;grid-template-columns:35% 1fr;align-items:center;gap:26px;background:#fff9;border:1px solid #d7d0c4;border-radius:18px;padding:32px;margin:25px 0 20px;min-height:340px;box-sizing:border-box;outline:none}.lesson h1{font-size:38px;margin:0 0 20px}.lesson p{font-size:15px;line-height:1.65;color:var(--ink-2);margin:14px 0 0}.lesson p.lesson-lead{font-size:20px;line-height:1.45;color:var(--ink)}.lesson-art img{width:100%;height:265px;object-fit:contain}.lesson-nav{display:flex;justify-content:space-between}.home button:disabled{opacity:.4;cursor:not-allowed}.home button:focus-visible,.home a:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
@media(max-width:760px){.home .mast{padding:20px}.home .mast .wm{font-size:19px}.home .mast nav{gap:14px;font-size:12px}.home-hero{display:flex;flex-direction:column;padding:15px 24px;gap:10px;min-height:0}.home h1{font-size:40px}.home-intro{font-size:15px}.home-actions{gap:8px}.home-actions button{font-size:13px;padding:11px 13px}.home-scene{height:250px;width:100%;max-width:330px}.home-god{height:148px;margin-bottom:12px}.home-god img{width:165px}.home-generals{height:100px}.home-generals img{height:110px}.home-panel,.tutorial-shell{padding:15px 20px 25px}.start-options{grid-template-columns:1fr}.home-panel h1{font-size:32px}.lesson{grid-template-columns:1fr;padding:22px;gap:10px;margin:18px 0;min-height:0}.lesson-art{height:140px}.lesson-art img{height:140px}.lesson h1{font-size:29px;margin:5px 0 12px}.lesson p.lesson-lead{font-size:18px}.lesson p{font-size:14px;line-height:1.55}.lobby-heading{align-items:flex-start}.lobby-heading button{margin-top:24px}.tutorial-progress{margin-top:18px}.waiting-art{height:180px}}
@media(prefers-reduced-motion:reduce){.home-god img{animation:none}}

.tutorial-shell progress::-webkit-progress-bar{background:#C7D2DC;border-radius:2px}.tutorial-shell progress::-webkit-progress-value{background:var(--bolt);border-radius:2px}
/* Short lessons with real card faces and a small, isolated practice board. */
.lesson-copy{min-width:0}.lesson ul{padding-left:20px;margin:16px 0 0;color:var(--ink-2);font-size:15px;line-height:1.5}.lesson li+li{margin-top:10px}.lesson p.practice-note{font-size:11px;color:var(--ink-2)}
.mission-example{position:relative;height:290px;width:220px;margin:auto}.lesson-art .mission-example-back{position:absolute;width:162px;height:245px;left:0;top:16px;transform:rotate(-12deg)}
.mission-example>.card{position:absolute;right:0;top:12px;transform:none;--cw:170px;width:170px;height:260px;grid-template-rows:minmax(0,1fr) 22px 61px;padding-bottom:25px;--card-title:16px;--card-body:11px;--card-meta:9px;--card-stat:18px;--card-icon:18px}.mission-example .card-art img{width:100%;height:100%}
.draft-example{display:grid;text-align:center;justify-items:center;gap:8px}.draft-example img{max-width:145px;height:210px;transform:rotate(-8deg)}.draft-example b{font-size:18px}.draft-example span{font-size:13px;color:var(--ink-2)}
.interactive-lesson{grid-template-columns:44% 1fr;gap:25px}.lesson-practice{min-width:0}.practice-resources{display:flex;justify-content:center;gap:20px;font-size:23px}.practice-resources>span{display:flex;align-items:center;gap:6px}.practice-resources .ic{width:30px;height:30px}
.practice-board{display:flex;align-items:center;justify-content:center;margin:18px 0 0;gap:0}.practice-destination{position:relative;flex:1;min-width:0}.practice-hex{position:relative;display:block;width:100%;height:175px;padding:0;border:0;background:transparent;border-radius:0;box-shadow:none!important}.practice-hex.from{flex:1;min-width:0;touch-action:none}.practice-hex .practice-field{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.practice-hex>.piece{position:absolute;left:22%;top:18%;width:56%;height:60%;object-fit:contain;filter:drop-shadow(0 3px 2px #0005)}.practice-hex.highlighted .practice-field{filter:drop-shadow(0 0 5px #E6B84F)}.practice-hex.selected .practice-field{filter:drop-shadow(0 0 3px #B3261E)}.home .practice-hex:disabled{opacity:1;cursor:default}.practice-count{position:absolute;bottom:25px;right:16px;border:2px solid white;border-radius:50%;width:25px;height:25px;display:grid;place-items:center;color:white;font-size:15px}.practice-count.red{background:var(--red)}.practice-count.blue{background:var(--blue)}.practice-tile-label{position:absolute;top:100%;left:0;right:0;text-align:center;font-size:11px;color:var(--ink-2)}.practice-confirm{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);display:flex;gap:5px}.practice-confirm button{width:38px;min-height:38px;padding:0;font-size:21px;border-radius:8px;box-shadow:0 2px 6px #0002}.lesson p.practice-status{min-height:65px;margin-top:32px;font-size:13px;line-height:1.5;text-align:center}.practice-reset{display:block;margin:auto}.practice-lifted{position:fixed;width:48px;height:96px;background-size:400% 100%;background-position:0 50%;z-index:30;pointer-events:none;transform:translate(-50%,-70%);filter:drop-shadow(0 16px 5px #0003)}.practice-hex.picked-up>.piece{opacity:.2}.practice-done .to>.piece{animation:practice-arrive .25s ease-out}
@keyframes practice-arrive{from{transform:translateX(-80px)}to{transform:translateX(0)}}
@media(max-width:760px){.lesson ul{font-size:14px;line-height:1.45}.lesson li+li{margin-top:9px}.lesson:has(.mission-example) .lesson-art{height:225px}.mission-example{height:225px;width:190px}.lesson-art .mission-example-back{height:200px;width:135px;top:5px}.mission-example>.card{height:210px;width:140px;--cw:140px;grid-template-rows:minmax(0,1fr) 19px 48px;--card-title:14px;--card-body:10px;--card-stat:16px}.draft-example{grid-template-columns:95px 1fr;grid-template-rows:1fr 1fr;text-align:left;height:140px}.draft-example img{grid-row:1/3;width:83px;height:130px}.draft-example b{align-self:end;font-size:17px}.draft-example span{align-self:start}.interactive-lesson{grid-template-columns:1fr;gap:16px}.lesson-art.lesson-practice{height:auto}.practice-board{max-width:320px;margin:8px auto 0}.practice-hex{height:150px}.practice-count{bottom:20px}.lesson p.practice-status{min-height:40px;margin-top:22px}.practice-resources{font-size:20px}.practice-resources .ic{width:25px;height:25px}}
@media(max-width:760px){.lesson-nav{position:sticky;bottom:0;background:var(--marble);padding:10px 0;z-index:3}.lesson p.practice-status{min-height:0}.interactive-lesson{padding:18px}.interactive-lesson .lesson-copy li+li{margin-top:6px}}

/* Tutorial pictures use the same pieces and card faces as the campaign. */
.draft-example{display:flex;flex-direction:column;gap:12px;height:auto;width:100%;text-align:center}
.tutorial-hubris,.tutorial-drafted{display:flex;justify-content:center;width:100%}
.tutorial-hubris .card.card{flex:none;width:92px;min-height:0;height:140px;--cw:92px;--card-title:12px;--card-body:8px;--card-meta:6px;--card-stat:10px;grid-template-rows:minmax(0,1fr) 14px 23px;padding:4px 4px 15px;margin:0 -9px}
.tutorial-hubris .card-family{display:none}.tutorial-hubris .card-art{padding:3px}
.lesson-art .tutorial-drafted img{width:66px;height:102px;margin:0 -13px;transform:none;object-fit:contain}
.terrain-example{display:grid;grid-template-columns:1fr 1fr;gap:6px}.terrain-example figure{margin:0;text-align:center}.lesson-art .terrain-example img{height:105px;width:100%}.terrain-example figcaption{font-size:11px;color:var(--ink-2)}
.practice-board{position:relative}.practice-cursor{position:absolute;width:28px;height:35px;left:22%;top:50%;pointer-events:none;z-index:4;fill:var(--marble);stroke:var(--ink);stroke-width:1.5;filter:drop-shadow(0 2px 2px #0004);animation:practice-drag-cue 3.2s ease-in-out infinite}
@keyframes practice-drag-cue{0%,12%{left:22%;transform:scale(1);opacity:0}20%{opacity:1}30%{left:22%;transform:scale(.88)}70%,85%{left:72%;transform:scale(.88);opacity:1}95%,100%{left:72%;transform:scale(1);opacity:0}}
@media(max-width:760px){.lesson:has(.draft-example) .lesson-art{height:240px}.draft-example{height:240px;gap:0}.terrain-example{max-width:260px;margin:auto}.lesson:has(.terrain-example) .lesson-art{height:215px}.lesson-art .terrain-example img{height:85px}}
@media(prefers-reduced-motion:reduce){.practice-cursor{animation:none;left:48%;opacity:.7;transform:rotate(15deg)}}

.practice-hex{user-select:none;-webkit-user-select:none}.practice-hex img{pointer-events:none;-webkit-user-drag:none}

/* Moving between lessons announces the new card without a selection outline. */
.home .lesson:focus,.home .lesson:focus-visible{outline:none;box-shadow:none}
.start-options article{display:flex;flex-direction:column}.start-options article .button{margin-top:auto;align-self:flex-start}

.waiting-panel{max-width:760px}.waiting-panel .breadcrumbs{text-align:left}.waiting-seats{list-style:none;display:grid;gap:10px;padding:0;margin:24px 0;text-align:left}.waiting-seat{display:flex;align-items:center;gap:16px;padding:10px 18px;background:#fff8;border:1px solid var(--rule);border-left:4px solid var(--seat-colour);border-radius:10px;min-height:86px}.waiting-seat>.piece{width:48px;height:64px;flex:none}.waiting-seat strong{display:block;font-size:16px}.waiting-seat div span{display:block;color:var(--ink-2);font-size:12px;margin-top:4px}.waiting-seat .seat-status{margin-left:auto;color:var(--seat-colour);font-size:12px}.waiting-seat.open>.piece{opacity:.45}.invite-label{text-align:left;font-weight:600;margin-top:26px}.invite-link{display:flex;gap:8px;margin-top:8px}.invite-link input{flex:1;min-width:0;font-size:13px}.invite-link button{min-width:76px}
@media(max-width:760px){.waiting-seat{gap:10px;padding:8px 12px}.waiting-seat strong{font-size:14px}.waiting-seat>.piece{width:40px;height:56px}.waiting-seat .seat-status{font-size:11px}.invite-link input{font-size:12px}}

.waiting-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.waiting-heading label{display:flex;align-items:center;gap:10px}.waiting-heading select{width:70px}.waiting-seat .fill-bot{margin-left:auto;font-size:12px;padding:8px 10px}.invite-link #copy-invite{position:relative;min-width:44px;width:44px;flex:none;padding:10px;overflow:hidden}.invite-link svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:opacity .18s,transform .22s}.copied-symbol{position:absolute;opacity:0;transform:translateY(12px) scale(.7);color:var(--green)}#copy-invite.copied{border-color:var(--green);background:#2A85700d}#copy-invite.copied .copy-symbol{opacity:0;transform:translateY(-12px) scale(.8)}#copy-invite.copied .copied-symbol{opacity:1;transform:none;animation:copy-check .3s ease-out}@keyframes copy-check{0%{transform:scale(.6)}70%{transform:scale(1.12)}100%{transform:scale(1)}}@media(prefers-reduced-motion:reduce){.invite-link svg{transition:none}#copy-invite.copied .copied-symbol{animation:none}}

.mobile-home-legal{display:none}.home-legal-dialog nav{display:flex;gap:24px;margin:20px 0}.home-legal-dialog p{font-size:12px}.home-legal-dialog>button{float:right}
@media(max-width:760px){
 .home[data-home-screen=home]>.legal-footer{display:none}
 .home[data-home-screen=home] .mobile-home-legal{display:block;margin-left:auto;font-size:11px;padding:8px}
 .home[data-home-screen=home] #home-status:empty{display:none}
}