:root{--bg:#1a1a1a;--text:#ededed;--muted:#888;--border:#333;--surface:#ffffff08;--accent:#8ce7e9;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,Noto Sans TC,PingFang TC,sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background-color:var(--bg);color:var(--text)}#root{min-height:100dvh}.page{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:2.25rem;min-height:100dvh;padding:3rem 1.5rem;display:flex}.wordmark{letter-spacing:-.04em;color:var(--text);margin:0;font-size:clamp(2.75rem,11vw,5.5rem);font-weight:800;line-height:1}.stack{flex-direction:column;gap:1rem;width:100%;max-width:22.5rem;display:flex}@media (width>=720px){.stack{flex-direction:row;align-items:flex-start;gap:1rem;max-width:41rem}.stack>.card{flex:1 1 0}.stack>.links{flex:0 16rem}}.card{text-align:left;color:inherit;background:#2a2a2a;border-radius:20px;padding:12px;text-decoration:none;transition:background .15s;display:block}@media (hover:hover){.card:hover{background:#333}}.card:active{background:#3a3a3a}.card-cover{aspect-ratio:16/9;background:#222;border:1px solid #444;border-radius:8px;justify-content:center;align-items:center;margin-bottom:12px;display:flex;overflow:hidden}.card-title{letter-spacing:-.02em;color:#fff;margin:0 0 4px;font-size:28px;font-weight:800}.card-desc{color:#aaa;margin:0;font-size:14px;line-height:1.5}.links{flex-direction:column;align-items:stretch;gap:.75rem;width:100%;display:flex}.link{color:var(--text);background:#2a2a2a;border-radius:16px;align-items:center;gap:.7rem;padding:.85rem 1.1rem;font-size:.95rem;font-weight:500;text-decoration:none;transition:background .15s;display:flex}.link-icon{object-fit:cover;border-radius:5px;flex:none;width:20px;height:20px}.link-label{line-height:1}@media (hover:hover){.link:hover{background:#333}}.link:active{background:#3a3a3a}.link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero-replay{aspect-ratio:1;height:100%;container-type:inline-size}.hr-board{--radius:2cqi;--pad:2cqi;--gap:1cqi;--cell:calc((100cqi - 2 * var(--pad) - 7 * var(--gap)) / 8);--step:calc(var(--cell) + var(--gap));--cell-size:calc((100% - 4% - 7%) / 8);gap:var(--gap);width:100%;height:100%;padding:var(--pad);border-radius:calc(var(--radius) + var(--pad));box-sizing:border-box;background:#222;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);display:grid;position:relative}.hr-cell{border-radius:var(--radius);background:#2a2a2a}.hr-cell.hr-wall{background:#555}.hr-cell.hr-goal{background:#2a2a2a;box-shadow:inset 0 0 0 1cqi #5b9bd5}.hr-box{width:var(--cell-size);height:var(--cell-size);border-radius:var(--radius);transform:translate(calc(var(--pad) + var(--bx) * var(--step)), calc(var(--pad) + var(--by) * var(--step)));background:#e8a54b;transition:transform .15s,background-color .3s,box-shadow .3s;position:absolute;top:0;left:0;box-shadow:0 0 #0000}.hr-box.on-goal{background:#5b9bd5;box-shadow:0 0 1.5cqi .5cqi #5b9bd566}@media (prefers-reduced-motion:reduce){.hr-box{transition:background-color .3s}}
