:root{font-family:ui-rounded,"Microsoft JhengHei",system-ui,sans-serif;color:#17305b;background:#edf3fe;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,.button{cursor:pointer}button:focus-visible,.button:focus-within,[role=button]:focus-visible{outline:4px solid #ffb82c;outline-offset:4px}header{max-width:1440px;margin:auto;padding:25px 40px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:24px;font-weight:900;text-decoration:none;color:inherit;display:flex;gap:10px;align-items:center}.mark{background:#2454dc;color:white;border-radius:12px;padding:2px 10px;font-size:30px}.family{font-size:14px;color:#556682}main{max-width:1440px;margin:auto;padding:15px 40px 24px}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px}.eyebrow{letter-spacing:3px;font-weight:800;font-size:12px;color:#2454dc;margin:0 0 8px}h1{font-size:clamp(26px,3vw,38px);letter-spacing:-1px;margin:0 0 24px}.button{border:0;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border-radius:14px;font-weight:750;font-size:16px;text-decoration:none}.primary{background:#2454dc;color:white;box-shadow:0 4px 0 #183da9}.primary:hover{background:#1944c1}.secondary{background:#fff;color:#294371;border:1px solid #d4def0}.button:disabled{opacity:.4;cursor:default}.upload input{position:absolute;opacity:0;width:1px;height:1px}.controls{display:flex;align-items:center;gap:25px;margin:0 0 20px;flex-wrap:wrap}.difficulty{display:flex;align-items:center;gap:16px;font-weight:700}.segments{display:flex;padding:4px;border:1px solid #d6e1f3;background:#e2eafb;border-radius:15px;gap:4px}.segments button{border:0;background:transparent;color:#455777;padding:9px 20px;border-radius:11px;font-size:18px;font-weight:800;min-height:44px}.segments button[aria-pressed=true]{background:white;color:#204ed3;box-shadow:0 2px 5px #163e8420}.segments small{font-size:14px}.hint{display:flex;align-items:center;gap:8px;margin-left:auto;cursor:pointer}.hint input{accent-color:#2454dc;width:21px;height:21px}.playarea{position:relative;background:#fff;border:1px solid #d7e2f5;border-radius:24px;box-shadow:0 10px 30px #203d7410;overflow:hidden}.gamebar{padding:19px 24px;border-bottom:1px solid #e6edf9;display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:15px}.progress{white-space:nowrap;border-radius:20px;background:#fff2cf;color:#765207;font-weight:800;padding:7px 15px}#empty{text-align:center;min-height:420px;padding:55px 20px;background:radial-gradient(circle at center,#f2f6ff 0,white 65%)}.photo-icon{font-size:60px;line-height:1;background:#dfebff;width:100px;height:100px;display:grid;place-items:center;border-radius:26px;color:#2454dc;margin:0 auto 25px;transform:rotate(-8deg)}h2{font-size:24px;margin:12px 0}#empty p{color:#5c6b84;margin-bottom:25px}.privacy{font-size:14px!important;margin-top:24px}#game{padding:14px}#puzzle{display:block;width:100%;touch-action:none;user-select:none;-webkit-user-select:none}#puzzle [role=button]{cursor:grab}#puzzle [role=button]:active{cursor:grabbing}#success{position:absolute;inset:65px 0 0;background:#ffffffed;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:25px}#success:not([hidden]){display:flex}#success>span{font-size:42px;letter-spacing:12px;color:#eda900}#success h2{font-size:32px}#success p{color:#5c6b84;margin-bottom:26px}footer{display:flex;justify-content:space-between;gap:15px;font-size:14px;color:#566986;margin-top:18px;flex-wrap:wrap}#status{font-size:15px;color:#2454dc;min-height:24px}[hidden]{display:none!important}@media(max-width:680px){header{padding:18px 18px}.family{display:none}main{padding:12px 14px}.toolbar{align-items:flex-start}.toolbar>.button{padding:10px 13px;font-size:14px;white-space:nowrap}h1{font-size:25px}.eyebrow{font-size:12px;letter-spacing:2px}.controls{gap:12px}.difficulty{width:100%;justify-content:space-between}.segments button{padding:8px 22px}.hint{margin-left:0;margin-right:auto}.gamebar{padding:14px;font-size:14px;align-items:flex-start}.gamebar>span:first-child{max-width:70%}.progress{padding:6px 10px}.playarea{border-radius:18px}#game{padding:5px}#empty{padding:40px 16px;min-height:390px}#empty h2{font-size:21px}footer{font-size:14px;gap:6px}}

/* Keep the finished photo visible while celebrating below the board. */
#success{position:static;inset:auto;background:#f0f6ff;border-top:1px solid #d7e2f5;padding:24px}#success>span{font-size:28px}#success h2{font-size:26px}

.albumbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 20px;border-bottom:1px solid #e6edf9}.album-nav{display:flex;gap:14px;align-items:center}#photo-counter{font-size:15px;font-weight:700;white-space:nowrap}.albumbar .button{min-height:44px;padding:8px 14px}.puzzle-fullscreen{overflow:hidden;overscroll-behavior:none}.playarea.is-fullscreen{position:fixed;inset:0;z-index:1000;width:100%;height:100dvh;border:0;border-radius:0;display:flex;flex-direction:column;overflow:hidden;overscroll-behavior:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.is-fullscreen .albumbar,.is-fullscreen .gamebar{flex-shrink:0}.is-fullscreen #game{flex:1;min-height:0;overflow:hidden}.is-fullscreen #puzzle{height:100%;width:100%}.is-fullscreen #success{flex-shrink:0;padding:8px 16px;gap:12px;flex-direction:row}.is-fullscreen #success>span,.is-fullscreen #success p{display:none}.is-fullscreen #success h2{font-size:20px;margin:0}.is-fullscreen #success .button{min-height:44px}.is-fullscreen .gamebar{padding:8px 16px}@media(max-width:680px){.albumbar{padding:10px;gap:8px;flex-wrap:wrap}.album-nav{gap:8px;flex:1;justify-content:space-between}.albumbar .button{font-size:14px;padding:8px 10px}#photo-counter{font-size:14px}.toolbar{flex-wrap:wrap}.toolbar h1{margin-bottom:6px}.toolbar{margin-bottom:20px}.is-fullscreen .albumbar{flex-wrap:nowrap}.is-fullscreen .album-nav{gap:4px}.is-fullscreen .albumbar .button{padding:8px 7px}}

/* Game library */
.hub{min-height:100dvh;background:#163cac;color:#fff}.hub-nav{max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 40px}.hub-brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none;font-size:24px;font-weight:900}.hub-brand>span{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#ffdc62;color:#173985;font-size:30px}.hub-domain{font-size:14px;color:#d2deff}.hub-main{max-width:1240px;padding:35px 40px 40px}.hub-tag{display:inline-block;background:#3154bc;border:1px solid #5c78d0;border-radius:30px;padding:9px 16px;font-size:15px;font-weight:700}.hub-intro h1{font-size:clamp(38px,5.5vw,64px);line-height:1.22;letter-spacing:1px;margin:20px 0 14px}.hub-dot{color:#ffdc62}.hub-intro p{color:#d2deff;font-size:18px;margin:0 0 32px}.hub-games{max-width:860px}.game-card{display:grid;grid-template-columns:36% 1fr;background:#fff9e8;color:#1b3157;text-decoration:none;border:3px solid #fff;border-radius:28px;overflow:hidden;box-shadow:0 10px 0 #0b2677;transition:transform .16s,box-shadow .16s}.game-card:hover{transform:translateY(-4px);box-shadow:0 14px 0 #0b2677}.game-card:focus-visible,.hub a:focus-visible{outline:5px solid #ffdc62;outline-offset:6px}.game-symbol{display:grid;place-items:center;background:#ffdc62;font-size:120px;min-height:300px}.game-info{padding:30px 34px}.game-type{font-size:14px;color:#6d5935;font-weight:700}.game-info h2{font-size:34px;margin:8px 0 10px}.game-info p{font-size:17px;line-height:1.6;margin:0 0 18px;color:#526078}.game-chips{display:flex;gap:8px;flex-wrap:wrap}.game-chips span{font-size:14px;background:#efe7d2;border-radius:8px;padding:6px 10px}.game-launch{margin-top:25px;min-height:52px;display:flex;justify-content:space-between;align-items:center;background:#2454dc;color:white;font-size:20px;font-weight:800;padding:12px 22px;border-radius:13px}.hub-footnote{color:#d2deff;font-size:14px;margin-top:26px}.back-home{font-size:15px}.hub [hidden]{display:none!important}@media(max-width:680px){.hub-nav{padding:22px 20px}.hub-domain{display:none}.hub-brand{font-size:22px}.hub-main{padding:20px 20px 30px}.hub-intro h1{font-size:40px}.hub-intro p{font-size:16px;margin-bottom:26px}.game-card{grid-template-columns:1fr;border-radius:23px}.game-symbol{min-height:145px;font-size:86px}.game-info{padding:24px}.game-info h2{font-size:29px}.back-home{font-size:14px;padding:10px 12px}}@media(prefers-reduced-motion:reduce){.game-card{transition:none}}

@media(max-width:680px){.difficulty{gap:8px}.segments{flex:1;justify-content:space-between}.segments button{padding:8px 12px;min-width:48px}}

/* Match the game library background while keeping the play surface readable. */
#puzzle-screen{min-height:100dvh;background:#163cac;color:#fff}#puzzle-screen .eyebrow,#puzzle-screen footer,#puzzle-screen #status{color:#d2deff}#puzzle-screen .playarea{color:#17305b}#puzzle-screen .hint input{accent-color:#ffdc62}#puzzle-screen .toolbar .primary{background:#ffdc62;color:#173985;box-shadow:0 4px 0 #d5ae36}#puzzle-screen .toolbar .primary:hover{background:#ffe786}

/* Two game entries on the public game-library homepage. */
.hub-games{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;max-width:1100px}.hub-games .game-card{grid-template-columns:1fr}.hub-games .game-symbol{min-height:170px;font-size:90px}.hub-games .game-info{padding:26px 28px}.hub-games .game-info h2{font-size:30px}.hub-games .game-info p{min-height:54px}.pet-symbol{background:#c6dfcc;color:#355b49}.pet-game-card .game-launch{background:#426b4c}.pet-game-card .game-chips span{background:#e0ead7}.game-access{display:block;margin-top:10px;font-size:12px;color:#687564;line-height:1.5}@media(max-width:680px){.hub-games{grid-template-columns:1fr;gap:26px}.hub-games .game-symbol{min-height:145px}.hub-games .game-info{padding:24px}.hub-games .game-info p{min-height:0}}
