@font-face{font-family:Fraunces;src:url(/tic-tac-toe/fonts/Fraunces.woff2) format("woff2");font-weight:100 900;font-display:swap}@font-face{font-family:Instrument Sans;src:url(/tic-tac-toe/fonts/InstrumentSans.woff2) format("woff2");font-weight:400 700;font-display:swap}:root{--oat: #f4e9d8;--walnut: #3b2418;--walnut-soft: #6b4c36;--bar: #3a2a1e;--beech: #e7c28e;--beech-edge: #b8864e;--well: #d9ae74;--red: #d9452b;--red-deep: #9e2a17;--red-hi: #f7a08b;--teal: #1f7f8c;--teal-deep: #145863;--teal-hi: #7cc7cf;--honey: #f6c445;--honey-deep: #b88a12;--paper: #f8e8c8;--button: #eed3a6;--button-edge: #c39a62;--play: #cf3f25;--play-ink: #fff6ea}*{box-sizing:border-box}html,body{margin:0;background-color:var(--oat);background-image:repeating-linear-gradient(0deg,rgba(120,84,48,.045) 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,rgba(120,84,48,.04) 0 1px,transparent 1px 5px);color:var(--walnut);font-family:Instrument Sans,system-ui,sans-serif;-webkit-tap-highlight-color:transparent}#root{min-height:100vh;min-height:100dvh}button{font:inherit;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--teal);outline-offset:3px}.fr{font-family:Fraunces,Georgia,serif;font-variation-settings:"SOFT" 100,"WONK" 0}.app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.room{flex:1 0 auto;width:100%;max-width:480px;margin:0 auto;display:flex;flex-direction:column}hub-bar{display:block;padding-top:env(safe-area-inset-top,0px);background:#6b4423}.sheet-back{position:fixed;inset:0;z-index:60;background:#3b241873;display:flex;align-items:flex-end;justify-content:center}.sheet{width:min(100%,480px);background:var(--oat);border-radius:24px 24px 0 0;padding:22px 20px calc(22px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:18px;box-shadow:0 -10px 24px #3b24184d}.sheet .rail{grid-template-columns:repeat(2,minmax(0,1fr))}.sheet .links{display:flex;gap:18px;font-weight:600}.sheet .links a{color:var(--walnut)}.beech{background-color:var(--beech);background-image:repeating-linear-gradient(94deg,rgba(150,92,36,.1) 0 2px,transparent 2px 11px,rgba(150,92,36,.06) 11px 12px,transparent 12px 27px)}.tray{position:relative;display:grid;border-radius:30px;box-shadow:0 10px 0 var(--beech-edge),0 24px 30px #3b241833;width:min(350px,calc(100vw - 40px),calc(100dvh - 380px));min-width:240px;margin:auto}.g3{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:18px}.g4{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:16px}.g5{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:14px}.well{aspect-ratio:1;border:0;padding:0;border-radius:24%;background:var(--well);box-shadow:inset 0 4px #6e3e1247,inset 0 -2px #fff4dc8c;display:flex;align-items:center;justify-content:center;cursor:pointer}.well:disabled{cursor:default}.well.ghost{background:#f3ce84;box-shadow:inset 0 4px #6e3e1229,0 0 0 4px var(--honey),0 0 22px 4px #f6c445bf}.well.lit{background:var(--honey);box-shadow:inset 0 4px #965a0040,0 0 18px #f6c445e6}.piece{width:74%;height:74%}.px{filter:drop-shadow(0 4px 0 var(--red-deep))}.po{filter:drop-shadow(0 4px 0 var(--teal-deep))}.spark{width:34%;height:34%}.drop{animation:settle .22s ease-out}@keyframes settle{0%{transform:translateY(-12%) scale(1.12);opacity:0}to{transform:none;opacity:1}}.dowel{position:absolute;height:16px;border-radius:8px;background:#c98f52;box-shadow:inset 0 3px #ffecc899,0 3px #8e5a2b;transform-origin:0 50%;pointer-events:none;animation:slide .36s ease-out}@keyframes slide{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}.owlrow{display:flex;align-items:center;gap:4px;padding:10px 16px 0;min-height:132px}.owl{position:relative;width:104px;height:112px;flex:none}.toggle{position:absolute;right:-6px;bottom:2px;width:44px;height:44px;border-radius:50%;border:0;background:var(--button);box-shadow:0 3px 0 var(--button-edge);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--walnut)}.toggle-label{position:absolute;top:100%;margin-top:5px;font-size:11px;font-weight:700;white-space:nowrap;color:var(--walnut-soft)}.toggle.on,.toggle.ask[aria-pressed=true]{background:var(--honey);box-shadow:0 3px 0 var(--honey-deep)}.toggle:disabled{cursor:default;filter:saturate(.4)}.ask-mark{font-size:24px;font-weight:700;line-height:1}.tagwrap{flex:1;min-width:0;filter:drop-shadow(0 3px 0 #d3b583)}.tag{background:var(--paper);clip-path:polygon(22px 0,100% 0,100% 100%,22px 100%,0 calc(100% - 22px),0 22px);padding:14px 16px 15px 36px;position:relative;min-height:84px}.tag .hole{position:absolute;left:14px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:#e3c99a;box-shadow:inset 0 1px 1px #3b241859}.tag-title{font-size:20px;font-weight:650;line-height:1.15}.tag-body{font-size:15px;line-height:1.35;margin-top:4px;color:#5a3d2b}.zz{flex:1;align-self:flex-start;margin-top:4px;padding-left:4px;font-size:26px;font-style:italic;color:#a88466}.btn{font-weight:600;font-size:15px;color:var(--walnut);border:0;border-radius:18px;background:var(--button);box-shadow:0 4px 0 var(--button-edge);min-height:54px;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;padding:0 10px;white-space:nowrap}.btn:active{transform:translateY(2px);box-shadow:0 2px 0 var(--button-edge)}.btn:disabled{opacity:.5;cursor:default;transform:none}.btn svg{width:20px;height:20px;flex:none}.btn.play{background:var(--play);color:var(--play-ink);box-shadow:0 5px 0 var(--red-deep);font-family:Fraunces,Georgia,serif;font-variation-settings:"SOFT" 100;font-size:19px;font-weight:700}.actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:18px 16px 24px}.actions.two{grid-template-columns:repeat(2,minmax(0,1fr))}.endcard{padding:0 16px 16px}.endcard hub-end-card{display:block}@media(min-width:860px){.room.play{max-width:900px;display:grid;grid-template-columns:minmax(0,1fr) 380px;grid-template-rows:auto auto auto 1fr;grid-template-areas:"head head" "tray owl" "tray actions" "tray card";column-gap:28px;align-content:start}.room.play>header{grid-area:head}.room.play>.owlrow{grid-area:owl;padding-top:0}.room.play>.tray{grid-area:tray;align-self:start;margin:12px auto 0;width:min(440px,calc(100dvh - var(--hubbar, 52px) - var(--hubnav, 74px) - 130px))}.room.play>.actions{grid-area:actions;padding:6px 16px 14px}.room.play>.endcard{grid-area:card}}@media(min-width:1180px){.room.play:has(>.endcard){max-width:1180px;grid-template-columns:minmax(0,1fr) 360px 340px;grid-template-rows:auto auto auto 1fr;grid-template-areas:"head head head" "tray owl card" "tray actions card" "tray . card"}.room.play>.endcard{align-self:start;margin-top:12px}}.homehead{display:flex;align-items:center;gap:14px;padding:22px 20px 6px}.homeboards{padding:18px 14px 0}.homecomputer{padding:22px 20px 0}.homeplay{padding:30px 20px 28px;display:flex;flex-direction:column}@media(max-height:700px){.homehead{padding-top:8px}.homeboards{padding-top:4px}.homecomputer{padding-top:10px}.homeplay{padding-top:8px;padding-bottom:12px}.pick .mini{width:min(100%,80px);margin:0 auto}}.label{font-family:Fraunces,Georgia,serif;font-variation-settings:"SOFT" 100;font-style:italic;font-weight:600;font-size:19px;margin:0 0 10px}.mini{border-radius:18px;box-shadow:0 6px 0 var(--beech-edge),0 12px 16px #3b241829;display:grid;aspect-ratio:1}.mini.g3{gap:5px;padding:9px}.mini.g4{gap:4px;padding:8px}.mini.g5{gap:3px;padding:7px}.mini .well{border-radius:26%;box-shadow:inset 0 2px #6e3e1247;cursor:inherit}.pick{border:0;background:transparent;padding:6px 6px 10px;border-radius:24px;display:flex;flex-direction:column;gap:12px;align-items:stretch;cursor:pointer}.pick[aria-pressed=true]{background:#fbefd6;box-shadow:0 0 0 3px var(--honey)}.rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:6px;border-radius:22px;box-shadow:inset 0 3px #6e3e1238}.seg{min-height:48px;border:0;border-radius:16px;background:transparent;font-weight:600;font-size:16px;cursor:pointer}.seg[aria-pressed=true]{background:var(--honey);box-shadow:0 3px 0 var(--honey-deep)}@media(prefers-reduced-motion:reduce){.drop,.dowel{animation:none}}
