@charset "UTF-8";
:root{--ink:#334b46;--muted:#74817a;--purple:#7650aa;--cream:#fffcef;--wood:#b3743d;--board-height:min(65vh,590px);font-family:"Malgun Gothic","Apple SD Gothic Neo",system-ui,sans-serif;color:var(--ink);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background:#c7ece7}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #8a5eb7;outline-offset:5px}button{touch-action:manipulation}button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}a{color:inherit;text-decoration:none}.scenery{position:fixed;inset:0;z-index:-3;background:#a9dfe5 url('assets/seaside.webp') center 52%/cover no-repeat}.scenery:after{content:"";position:absolute;inset:0;background:linear-gradient(#f9fff518,#eaffff0a 55%,#fff0c447)}.sunlight{position:fixed;inset:0;pointer-events:none;z-index:-2;background:radial-gradient(ellipse at 15% 3%,#fffbd85c,transparent 60%)}.topbar{height:84px;background:#fffdf0e8;border-bottom:1px solid #fff9;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,80px);box-shadow:0 3px 22px #385b3a08;backdrop-filter:blur(15px)}.brand{display:flex;align-items:center;gap:10px}.brand img{width:46px;height:46px;object-fit:contain}.brand>span{font-size:24px;font-weight:900;letter-spacing:-1.5px}.brand small{display:block;letter-spacing:1.2px;font-size:9px;color:#8d957d;font-weight:600;margin-top:2px}.top-actions{display:flex;align-items:center;gap:12px}.icon-button{width:38px;height:38px;background:#fffdf3c9;border:1px solid #d8ddcc;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#607366;transition:.15s}.icon-button:hover{background:white;transform:translateY(-1px)}.text-button{display:flex;gap:7px;align-items:center;border:0;background:none;color:#526654;font-size:12px;font-weight:700;padding:9px}.divider{width:1px;height:20px;background:#d6ddcd;margin:0 6px}main{max-width:1110px;padding:25px 24px 0;margin:auto}.game-layout{display:grid;grid-template-columns:210px minmax(0,1fr) 190px;gap:36px;align-items:start;max-width:1050px;margin:auto}.left-panel{padding-top:36px}.score-card{background:linear-gradient(145deg,#9263bd,#72509e 70%);color:white;border:1px solid #b18bd0;border-radius:21px;padding:21px 22px 0;box-shadow:0 7px 0 #5b3e8028,0 15px 30px #4a3b5620,inset 0 2px 1px #ffffff36;position:relative;overflow:hidden}.score-card:after{content:"";position:absolute;width:140px;height:140px;border:1px solid #ffffff0c;border-radius:50%;top:-95px;right:-35px;box-shadow:0 0 0 20px #ffffff05,0 0 0 40px #ffffff04}.score-heading{font-size:12px;display:flex;justify-content:space-between;align-items:center;color:#f5eaff}.little-star{color:#f4d779;font-size:19px}.score-number{font-weight:900;font-size:53px;letter-spacing:-2px;line-height:1.5;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;text-shadow:0 2px 0 #4e367134}.best-row{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff26;margin:7px -22px 0;padding:14px 20px;background:#34204b10;font-size:11px;color:#eadcf6}.best-row strong{color:#fff1a4;font-size:14px;letter-spacing:.5px}.summer-note{padding:35px 7px 17px;text-shadow:0 1px #fff9}.eyebrow{font-size:9px;letter-spacing:1.6px;font-weight:800;color:#6d8570}h1{font-size:26px;letter-spacing:-1.4px;line-height:1.5;margin:12px 0}p{line-height:1.9}.summer-note p{font-size:12px;color:#5d786c}.mini-wave{color:#5f9f96;font-size:24px;letter-spacing:5px;margin-top:18px}.goal-card{display:flex;align-items:center;gap:10px;padding:13px 10px;background:#fffdf0b8;border:1px solid #fff8;border-radius:14px;box-shadow:0 5px 15px #59644508}.goal-card img{width:45px;height:45px;object-fit:contain}.goal-card small{font-size:10px;color:#819079;display:block;margin-bottom:5px}.goal-card strong{font-size:11px}.board-caption{display:flex;align-items:center;gap:7px;height:36px;font-size:10px;font-weight:700;padding:0 7px;color:#4e7469;text-shadow:0 1px #fff8}.live-dot{width:5px;height:5px;border-radius:50%;background:#65966a}.weather{margin-left:auto;color:#9a8541;white-space:nowrap}.wooden-box{width:min(100%,calc(var(--board-height) * 450 / 590));height:auto;aspect-ratio:450/590;max-width:100%;position:relative;margin:auto;border-radius:8px 8px 15px 15px;background:linear-gradient(110deg,#ffffff3a,#ecfff922 28%,#f3ffff0b 67%,#fff6);box-shadow:inset 0 0 22px #fff5,0 20px 30px #66461d28;border-left:1px solid #ffffffe0;border-right:1px solid #ffffffb0;isolation:isolate}.wooden-box:before{content:"";position:absolute;inset:0 10px 20px;border-radius:6px;border:1px solid #eaffff8a;box-shadow:inset 5px 0 10px #e8f7f845;pointer-events:none;z-index:3}.wooden-box:after{content:"";position:absolute;bottom:-11px;left:8%;right:8%;height:16px;background:#5e54394d;filter:blur(12px);z-index:-1}.wood-post{position:absolute;top:0;bottom:14px;width:14px;border-radius:7px 7px 1px 1px;background:repeating-linear-gradient(91deg,transparent 0 3px,#8b4e2826 3.5px 4px,transparent 5px 9px),linear-gradient(90deg,#9b5c2f,#edbc7e 30%,#d79c60 65%,#96592b);box-shadow:inset 1px 0 2px #fff7,2px 3px 5px #7e592a35;z-index:4;pointer-events:none}.post-left{left:-11px}.post-right{right:-11px}.wood-post:before{content:"";position:absolute;top:-4px;left:-3px;width:20px;height:11px;background:linear-gradient(#f2c991,#b77d43);border-radius:4px;box-shadow:0 1px 1px #764b2b}.wood-base{position:absolute;bottom:0;left:-16px;right:-16px;height:30px;border-radius:5px 5px 9px 9px;background:repeating-linear-gradient(0deg,transparent 0 7px,#8e512a18 8px,transparent 9px 13px),linear-gradient(#edc28b,#cf9253 40%,#b5753c 85%,#8d552e);box-shadow:inset 0 2px 1px #fff7,0 5px 0 #83562f,0 8px 10px #79502d22;display:grid;place-items:center;z-index:5;pointer-events:none}.wood-base span{font-family:Georgia,serif;font-size:8px;letter-spacing:2.2px;color:#704a2d9c;text-shadow:0 1px #fddba577}.glass-shine{position:absolute;left:7%;top:15%;width:9px;height:61%;background:linear-gradient(#fff0,#ffffff80,#ffffff15);border-radius:100%;transform:rotate(5deg);pointer-events:none;z-index:3}canvas{width:100%;height:100%;display:block;touch-action:none;border-radius:7px 7px 12px 12px;cursor:crosshair}.board-overlay{position:absolute;inset:0 0 30px;display:flex;align-items:center;justify-content:center;z-index:7;background:linear-gradient(#f6fffa15,#f5f9e42c);border-radius:7px;backdrop-filter:blur(1px)}.board-overlay[hidden]{display:none}.overlay-card{margin:5% 12px 0;background:#fffdf2f2;padding:26px 26px 20px;border:1px solid #fff;border-radius:24px;box-shadow:0 10px 40px #3a676b26,inset 0 0 15px #fff8;text-align:center;max-width:300px;width:84%;animation:card-in .35s ease}.pill{font-size:9px;letter-spacing:1.1px;color:#7c659c;background:#eee6f4;border-radius:20px;padding:6px 11px;font-weight:700;display:inline-block}.overlay-card h2{font-size:28px;line-height:1.4;letter-spacing:-1.4px;margin:16px 0 10px}.overlay-card p{color:#778276;font-size:12px;margin:0 0 18px}.primary-button{width:100%;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(#9570bd,#7953a4);box-shadow:0 4px 0 #63428b, inset 0 1px #ffffff52;border:1px solid #946db5;border-radius:12px;padding:13px 18px;color:white;font-size:13px;font-weight:800;transition:.12s}.primary-button:hover{filter:brightness(1.08);transform:translateY(-1px)}.primary-button:active{transform:translateY(3px);box-shadow:0 1px 0 #63428b}.primary-button span{font-size:19px;font-weight:400}.quiet-button{margin-top:12px;border:0;background:transparent;color:#85758b;font-size:11px;padding:9px}.quiet-button[hidden]{display:none}.drop-hint{display:flex;align-items:center;justify-content:center;gap:8px;font-size:10px;color:#536e58;text-align:center;margin:20px -20px 0;text-shadow:0 1px #fff9}.hint-icon{width:19px;height:19px;border-radius:50%;border:1px solid #829d79;display:grid;place-items:center;font-size:13px}.right-panel{padding-top:36px}.next-card{background:#fffdf0e5;border:1px solid #fff;border-radius:21px;padding:18px 18px 21px;text-align:center;box-shadow:0 6px 20px #47797012}.card-label{display:flex;justify-content:space-between;font-size:11px;font-weight:800;color:#667b67}.card-label span{font-size:16px;color:#9eaf93}.next-fruit{width:88px;height:88px;border-radius:50%;margin:15px auto 6px;display:grid;place-items:center;background:radial-gradient(#fffef4,#f2edda99);border:1px solid #ece8d8}.next-fruit img{width:72%;height:72%;object-fit:contain;filter:drop-shadow(0 5px 3px #9e7f6825)}.next-card>strong{display:block;font-size:13px;color:#5f6a58}.next-card>small{display:block;font-size:8px;margin-top:10px;color:#919a89}.how-card{padding:28px 9px 0}.how-card>div{display:flex;align-items:flex-start;gap:11px;margin-top:17px}.how-card b{font-family:Georgia,serif;font-size:11px;color:#92a792;padding-top:4px}.how-card p{margin:0;font-size:10px;color:#6f8c79;line-height:1.7}.how-card p strong{color:#486e5b;font-weight:700}.session-note{font-size:10px;color:#64816d;line-height:1.9;padding:24px 9px;font-style:italic}.evolution{max-width:850px;margin:26px auto 0;background:#fffdf2e8;border:1px solid #fff;border-radius:19px;padding:14px 24px 12px;box-shadow:0 5px 20px #8271390c}.evolution-heading{display:flex;align-items:center;gap:13px;margin-bottom:10px}.evolution-heading strong{font-size:11px}.evolution-heading>span{font-size:9px;color:#99a08d}.fruit-chain{display:flex;align-items:center;justify-content:space-between;gap:4px}.fruit-step{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;position:relative}.fruit-step img{width:43px;height:43px;object-fit:contain;transition:.3s;filter:drop-shadow(0 3px 2px #7564421c)}.fruit-step span{font-size:8px;white-space:nowrap;color:#8c927d}.fruit-step.reached span{color:#5d7258;font-weight:800}.fruit-step.reached img{transform:translateY(-3px)}.chain-arrow{font-size:12px;color:#c7c8b7;align-self:center;margin-bottom:16px}.fruit-step:last-child{background:#e8efd6;border-radius:12px;padding:3px 10px;margin:-3px -8px}footer{display:flex;justify-content:space-between;max-width:1110px;padding:20px 24px 15px;margin:auto;color:#738169;font-size:9px;text-shadow:0 1px #ffffff80}footer span:last-child{font-size:8px;letter-spacing:.3px}dialog{border:1px solid #fff;border-radius:25px;background:#fffdf2;max-width:430px;width:calc(100% - 32px);padding:25px;color:var(--ink);box-shadow:0 20px 100px #25414044}dialog::backdrop{background:#274f5355;backdrop-filter:blur(5px)}.dialog-header{display:flex;justify-content:space-between;align-items:center}dialog h2{font-size:27px;letter-spacing:-1px;line-height:1.4}dialog p{font-size:12px;color:#74806e}dialog .primary-button{margin-top:20px}.key-help{font-size:10px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;color:#74806e}kbd{border:1px solid #d7ddcd;border-bottom-width:3px;border-radius:5px;padding:3px 5px;background:#f7f6e9;font-size:10px}.toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%,20px);background:#3a5e4eea;color:#fffcec;padding:12px 24px;border-radius:40px;font-size:12px;opacity:0;transition:.3s;pointer-events:none;z-index:20;text-align:center;max-width:90%}.toast.visible{opacity:1;transform:translate(-50%,0)}.score-bump{animation:bump .25s}.wooden-box.celebrate{animation:happy .4s}.wooden-box.danger{box-shadow:0 0 20px #df625c88,inset 0 0 30px #f9b7b72b}.wooden-box.danger .wood-post{filter:saturate(1.3)}@keyframes bump{50%{transform:scale(1.1)}}@keyframes happy{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes card-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1500px){:root{--board-height:min(67vh,660px)}main{padding-top:34px}.game-layout{gap:48px;grid-template-columns:220px minmax(0,1fr) 200px}}
@media(max-height:820px) and (min-width:761px){:root{--board-height:61vh}.topbar{height:70px}main{padding-top:14px}.evolution{margin-top:20px;padding:10px 24px}.summer-note{padding-top:24px}h1{font-size:23px}.goal-card{margin-top:0}.session-note{padding-top:18px}.fruit-step img{width:35px;height:35px}footer{padding-top:12px}.evolution-heading{margin-bottom:7px}}
@media(max-width:1000px) and (min-width:761px){.game-layout{gap:25px;grid-template-columns:170px minmax(0,1fr) 160px}.summer-note h1{font-size:23px}.score-card{padding-left:18px;padding-right:18px}.goal-card strong{font-size:10px}.topbar{padding:0 30px}}
@media(max-width:760px){:root{--board-height:min(63svh,580px)}.topbar{height:67px;padding:0 18px}.brand{gap:7px}.brand img{width:35px;height:35px}.brand>span{font-size:21px}.brand small{font-size:7px;letter-spacing:.8px}.top-actions{gap:6px}.icon-button{width:31px;height:31px}.icon-button svg{width:16px;height:16px}.divider{display:none}.text-button{font-size:0;padding:7px 3px}.text-button svg{width:17px;height:17px}main{padding:12px 18px 0}.game-layout{max-width:450px;grid-template-columns:1fr 1fr;gap:10px 12px}.left-panel{grid-column:1;padding-top:0}.right-panel{grid-column:2;grid-row:1;padding-top:0}.summer-note,.goal-card,.how-card,.session-note{display:none}.score-card{padding:8px 13px 0;border-radius:13px;height:83px;box-shadow:0 3px 0 #5b3e8020}.score-heading{font-size:9px}.little-star{font-size:12px}.score-number{font-size:27px;line-height:1.3;letter-spacing:-1px}.best-row{position:absolute;right:12px;top:29px;border:0;display:flex;flex-direction:column;gap:4px;padding:0;margin:0;font-size:8px;background:none}.best-row strong{font-size:12px}.next-card{height:83px;border-radius:13px;padding:9px 12px;text-align:left;position:relative}.card-label{font-size:9px;width:calc(100% - 55px)}.card-label span{font-size:11px}.next-fruit{position:absolute;width:58px;height:58px;right:8px;top:11px;margin:0}.next-card>strong{font-size:12px;margin-top:9px}.next-card>small{font-size:7px;max-width:90px;margin-top:4px}.play-section{grid-column:1/3;grid-row:2;margin:0 10px}.board-caption{height:27px;font-size:8px}.wooden-box{--board-height:min(60svh,560px)}.wood-post{width:12px}.post-left{left:-9px}.post-right{right:-9px}.wood-base{left:-13px;right:-13px;height:25px}.wood-base span{font-size:6px;letter-spacing:1.8px}.drop-hint{font-size:8px;gap:5px;margin-top:15px}.hint-icon{width:16px;height:16px;font-size:11px}.overlay-card{padding:22px 21px 18px;max-width:265px}.overlay-card h2{font-size:25px;margin-top:13px}.overlay-card p{font-size:11px}.primary-button{padding:11px 15px;font-size:12px}.evolution{padding:11px 13px 9px;margin-top:15px;max-width:450px;border-radius:14px}.evolution-heading{margin-bottom:8px}.evolution-heading strong{font-size:9px}.evolution-heading>span{font-size:7px}.fruit-step img{width:30px;height:30px}.fruit-step span{font-size:6px}.chain-arrow{font-size:8px;margin-bottom:12px}.fruit-chain{gap:0}.fruit-step:last-child{padding:2px 5px;margin:-2px -3px}footer{max-width:486px;padding:13px 19px;font-size:8px}footer span:last-child{display:none}}
@media(max-width:370px){.topbar{padding:0 12px}.top-actions{gap:3px}.brand small{font-size:6px}main{padding:10px 13px 0}.next-card>small{display:none}.fruit-step img{width:26px;height:26px}.next-fruit{right:5px;width:50px;height:50px;top:15px}.score-number{font-size:25px}.best-row{right:8px;font-size:7px}}
@media(min-width:761px){.summer-note{background:#fffdf0ba;border:1px solid #fff8;border-radius:17px;margin-top:21px;padding:18px 17px 11px;backdrop-filter:blur(8px)}.summer-note h1{font-size:23px;margin:9px 0}.summer-note .eyebrow{font-size:8px}.summer-note p{margin:7px 0}.mini-wave{margin-top:7px}.goal-card{margin-top:14px}.how-card{background:#fffdf0b8;border:1px solid #fff8;border-radius:17px;padding:17px 16px;margin-top:21px;backdrop-filter:blur(8px)}.how-card>div{margin-top:14px}.session-note{background:#fffdf07a;border-radius:13px;margin-top:14px;padding:13px 14px}}
.ranking-button{height:35px;display:inline-flex;align-items:center;gap:6px;border:1px solid #d7c6e4;border-radius:30px;background:#f4edf9;color:#7a559d;padding:0 12px;font-size:11px;font-weight:800}.ranking-button>span:first-child{font-size:19px;color:#b18c3d}.rank-over-button{color:#7953a4;font-weight:800}.rank-over-button[hidden]{display:none}.ranking-title{display:flex;gap:14px;align-items:center;margin:20px 0}.ranking-title>span{font-size:47px;color:#b18c3d;text-shadow:0 2px #fff0b2}.ranking-title h2{font-size:23px;margin:0;letter-spacing:-1px}.ranking-title p{font-size:10px;margin:4px 0 0;color:#969c84}#ranking-dialog{max-width:445px;max-height:90svh;overflow:auto}#ranking-form{background:#f0e9f5;border:1px solid #e4d8ef;border-radius:15px;padding:17px;margin:0 0 18px}#ranking-form[hidden]{display:none}.rank-congrats{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;color:#7953a4;font-size:13px}.rank-congrats span{font-size:19px;font-weight:900}#ranking-form label{display:block;font-size:11px;font-weight:700;margin-bottom:7px}.name-field{position:relative}.name-field input{width:100%;border:1px solid #d1bcdf;border-radius:10px;background:#fffdf6;padding:12px 52px 12px 12px;font:inherit;font-size:14px;color:#455648}.name-field input:focus{outline:2px solid #9570bd;outline-offset:1px}.name-field>span{position:absolute;right:12px;top:15px;font-size:9px;color:#9c8da3}#rank-name-hint{display:block;font-size:9px;color:#8b7b94;margin-top:6px}.rank-error{min-height:15px;font-size:10px!important;color:#b75a59!important;line-height:1.5;margin:5px 0!important}#ranking-form .primary-button{margin-top:4px}#skip-ranking{display:block;margin:13px auto -5px;padding:6px}.ranking-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}.ranking-table th{font-size:9px;text-align:left;color:#9c9e88;font-weight:500;padding:9px 8px;border-bottom:1px solid #e6e8d8}.ranking-table th:last-child{text-align:right}.ranking-table td{font-size:12px;padding:12px 8px;border-bottom:1px solid #eeefdf}.ranking-table td:first-child{width:47px;color:#a5a58f;font-family:Georgia,serif;font-weight:bold}.ranking-table td:last-child{text-align:right;color:#7953a4;font-weight:800}.ranking-table tr:nth-child(1) td:first-child{color:#bd963f;font-size:18px}.ranking-table tr:nth-child(2) td:first-child{color:#8d9caa;font-size:16px}.ranking-table tr:nth-child(3) td:first-child{color:#ba8c72;font-size:15px}.ranking-table tr.my-rank{background:#eee6f5}.ranking-table tr.my-rank td:nth-child(2){font-weight:800}.ranking-table td:nth-child(2){overflow-wrap:anywhere}#ranking-empty{text-align:center;font-size:12px;line-height:2;color:#999f88;padding:25px 0}#ranking-feedback{font-size:12px;line-height:1.8;color:#6d915d;text-align:center}.rank-footnote{font-size:9px!important;color:#9e9e88!important;margin-top:13px}#ranking-ok{margin-top:14px}@media(max-width:760px){.ranking-button{width:31px;height:31px;padding:0;justify-content:center}.ranking-label{display:none}.top-actions{gap:4px}#ranking-dialog{padding:21px}.ranking-title h2{font-size:22px}.ranking-table td{padding:10px 7px}}
#ranking-ok[hidden]{display:none}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
