@import"https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@400;500;700&family=Kaisei+Opti:wght@400;700&family=RocknRoll+One&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Kiwi Maru,sans-serif}.app{min-height:100vh;background:#f4f8f2;background-image:radial-gradient(circle at 10% 20%,rgba(140,190,140,.12) 0%,transparent 40%),radial-gradient(circle at 90% 80%,rgba(180,220,160,.1) 0%,transparent 40%),url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='30' cy='30' r='1.5' fill='%23a0c8a0' fill-opacity='.15'/%3E%3C/svg%3E");color:#2e4a2e}.header{background:linear-gradient(135deg,#88b878,#6a9e5a);padding:12px 16px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 3px 12px #6a9e5a40;position:sticky;top:0;z-index:100}.header-title{font-family:RocknRoll One,sans-serif;font-size:19px;color:#fff;letter-spacing:.05em;display:flex;align-items:center;gap:6px;cursor:pointer}.nav{display:flex;gap:3px;background:#ffffff38;border-radius:20px;padding:3px}.nav-btn{background:transparent;border:none;color:#ffffffe0;padding:4px 11px;border-radius:16px;font-size:12px;cursor:pointer;font-family:Kiwi Maru,sans-serif;font-weight:500;transition:all .2s;white-space:nowrap}.nav-btn.active{background:#fff;color:#6a9e5a}.nav-btn:hover:not(.active){background:#ffffff26}.page{padding:16px;max-width:500px;margin:0 auto}.btn{display:block;width:100%;padding:13px;border-radius:14px;border:none;font-family:Kiwi Maru,sans-serif;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s;letter-spacing:.03em}.btn-primary{background:linear-gradient(135deg,#88b878,#6a9e5a);color:#fff;box-shadow:0 4px 12px #6a9e5a52}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 16px #6a9e5a66}.btn-primary:disabled{background:#c0d8b8;box-shadow:none;cursor:not-allowed;transform:none}.btn-resume{background:linear-gradient(135deg,#f0a060,#e88040);color:#fff;box-shadow:0 4px 12px #e8804052}.btn-resume:hover{transform:translateY(-1px)}.btn-secondary{background:#fff;color:#6a9e5a;border:2px solid #88b878}.btn-secondary:hover{background:#f4f8f2}.btn-cancel{background:#eef4ec;color:#5a7a52;border:none}.btn-cancel:hover{background:#e4eee0}.btn-danger{background:#fff0f0;color:#c94040;border:2px solid #f8c8c8;font-size:13px;padding:10px}.btn-danger:hover{background:#ffe0e0}.btn-regen{background:linear-gradient(135deg,#eef8e8,#dff0d8);color:#4a8040;border:1.5px solid #b8d8b0;font-size:13px;padding:10px 14px;border-radius:12px;width:auto;display:inline-flex;align-items:center;gap:5px;cursor:pointer;font-family:Kiwi Maru,sans-serif}.btn-regen:hover{background:linear-gradient(135deg,#dff0d8,#d0e8c8)}.btn-regen:disabled{opacity:.5;cursor:not-allowed}.input{width:100%;padding:11px 14px;border-radius:12px;border:2px solid #c8dcc0;font-family:Kiwi Maru,sans-serif;font-size:15px;color:#2e4a2e;background:#f4f8f2;outline:none;transition:border-color .2s}.input:focus{border-color:#88b878}.input-join{text-transform:uppercase;letter-spacing:.1em;font-size:16px;margin-bottom:12px}.error-text{font-size:12px;color:#c94040;margin-bottom:8px}.card-box{background:#fff;border-radius:18px;padding:18px 20px;margin-bottom:14px;box-shadow:0 2px 16px #64a05a14;border:2px solid #d4e8cc}.card-box h3{font-family:RocknRoll One,sans-serif;font-size:15px;color:#2e4a2e;margin-bottom:14px;display:flex;align-items:center;gap:7px}.setup-label{font-size:12px;color:#6a8a62;margin-bottom:8px;font-weight:700}.home-hero{text-align:center;padding:24px 0 18px}.home-icon{font-size:60px;display:block;margin-bottom:10px;animation:sway 3s ease-in-out infinite}.home-icon img{width:400px;max-width:100%;display:block;margin:0 auto}@keyframes sway{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}.home-title{font-family:RocknRoll One,sans-serif;font-size:26px;color:#6a9e5a;margin-bottom:6px}.home-sub{color:#6a8a62;font-size:13px;line-height:1.6}.chip-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}.chip{padding:6px 14px;border-radius:20px;border:2px solid #c8dcc0;background:#f4f8f2;font-size:13px;cursor:pointer;transition:all .15s;font-family:Kiwi Maru,sans-serif;font-weight:500;color:#6a8a62;display:flex;align-items:center;gap:4px}.chip:hover{border-color:#88b878;background:#eaf4e4}.chip.selected{background:linear-gradient(135deg,#88b878,#6a9e5a);color:#fff;border-color:#6a9e5a}.chip-sub{font-size:10px;opacity:.8}.theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:14px}.theme-card{border:2px solid #c8dcc0;border-radius:13px;padding:10px 6px;background:#f4f8f2;cursor:pointer;transition:all .15s;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.theme-card:hover{border-color:#88b878;background:#eaf4e4;transform:translateY(-1px)}.theme-card.selected{background:linear-gradient(135deg,#e4f0dc,#d8eacc);border-color:#88b878;box-shadow:0 2px 8px #6a9e5a2e}.theme-card-emoji{font-size:22px}.theme-card-label{font-size:10px;font-weight:700;color:#2e4a2e}.theme-card-desc{font-size:8.5px;color:#6a8a62;line-height:1.3}.resume-card{background:linear-gradient(135deg,#fff6ee,#feecd8);border:2px solid #f0c898}.resume-progress{font-size:13px;color:#6a8a62;margin-bottom:14px}.bingo-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.room-code-badge{background:#fff;border:2px solid #c8dcc0;border-radius:12px;padding:5px 11px;font-size:12px;color:#6a8a62;display:flex;align-items:center;gap:5px}.room-code-badge strong{color:#6a9e5a;font-size:15px;letter-spacing:.15em}.copy-btn{background:none;border:none;cursor:pointer;font-size:14px;padding:2px 4px;border-radius:6px}.copy-btn:hover{background:#eaf4e4}.bingo-info{font-size:12px;color:#6a8a62}.theme-tag{display:inline-flex;align-items:center;gap:4px;background:#eaf4e4;border:1.5px solid #b8d8b0;border-radius:20px;padding:3px 10px;font-size:11px;color:#6a9e5a;margin-bottom:10px}.progress-bar{background:#d0e8c8;border-radius:10px;height:7px;margin-bottom:10px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#88b878,#f0a060);border-radius:10px;transition:width .4s ease}.bingo-banner{background:linear-gradient(135deg,#f0a060,#e88040);color:#fff;text-align:center;padding:10px;border-radius:12px;font-family:RocknRoll One,sans-serif;font-size:16px;margin-bottom:10px;animation:pop-in .4s cubic-bezier(.34,1.56,.64,1);box-shadow:0 4px 12px #f0a06059}@keyframes pop-in{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.grid5{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-bottom:14px}.cell{aspect-ratio:1;border-radius:10px;border:1.5px solid #c8dcc0;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .15s;padding:2px;text-align:center;position:relative;overflow:hidden}.cell:hover:not(.found):not(.free-cell){border-color:#88b878;background:#eaf4e4;transform:scale(1.04)}.cell-emoji{font-size:18px;line-height:1;margin-bottom:1px}.cell-text{font-size:7px;line-height:1.3;color:#6a8a62;font-weight:500;word-break:break-all}.cell.found{background:linear-gradient(135deg,#e4f0dc,#d8eacc);border-color:#88b878;cursor:default}.cell-photo{position:absolute;top:0;right:0;bottom:0;left:0;object-fit:cover;border-radius:9px;opacity:.55;width:100%;height:100%}.cell-check{position:absolute;top:3px;right:3px;background:#88b878;color:#fff;border-radius:50%;width:15px;height:15px;display:flex;align-items:center;justify-content:center;font-size:9px;z-index:2}.free-cell{background:linear-gradient(135deg,#fff8e8,#fef0c8)!important;border-color:#f0c850!important;cursor:default!important}.free-cell .cell-text{font-size:8px;color:#b08020;font-weight:700}.cell.spinning .cell-emoji{animation:spin-emoji .5s ease}@keyframes spin-emoji{0%{transform:rotate(0) scale(.5);opacity:0}to{transform:rotate(360deg) scale(1);opacity:1}}.in-bingo{border-color:#f0a060!important;box-shadow:0 0 0 2px #f0a0604d!important}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:16px}.loader{width:46px;height:46px;border-radius:50%;border:4px solid #c8dcc0;border-top-color:#88b878;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.collection-empty{text-align:center;padding:50px 20px;color:#6a8a62}.collection-empty span{font-size:54px;display:block;margin-bottom:14px;opacity:.5}.collection-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.collection-card{background:#fff;border-radius:14px;overflow:hidden;border:2px solid #d4e8cc;cursor:pointer;transition:transform .15s,box-shadow .15s}.collection-card:hover{transform:translateY(-2px);box-shadow:0 6px 16px #64a05a1f}.cc-preview{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;padding:8px;background:#f4f8f2}.cc-cell{aspect-ratio:1;border-radius:3px;background:#c8dcc0;display:flex;align-items:center;justify-content:center;font-size:7px}.cc-cell.found{background:#88b87861}.cc-cell.free{background:#f0c85066}.cc-info{padding:8px 10px}.cc-season{font-size:10px;color:#6a8a62}.cc-date{font-size:11px;font-weight:700;color:#2e4a2e}.cc-count{font-size:10px;color:#6a9e5a;font-weight:500}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#1e321e73;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fade-in .2s ease}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.modal{background:#fff;border-radius:22px;padding:22px;max-width:360px;width:100%;animation:slide-up .3s cubic-bezier(.34,1.56,.64,1);max-height:90vh;overflow-y:auto}@keyframes slide-up{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.modal h3{font-family:RocknRoll One,sans-serif;font-size:17px;text-align:center;margin-bottom:5px}.modal-sub{font-size:12px;color:#6a8a62;text-align:center;margin-bottom:16px}.photo-preview{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;margin-bottom:14px;border:2px solid #c8dcc0}.photo-upload{width:100%;aspect-ratio:4/3;border-radius:14px;border:2px dashed #b8d8b0;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;margin-bottom:14px;background:#f4f8f2;transition:all .2s;color:#6a8a62;font-size:13px;gap:7px}.photo-upload:hover{border-color:#88b878;background:#eaf4e4}.photo-upload span{font-size:32px}input[type=file]{display:none}.modal-actions{display:flex;gap:8px}.modal-actions .btn{flex:1}.modal-sep{height:1px;background:#d4e8cc;margin:14px 0}.regen-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.regen-label{font-size:12px;color:#6a8a62;flex:1;line-height:1.4}.regen-spinning{opacity:.5;pointer-events:none}.mini-grid5{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin-bottom:14px}.mini-cell{aspect-ratio:1;border-radius:7px;border:1.5px solid #c8dcc0;background:#f4f8f2;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:6.5px;text-align:center;padding:2px;position:relative;overflow:hidden;color:#6a8a62}.mini-cell.found{border-color:#88b878;background:#e4f0dc}.mini-cell.free{border-color:#f0c850;background:#fff8e8}.mini-cell>span{font-size:12px}.mini-cell>img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;opacity:.5;border-radius:6px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:#2e4a2e;color:#fff;padding:9px 18px;border-radius:20px;font-size:13px;z-index:300;white-space:nowrap;pointer-events:none;animation:toast-in .3s ease,toast-out .3s ease 1.9s forwards}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes toast-out{to{opacity:0;transform:translate(-50%) translateY(10px)}}