:root{--ink:#2a2318;--paper:#f6f0e4eb;--rule:#8a6d3b;--sky:#c9d5df}html,body,#root{background:var(--sky);height:100%;margin:0;overflow:hidden}body{color:var(--ink);font-family:Libre Baskerville,Georgia,serif}canvas{touch-action:none;display:block}.title{background:var(--paper);border-top:2px solid var(--rule);border-bottom:1px solid var(--rule);pointer-events:none;padding:10px 16px 12px;position:fixed;top:16px;left:16px}.title h1{letter-spacing:.04em;margin:0;font-size:22px}.title p{margin:4px 0 0;font-size:12px;font-style:italic}.lang{gap:4px;display:flex;position:fixed;top:16px;right:16px}.lang button,.lang .contact{font:inherit;border:1px solid var(--rule);background:var(--paper);color:var(--ink);cursor:pointer;padding:6px 10px;font-size:12px}.lang .contact{line-height:normal;text-decoration:none}.lang button[aria-pressed=true]{background:var(--ink);color:#f6f0e4}.lang .short{display:none}.tip.touch{transform:translate(-50%,calc(-100% - 22px))}.tip{background:var(--paper);border:1px solid var(--rule);pointer-events:none;white-space:nowrap;padding:5px 10px;font-size:14px;position:fixed;transform:translate(14px,-50%)}.loading{background:var(--sky);box-sizing:border-box;z-index:10;place-items:end center;padding:16px 16px 9vh;transition:opacity .9s,visibility linear;display:grid;position:fixed;inset:0}.loading.done{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .9s,visibility 0s linear .9s}.loading .still{object-fit:cover;object-position:50% 50%;width:100%;height:100%;position:absolute;inset:0}.loading .card{background:var(--paper);text-align:center;border-top:2px solid var(--rule);border-bottom:1px solid var(--rule);box-sizing:border-box;width:min(380px,100%);padding:22px 26px 18px;position:relative;box-shadow:0 6px 30px #2a231840}.loading h1{letter-spacing:.04em;margin:0;font-size:26px}.loading .sub{margin:6px 0 18px;font-size:13px;font-style:italic}.loading .bar{background:#8a6d3b38;height:3px;overflow:hidden}.loading .bar i{background:var(--ink);transform-origin:0;height:100%;display:block}.loading .state{margin:10px 0 0;font-size:12px;font-style:italic}.loading .mb{opacity:.7}.credit,.keys{background:var(--paper);padding:3px 8px}.credit{pointer-events:none;font-size:11px;position:fixed;bottom:8px;right:12px}.stats{opacity:.7;font:11px ui-monospace,monospace;position:fixed;bottom:8px;left:12px}@media (width<=600px){.title h1{font-size:18px}.title{top:12px;left:12px}}.views{background:var(--paper);border-top:2px solid var(--rule);border-bottom:1px solid var(--rule);scrollbar-width:none;gap:0;max-width:calc(100vw - 32px);display:flex;position:fixed;bottom:36px;left:50%;overflow-x:auto;transform:translate(-50%)}.views::-webkit-scrollbar{display:none}.views.more{-webkit-mask-image:linear-gradient(90deg,#000 78%,#0000);mask-image:linear-gradient(90deg,#000 78%,#0000)}.views button{font:inherit;color:var(--ink);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-right:1px solid #8a6d3b59;padding:9px 14px;font-size:13px}.views button:last-child{border-right:0}.views button:hover{background:#8a6d3b1f}.views button[aria-pressed=true]{background:var(--ink);color:#f6f0e4}.keys{pointer-events:none;white-space:nowrap;font-size:11px;font-style:italic;position:fixed;bottom:8px;left:50%;transform:translate(-50%)}.about-back{z-index:20;background:#2a231859;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.about{box-sizing:border-box;border-top:2px solid var(--rule);border-bottom:1px solid var(--rule);background:#f6f0e4;width:min(560px,100%);max-height:calc(100vh - 32px);padding:24px 28px 18px;font-size:14px;line-height:1.6;position:relative;overflow-y:auto}.about h2{letter-spacing:.04em;margin:0 0 8px;font-size:22px}.about h3{letter-spacing:.08em;text-transform:uppercase;color:var(--rule);margin:18px 0 4px;font-size:13px}.about p{margin:0 0 8px}.about a{color:var(--ink)}.about .close{font:inherit;cursor:pointer;border:1px solid var(--rule);color:var(--ink);background:0 0;padding:5px 10px;font-size:12px;position:absolute;top:12px;right:12px}@media (width<=600px){.views{bottom:38px}.views button{padding:8px 10px;font-size:12px}.keys{white-space:normal;text-align:center;box-sizing:border-box;width:max-content;max-width:calc(100vw - 32px);bottom:84px}.lang button,.lang .contact{padding:6px 8px}.lang{top:12px;right:12px}.lang .long{display:none}.lang .short{display:inline}.lang .game-btn,.lang .tour-btn,.lang .contact{display:none}.about{padding:20px 18px 14px}}.labels{pointer-events:none;position:fixed;inset:0;overflow:hidden}.labels span{white-space:nowrap;opacity:0;border-bottom:1px solid var(--rule);border-left:3px solid var(--rule);will-change:transform;background:#f6f0e4db;padding:2px 7px 3px;font-size:12px;transition:opacity .25s;position:absolute;top:0;left:0}.labels span:after{content:"";left:calc(50% + var(--dx,0px));background:var(--rule);width:1px;height:10px;position:absolute;top:100%}@media (width<=600px){.labels span{font-size:11px}}.hud{z-index:5;flex-direction:column;align-items:center;gap:6px;display:flex;position:fixed;top:50%;right:16px;transform:translateY(-50%)}.hud button{font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--rule);cursor:pointer;place-items:center;padding:0;display:grid}.hud button:hover{background:#fffaf0}.hud .pair{display:flex}.hud .pair button{width:30px;height:30px;font-size:17px;line-height:1}.hud .pair button+button{border-left:0}.hud .compass{border-width:1px;border-radius:50%;width:60px;height:60px;margin-bottom:4px;box-shadow:0 2px 10px #2a23182e}.hud .rose{box-sizing:border-box;border:1px solid #8a6d3b73;border-radius:50%;width:52px;height:52px;display:block;position:relative}.hud .rose b{color:#8c2a22;font-size:11px;line-height:1;position:absolute;top:1px;left:50%;transform:translate(-50%)}.hud .rose .needle{border-bottom:12px solid #8c2a22;border-left:4px solid #0000;border-right:4px solid #0000;width:0;height:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-100%)}.hud .rose .needle:after{content:"";border-left:4px solid #0000;border-right:4px solid #0000;border-top:12px solid var(--ink);width:0;height:0;position:absolute;top:12px;left:-4px}.hud .rose .tick{background:var(--rule);position:absolute}.hud .rose .tick.e,.hud .rose .tick.w{width:5px;height:1px;top:50%}.hud .rose .tick.e{right:2px}.hud .rose .tick.w{left:2px}.hud .rose .tick.s{width:1px;height:5px;bottom:2px;left:50%}@media (width<=600px){.hud{top:auto;bottom:132px;right:12px;transform:none}.hud .compass{width:52px;height:52px}.hud .rose{width:44px;height:44px}.hud .rose .needle{border-bottom-width:9px}.hud .rose .needle:after{border-top-width:9px;top:9px}.hud .pair button{width:34px;height:34px}}@media (pointer:coarse){.hud .pair{display:none}}.about.game{width:min(440px,100%);padding-top:22px}.about .game-line{margin:4px 90px 6px 0;font-size:16px;line-height:1.55}.lang .tour-btn{font-style:italic}.hud .tour-icon{width:30px;height:30px;font-size:12px;display:none}.hud .tour-icon[aria-pressed=true],.lang .tour-btn[aria-pressed=true]{background:var(--ink);color:#f6f0e4}.hud .tags{flex-direction:column;align-items:stretch;margin-top:6px;display:flex}.hud .tags-head{display:flex}.hud .tags-head button{height:28px;font-size:12px}.hud .tags-head .all{flex:1;padding:0 10px;font-style:italic}.hud .tags-head .all[aria-pressed=true]{background:var(--ink);color:#f6f0e4}.hud .tags-head .fold{border-left:0;width:26px}.hud .tags ul{flex-direction:column;gap:3px;margin:0;padding:4px 0 0;list-style:none;display:flex}.hud .tags li button{white-space:nowrap;opacity:.55;justify-content:flex-start;align-items:center;gap:7px;width:100%;padding:4px 9px 4px 7px;font-size:12px;display:flex}.hud .tags li button i{opacity:.5;border-radius:50%;flex:none;width:9px;height:9px}.hud .tags li button[aria-pressed=true],.hud .tags li button[aria-pressed=true] i{opacity:1}.hud .tags li button:disabled{opacity:.3;cursor:default}.hud{align-items:flex-end}.hud .compass,.hud .pair,.hud .tour-icon{align-self:center}@media (width<=600px){.hud .tour-icon{width:34px;height:34px;display:grid}.hud .tags li button{padding:6px 9px 6px 7px}}.hud .today{flex-direction:column;align-items:stretch;margin-top:6px;display:flex}.hud .today-btn{height:28px;padding:0 10px;font-size:12px;font-style:italic}.hud .today-btn[aria-pressed=true]{color:#f6f0e4;background:#2f4f6f;border-color:#2f4f6f}.hud .today-fail{background:var(--paper);margin:2px 0 0;padding:3px 6px;font-size:11px}.hud .today-k{background:var(--paper);border:1px solid var(--rule);border-top:0;align-items:center;gap:6px;padding:4px 6px;font-size:11px;font-style:italic;display:flex}.hud .today-k input{accent-color:#2f4f6f;width:84px}
