:root{--navy:#06243a;--navy2:#0a3553;--ice:#d9f2f3;--sky:#78c8dc;--gold:#efbd56;--amber:#c77a28;--cream:#fff8e9;--ink:#163244;--panel:rgba(251,248,235,.94);--line:rgba(13,57,79,.15);--shadow:0 18px 50px rgba(2,24,40,.23)}*{box-sizing:border-box}html{background:#061d30}body{margin:0;min-height:100vh;color:var(--ink);font-family:Nunito,system-ui,sans-serif;background:radial-gradient(circle at 50% 0,#1b6681 0,#092c46 48%,#041725 100%);overflow-x:hidden}.snow{position:fixed;inset:0;pointer-events:none;opacity:.5;background-image:radial-gradient(circle,#fff 1px,transparent 1.5px),radial-gradient(circle,#fff 1.5px,transparent 2px);background-size:33px 33px,67px 67px;background-position:0 0,20px 20px;animation:snow 18s linear infinite}@keyframes snow{to{background-position:60px 300px,-30px 420px}}button,input,select{font:inherit}.app-shell{position:relative;width:min(100%,580px);min-height:100vh;margin:auto;background:linear-gradient(#dff4f4,#f5f0e3 38%,#eef6f2);box-shadow:0 0 80px #0009;overflow:hidden}.topbar{height:76px;padding:env(safe-area-inset-top) 18px 0;display:flex;align-items:center;justify-content:space-between;color:white;background:linear-gradient(135deg,#072b46,#0c4465);border-bottom:1px solid #ffffff33;position:sticky;top:0;z-index:20}.avatar{width:42px;height:42px;border-radius:50%;border:2px solid #e6bd63;background:linear-gradient(145deg,#2b718a,#123c5a);color:#fff;font-weight:900}.brand{text-align:center;line-height:1}.brand-kicker{display:block;color:#f2cb73;font:700 12px/1 Cormorant Garamond,serif;letter-spacing:.26em}.brand-title{display:block;margin-top:6px;font:700 22px/1 Cormorant Garamond,serif}.currency{display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:20px;background:#001d3199;border:1px solid #ffffff22}.crystal-mini{color:#72e1f1;text-shadow:0 0 10px #7df6ff}.view{display:none;padding-bottom:104px;animation:appear .35s ease}.view.active{display:block}@keyframes appear{from{opacity:.25;transform:translateY(6px)}}.quest-scene{height:470px;position:relative;padding:28px 24px;color:white;background:url('images/jegbarlang.jpg') center 50%/cover no-repeat;display:flex;flex-direction:column;justify-content:flex-end}.scene-shade{position:absolute;inset:0;background:linear-gradient(#03223944 0%,#03223922 33%,#031827dc 100%)}.quest-copy,.scene-progress,.chapter-badge{position:relative}.chapter-badge{position:absolute;top:22px;left:22px;padding:8px 12px;border:1px solid #f4cd74aa;border-radius:20px;background:#08263ccc;color:#ffe09a;font-size:13px;font-weight:800}.greeting{margin:0 0 4px;color:#a9ecf0;font-weight:800}.quest-copy h1,.page-intro h1{font:700 clamp(34px,8vw,48px)/.95 Cormorant Garamond,serif;margin:0;text-shadow:0 3px 18px #00121c}.quest-copy>p:last-child{font-size:16px;line-height:1.5;max-width:470px;margin:14px 0 20px;color:#eefcfc}.progress-label{display:flex;justify-content:space-between;font-size:14px;margin-bottom:8px}.progress-track{height:12px;background:#071b2b99;border:1px solid #ffffff30;border-radius:30px;overflow:hidden}.progress-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,#50cadd,#a3f7ee);box-shadow:0 0 14px #75f5ff;transition:width .45s}.daily-card{margin:-14px 14px 0;padding:22px 18px 18px;position:relative;background:var(--panel);border-radius:22px;box-shadow:var(--shadow);border:1px solid #fff}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:14px}.eyebrow{font-size:12px;letter-spacing:.14em;font-weight:900;color:#34738b}.section-heading h2,.upgrade-card h2{font:700 25px/1.1 Cormorant Garamond,serif;margin:3px 0}.reward-pill{white-space:nowrap;padding:7px 11px;border-radius:18px;color:#7c541a;background:#f7df9d;font-weight:900}.task-list{margin:14px 0}.task{width:100%;display:grid;grid-template-columns:46px 1fr 32px;align-items:center;gap:12px;border:0;border-top:1px solid var(--line);padding:13px 2px;background:none;text-align:left;color:var(--ink);cursor:pointer}.task:first-child{border-top:0}.task-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:#e3f2ee;font-size:22px}.task-title{font-weight:900;font-size:16px}.task small{display:block;color:#5d7480;margin-top:2px}.check{height:26px;width:26px;border:2px solid #79a8ad;border-radius:50%;display:grid;place-items:center;color:white}.task.done .check{background:#2ca8a0;border-color:#2ca8a0}.task.done .task-title{text-decoration:line-through;color:#6d8187}.story-button{width:100%;border:0;border-radius:14px;padding:14px;color:white;background:linear-gradient(#257fa1,#0d577c);box-shadow:0 6px 0 #073a55;font-weight:900;font-size:16px}.story-button:disabled{filter:grayscale(1);opacity:.45}.pipo-message{display:grid;grid-template-columns:84px 1fr;gap:16px;margin:18px 14px;padding:16px;background:linear-gradient(135deg,#0b3c5d,#0b2942);border:1px solid #e4ba5d88;border-radius:20px;color:white;box-shadow:var(--shadow)}.pipo-portrait{width:82px;height:82px;border-radius:50%;background:url('images/pipo-tip.jpg') center/cover no-repeat;border:3px solid #e4bc64}.pipo-message .eyebrow{color:#eec66f}.pipo-message p{margin:5px 0 0;line-height:1.45}.page-intro{padding:42px 24px 28px;color:white;background:linear-gradient(150deg,#0d5474,#072a47)}.page-intro h1{text-shadow:none;margin-top:5px}.page-intro p{margin:12px 0 0;line-height:1.5;color:#d7f2f2}.village-scene{height:430px;position:relative;overflow:hidden;background:linear-gradient(#07385b 0,#1d7892 53%,#abd9d8 54%,#e5f2e5 100%)}.aurora{position:absolute;inset:-20% -30% 35%;background:radial-gradient(ellipse,#83f1d566,transparent 65%);transform:rotate(-15deg);filter:blur(8px);animation:aurora 5s ease-in-out infinite alternate}@keyframes aurora{to{transform:rotate(-4deg) translateX(20px)}}.moon{position:absolute;top:28px;right:36px;color:#ffe6a7;font-size:58px;text-shadow:0 0 30px #fff}.mountain{position:absolute;bottom:45%;width:65%;height:45%;background:#8ebac5;clip-path:polygon(50% 0,100% 100%,0 100%)}.mountain-a{left:-12%}.mountain-b{right:-18%;transform:scale(.8);opacity:.7}.village-ground{position:absolute;left:-10%;bottom:-15%;width:120%;height:53%;background:#e8f3eb;border-radius:50% 50% 0 0/20% 20% 0 0;box-shadow:inset 0 12px 30px #fff}.building{position:absolute;z-index:2;width:120px;border:0;background:none;color:#133344;text-align:center;font-weight:800;cursor:pointer}.building .building-icon{display:grid;place-items:center;margin:auto;width:74px;height:76px;color:#7d4b29;font-size:44px;background:linear-gradient(#ffe0a3,#c47c36);clip-path:polygon(50% 0,92% 32%,84% 100%,16% 100%,8% 32%);filter:drop-shadow(0 6px 5px #07253855)}.building strong,.building small{display:block;padding:2px 7px;background:#f9f2decc}.building small{font-size:11px}.building.locked{filter:grayscale(.8);opacity:.76}.hall{left:50%;bottom:45px;transform:translateX(-50%)}.beacon{left:5%;bottom:120px}.forge{right:4%;bottom:112px}.village-status{margin:18px 16px;padding:18px;background:white;border-radius:18px;box-shadow:var(--shadow);display:grid;grid-template-columns:1fr auto;gap:8px 14px;align-items:center}.village-status .progress-track{grid-column:1/-1;background:#dce7e5;border:0}.progress-track.gold span{background:linear-gradient(90deg,#db8c31,#f6d46e);box-shadow:none}.upgrade-card{display:flex;align-items:center;gap:16px;margin:16px;padding:18px;background:#fff9e8;border:1px solid #e9c77f;border-radius:18px}.upgrade-card p{margin:4px 0;color:#56707d}.shield-mark{width:50px;height:56px;display:grid;place-items:center;background:#0c4264;color:#f2c568;clip-path:polygon(50% 0,90% 17%,83% 76%,50% 100%,17% 76%,10% 17%)}.story-card{margin:18px 14px;background:#fff;border-radius:20px;overflow:hidden;box-shadow:var(--shadow)}.story-card img{display:block;width:100%;height:260px;object-fit:cover}.story-content{padding:20px}.chapter-number{font-size:12px;color:#3d8192;font-weight:900;letter-spacing:.16em}.story-content h2{font:700 30px Cormorant Garamond,serif;margin:4px 0}.story-content p{line-height:1.55;color:#58707b}.read-button,.add-task-form button{border:0;border-radius:12px;padding:11px 16px;background:#0c5c7f;color:white;font-weight:900}.locked-story{display:grid;grid-template-columns:100px 1fr;opacity:.72}.locked-art{display:grid;place-items:center;font-size:42px;color:white;background:#1d5874}.parent-intro{background:linear-gradient(150deg,#143e54,#0b2637)}.parent-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px}.parent-summary div{background:white;padding:14px 8px;border-radius:14px;text-align:center;box-shadow:0 8px 22px #1232}.parent-summary span{font-size:11px;color:#66808a;display:block}.parent-summary strong{font-size:18px}.parent-panel{margin:14px;padding:20px;background:#fff;border-radius:20px;box-shadow:var(--shadow)}.parent-task{display:flex;align-items:center;gap:10px;padding:11px 0;border-top:1px solid var(--line)}.parent-task span{flex:1;font-weight:800}.parent-task button{border:0;background:#f2e9e2;color:#a54d38;width:32px;height:32px;border-radius:9px}.add-task-form{display:grid;grid-template-columns:1fr 58px;gap:8px;margin-top:14px}.add-task-form input,.add-task-form select{min-width:0;border:1px solid #c9d8d9;border-radius:11px;padding:12px;background:#f8fbfa;color:var(--ink)}.add-task-form button{grid-column:1/-1}.parent-note{display:flex;gap:12px;margin:16px;padding:16px;border-radius:16px;background:#e4f2ed;color:#355b61}.parent-note p{margin:0;line-height:1.45}.bottom-nav{position:fixed;z-index:30;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,580px);height:78px;padding:8px 10px max(8px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(4,1fr);background:#062b45ee;backdrop-filter:blur(12px);border-top:1px solid #ffffff28}.nav-item{border:0;background:none;color:#99bbc6;display:grid;place-items:center;gap:1px}.nav-item span{font-size:25px;line-height:1}.nav-item small{font-size:11px;font-weight:800}.nav-item.active{color:#ffda7d}.nav-item.active span{filter:drop-shadow(0 0 8px #ffe08c)}dialog{max-width:470px;width:calc(100% - 28px);border:1px solid #d4b368;border-radius:22px;padding:28px;color:var(--ink);background:#fffaf0;box-shadow:0 30px 100px #001;line-height:1.6}dialog::backdrop{background:#021522cc;backdrop-filter:blur(5px)}dialog h2{font:700 34px Cormorant Garamond,serif;margin:4px 0 10px}dialog blockquote{margin:20px 0 0;padding:14px;border-left:3px solid #d8a848;background:#f5ead0;font-weight:800}.dialog-close{float:right;border:0;background:#e8ecea;width:36px;height:36px;border-radius:50%;font-size:24px}.toast{position:fixed;z-index:50;left:50%;bottom:92px;transform:translate(-50%,30px);padding:12px 18px;border-radius:22px;background:#082a42;color:white;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.3s;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0)}@media(min-width:700px){body{padding:24px}.app-shell{min-height:calc(100vh - 48px);border-radius:28px}.topbar{position:relative}.bottom-nav{bottom:24px;border-radius:0 0 28px 28px}.toast{bottom:120px}}@media(max-width:380px){.quest-scene{height:420px}.brand-title{font-size:19px}.task{grid-template-columns:42px 1fr 28px}.parent-summary{grid-template-columns:1fr}.village-scene{height:390px}.building{width:104px}}
.welcome-gate{position:fixed;z-index:100;inset:0;overflow:auto;background:#f7f3e7;color:var(--ink)}body.gate-open{overflow:hidden}.welcome-art{position:relative;min-height:58vh;padding:26px 22px 38px;display:flex;flex-direction:column;justify-content:space-between;color:white;background:url('images/jegbarlang.jpg') center 45%/cover no-repeat}.welcome-shade{position:absolute;inset:0;background:linear-gradient(180deg,#061e3088 0%,#06283c33 35%,#061c2bea 100%)}.welcome-brand,.welcome-copy{position:relative;z-index:1}.welcome-brand{text-align:center}.welcome-brand span{display:block;color:#f0c568;font:700 13px Cormorant Garamond,serif;letter-spacing:.34em}.welcome-brand strong{display:block;margin-top:6px;font:700 28px Cormorant Garamond,serif}.welcome-copy{width:min(100%,520px);margin:130px auto 0}.no-download-badge{display:inline-flex;padding:8px 12px;border-radius:30px;background:#dff8ee;color:#075d57;font-size:12px;font-weight:900;letter-spacing:.06em;box-shadow:0 6px 22px #0019}.welcome-copy h1{font:700 clamp(42px,11vw,64px)/.91 Cormorant Garamond,serif;margin:16px 0 12px;text-shadow:0 5px 25px #001}.welcome-copy p{margin:0;max-width:480px;color:#eafafa;font-size:17px;line-height:1.5}.welcome-actions{width:min(100%,580px);margin:auto;padding:20px 18px 28px;background:#f7f3e7}.primary-entry{width:100%;display:flex;justify-content:space-between;align-items:center;border:0;border-radius:16px;padding:17px 20px;background:linear-gradient(#2c89a6,#125d7e);box-shadow:0 6px 0 #083c59;color:white;font-size:17px;font-weight:900}.primary-entry span{font-size:25px}.account-entry{width:100%;display:grid;grid-template-columns:42px 1fr;gap:10px;align-items:center;margin-top:14px;padding:13px 15px;text-align:left;border:1px solid #d6bd7c;border-radius:15px;background:#fffaf0;color:var(--ink)}.account-entry>span:first-child{font-size:30px;color:#a87325}.account-entry strong,.account-entry small{display:block}.account-entry small{margin-top:2px;color:#687c83}.trust-row{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 15px;margin:20px 0 0;color:#60777d;font-size:12px;font-weight:800}.studio-sign{text-align:center;margin:20px 0 0;color:#8b7b60;font:700 12px Cormorant Garamond,serif;letter-spacing:.2em}.guest-banner{position:sticky;top:76px;z-index:19;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 13px;color:#5f4516;background:#ffe8a8;border-bottom:1px solid #d2ac50;font-size:12px}.guest-banner strong{font-weight:900;margin-right:4px}.guest-banner button{flex:none;border:0;border-radius:18px;padding:7px 10px;background:#0b5273;color:white;font-size:12px;font-weight:900}.entry-dialog{text-align:center}.entry-dialog .dialog-glyph{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 12px;border-radius:50%;background:#0b4566;color:#f2c765;font-size:28px}.entry-dialog label{display:block;text-align:left;margin:15px 0 6px;font-weight:900}.entry-dialog input{width:100%;padding:13px 14px;border:1px solid #bed0d2;border-radius:12px;background:white;color:var(--ink);font-size:16px}.entry-dialog form .story-button{margin-top:12px}.account-benefits{display:grid;gap:9px;margin:18px 0;text-align:left;padding:14px;border-radius:14px;background:#e8f3ef;color:#315b61;font-weight:800}.text-button{margin-top:14px;border:0;background:none;color:#496b78;font-weight:900}.crystal-big{color:#80ecf6!important;text-shadow:0 0 15px #51dbe9}@media(min-width:700px){.welcome-gate{background:radial-gradient(circle at 50% 20%,#26748c,#061d30)}.welcome-art{min-height:62vh;width:min(100%,580px);margin:auto}.welcome-actions{box-shadow:0 30px 80px #0018}}
