.hf-game{--hf-line:#dedacc;--hf-accent:#275947;display:flex;flex-direction:column;gap:14px}.hf-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.hf-heading h2{margin:5px 0;font-size:30px}.hf-heading details{position:relative}.hf-heading details[open]{display:flex;flex-direction:column;gap:8px}.hf-roster{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px}.hf-player{display:grid;grid-template-columns:36px 1fr;gap:3px 8px;align-items:center;padding:10px;border:1px solid var(--hf-line);border-radius:12px;background:#fffcf4;min-width:0}.hf-player>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hf-player>span:last-child{grid-column:2;font-size:12px}.hf-current{border:2px solid #ce713f;background:#fff0dc}.hf-avatar{grid-row:span 2;width:36px;height:36px;overflow:hidden;border-radius:50%}.hf-avatar img,.hf-avatar svg{width:100%;height:100%}.hf-turn{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px}.hf-turn h2{margin:7px 0}.hf-turn p{margin:0}.hf-progress{display:flex;flex-direction:column;align-items:center;white-space:nowrap}.hf-progress>strong{font-size:27px}.hf-progress>span{font-size:12px}.hf-request{display:flex;align-items:center;gap:14px;max-width:40%;font-size:14px}.hf-request>b,.hf-request span>b{display:block;margin-top:6px}.hf-request-card{width:92px;min-width:92px;display:flex;flex-direction:column;text-align:center;border:1px solid var(--hf-line);border-radius:12px;padding:6px;background:#fff9ec}.hf-animal{font-size:39px;line-height:1.1}.hf-role-icon{font-size:18px}.hf-request-card strong{font-size:12px}.hf-request-card>span:last-child{font-size:12px}.hf-books{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}.hf-book{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:5px 8px;padding:13px;border:1px dashed #a8ae9f;border-radius:12px;background:#ffffff6b;min-width:0}.hf-book>span{grid-row:span 2;font-size:32px;filter:grayscale(1);opacity:.5}.hf-book strong{font-size:15px}.hf-book small{margin:0;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hf-book-complete{background:var(--hf-color);border-style:solid;border-color:#0002}.hf-book-complete>span{filter:none;opacity:1}.hf-book-complete small{color:#263a30;font-weight:700}.hf-own .section-heading{align-items:center;gap:8px}.hf-own h2{margin:0;font-size:25px}.hf-own p{margin:10px 0}.hf-hand{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px}.hf-hand-family{display:flex;flex-direction:column;gap:4px;padding:10px 7px;background:var(--hf-color);border:2px solid transparent;border-radius:12px;min-width:0;color:#243c32}.hf-hand-family:disabled{opacity:1;cursor:default}.hf-hand-family>span:first-child{font-size:40px}.hf-hand-family strong{font-size:14px}.hf-hand-family small{margin:0;color:#405046}.hf-mini-member{display:inline-block;opacity:.22;font-size:17px}.hf-mini-member.hf-owned{opacity:1}.hf-selected{border-color:#95551e!important;box-shadow:0 0 0 2px #e9b76c inset;background-image:linear-gradient(#ffffff33,#ffffff33)}.hf-pick-card h3,.hf-pick-player h3{margin:18px 0 10px}.hf-members{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.hf-member{display:flex;flex-direction:column;gap:4px;padding:10px 4px;border:2px solid #d4d9cc;background:#fffcf5;min-width:0}.hf-member strong{font-size:12px}.hf-member>span:last-of-type{font-size:14px}.hf-member small{margin:0}.hf-member.hf-have{opacity:.45;background:#eef1e8}.hf-targets{display:flex;flex-wrap:wrap;gap:8px}.hf-targets>button{gap:8px;padding:8px 12px;border-width:2px}.hf-targets img,.hf-targets svg{width:32px;height:32px}.hf-targets small{margin:4px 0 0}.hf-ask-action{margin-top:16px}.hf-ask-action button{width:100%}.hf-collected summary{font-weight:700;cursor:pointer}.hf-collected .hf-books{margin-top:14px}.hf-results h2{font-size:30px}
body.display-mode.playing-mode.families-mode{overflow:hidden}body.display-mode.playing-mode.families-mode .room{height:calc(100dvh - 40px);display:flex;flex-direction:column;padding:10px 18px!important;overflow:hidden}body.display-mode.playing-mode.families-mode .room>.room-heading{display:none!important}.display-mode .hf-tv{height:100%;min-height:0;gap:10px}.display-mode .hf-heading h2{font-size:26px}.display-mode .hf-roster{grid-template-columns:repeat(6,minmax(0,1fr))}.display-mode .hf-player{padding:8px;grid-template-columns:28px 1fr}.display-mode .hf-avatar{width:28px;height:28px}.display-mode .hf-player strong{font-size:15px}.display-mode .hf-turn{padding:12px 18px;flex-shrink:0}.display-mode .hf-turn h2{font-size:30px}.display-mode .hf-books{flex:1;min-height:0;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:9px}.display-mode .hf-book{padding:10px}.display-mode .hf-book>span{font-size:38px}.display-mode .hf-book strong{font-size:18px}.display-mode .hf-book small{font-size:14px}.display-mode .hf-game+.game-bottom{display:none}
@media(max-width:700px){.player-mode.families-mode .room{height:auto!important;min-height:100dvh;overflow:visible}.player-mode.families-mode .room>.room-heading,.player-mode.families-mode .room .scorebar{display:none!important}.hf-game{gap:10px}.hf-heading{align-items:start}.hf-heading h2{font-size:24px}.hf-heading .row{gap:5px}.hf-heading button,.hf-heading summary{font-size:12px;min-height:40px;padding:8px}.hf-roster{grid-template-columns:repeat(2,minmax(0,1fr))}.hf-player{padding:7px;grid-template-columns:28px 1fr}.hf-avatar{width:28px;height:28px}.hf-player strong{font-size:13px}.hf-player>span:last-child{font-size:11px}.hf-turn{padding:12px;gap:10px}.hf-turn h2{font-size:24px}.hf-turn p{font-size:12px}.hf-progress{display:none}.hf-request{display:none}.hf-own{padding:14px!important}.hf-own .section-heading h2{font-size:23px;margin-right:auto}.hf-hand{display:flex;overflow-x:auto;padding:3px}.hf-hand-family{flex:0 0 100px}.hf-hand-family>span:first-child{font-size:34px}.hf-hand-family{padding:8px 4px}.hf-hand-family strong{font-size:13px}.hf-mini-member{font-size:15px}.hf-member .hf-animal{font-size:30px}.hf-member strong{font-size:10px}.hf-member .hf-role-icon{font-size:20px}.hf-members{gap:5px}.hf-books{grid-template-columns:repeat(2,minmax(0,1fr))}.hf-book{padding:9px}.hf-results h2{font-size:26px}}

.hf-f-kissat{--hf-color:#ebc5ad}.hf-f-koirat{--hf-color:#d5c4a4}.hf-f-karhut{--hf-color:#cdb9a7}.hf-f-ketut{--hf-color:#efbc91}.hf-f-puput{--hf-color:#e8c3d5}.hf-f-siilit{--hf-color:#d4c19c}.hf-f-pandat{--hf-color:#cbd6ce}.hf-f-leijonat{--hf-color:#eed08e}.hf-f-pingviinit{--hf-color:#bcd8e8}.hf-f-pollot{--hf-color:#cfbfa1}.hf-f-sammakot{--hf-color:#bfdbad}.hf-f-kilpikonnat{--hf-color:#a9cebf}.hf-f-norsut{--hf-color:#cac7e1}
.hf-book{background:#fff9ec;color:#203b33}.hf-book-complete{background:var(--hf-color)}.display-mode .hf-player,.display-mode .hf-player strong,.display-mode .hf-player>span,.display-mode .hf-turn,.display-mode .hf-turn h2,.display-mode .hf-progress,.display-mode .hf-request,.display-mode .hf-request-card,.display-mode .hf-book strong,.display-mode .hf-book small{color:#203b33!important}.display-mode .hf-heading .outline{color:#fff4de;border-color:#bcbaa7}.hf-own,.hf-own h2,.hf-own h3{color:#203b33}
.hf-member.hf-have{opacity:1;background:#eef1e8;border-color:#dde2d6;color:#50614f}.hf-member.hf-have .hf-animal{opacity:.55}
