:root{--color-bg:#fff9f3;--color-surface:#fffdf9;--color-surface-soft:#fff4f8;--color-surface-strong:#ffe6f0;--color-text:#43263e;--color-text-soft:#6b4862;--color-text-muted:#9a7895;--color-primary:#ff7aa8;--color-primary-soft:#ffd0e3;--color-primary-strong:#ff4f92;--color-secondary:#7bcfff;--color-accent-mint:#8be6c5;--color-accent-lemon:#ffe37a;--color-accent-lavender:#c6b5ff;--color-accent-cherry:#ff3b5c;--color-success:#36b58a;--color-warning:#ffb347;--color-danger:#ff5978;--color-neutral-50:#fdf5ff;--color-neutral-100:#f5edf7;--color-neutral-200:#e6d9eb;--color-neutral-300:#d2bfd9;--color-neutral-400:#b79abc;--color-neutral-500:#9a7ca0;--color-neutral-600:#7b607f;--color-neutral-700:#5c465f;--color-neutral-800:#3c2f3d;--color-neutral-900:#241c25;--font-display:'Baloo 2','Fredoka','Poppins',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-body:'Nunito','Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-size-5xl:3rem;--line-height-tight:1.1;--line-height-snug:1.25;--line-height-normal:1.5;--line-height-relaxed:1.7;--space-0:0;--space-1:0.125rem;--space-2:0.25rem;--space-3:0.375rem;--space-4:0.5rem;--space-5:0.625rem;--space-6:0.75rem;--space-8:1rem;--space-10:1.25rem;--space-12:1.5rem;--space-16:2rem;--space-20:2.5rem;--space-24:3rem;--space-32:4rem;--space-40:5rem;--space-48:6rem;--space-64:8rem;--space-80:10rem;--space-96:12rem;--radius-xs:6px;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;--radius-pill:999px;--radius-bubble:50%;--shadow-soft:0 6px 16px rgba(255,122,168,0.25);--shadow-medium:0 10px 30px rgba(60,47,61,0.18);--shadow-strong:0 18px 45px rgba(36,28,37,0.28);--shadow-bubble:0 0 0 2px rgba(255,255,255,0.7),0 10px 30px rgba(255,104,161,0.4);--shadow-glow-primary:0 0 0 3px rgba(255,122,168,0.45);--transition-fast:120ms ease-out;--transition-normal:200ms ease-out;--transition-slow:320ms ease-out;--focus-ring-color:rgba(255,122,168,0.6);--container-max-width:1120px;--border-width-thin:1px;--border-width-thick:2px}*,:before,:after{box-sizing:border-box}*{margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}html,body{min-height:100%}body{font-family:var(--font-body);font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text);background:radial-gradient(circle at top left,#ffeef6 0,#fff9f3 40%,#fdf9ff 100%);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}img,picture,video,canvas,svg{display:block;max-width:100%}img{height:auto}button,input,select,textarea{font:inherit;color:inherit}ul,ol{list-style:none}a{text-decoration:none;color:var(--color-primary);transition:color var(--transition-normal),text-shadow var(--transition-normal),transform var(--transition-fast)}a:hover{color:var(--color-primary-strong);text-shadow:0 0 8px rgba(255,122,168,0.5);transform:translateY(-1px)}a:focus-visible{outline:3px solid var(--focus-ring-color);outline-offset:3px;border-radius:var(--radius-pill)}p{margin-bottom:var(--space-8);color:var(--color-text-soft)}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--color-text);font-weight:700;letter-spacing:0.01em;margin-bottom:var(--space-6)}h1{font-size:var(--font-size-4xl);line-height:var(--line-height-tight)}h2{font-size:var(--font-size-3xl);line-height:var(--line-height-tight)}h3{font-size:var(--font-size-2xl);line-height:var(--line-height-snug)}h4{font-size:var(--font-size-xl)}h5{font-size:var(--font-size-lg)}h6{font-size:var(--font-size-base);text-transform:uppercase;letter-spacing:0.08em}main{display:block}button{border:none;background:none;cursor:pointer}fieldset{border:0}legend{padding:0}table{border-collapse:collapse;border-spacing:0;width:100%}th,td{text-align:left;padding:var(--space-4) var(--space-6)}hr{border:0;border-top:1px dashed rgba(183,154,188,0.45);margin:var(--space-16) 0}.container{width:100%;max-width:var(--container-max-width);margin:0 auto;padding:0 var(--space-8)}.layout-full-bleed{width:100%;padding-left:0;padding-right:0}.flex{display:flex}.inline-flex{display:inline-flex}.flex-center{display:flex;align-items:center;justify-content:center}.flex-between{display:flex;align-items:center;justify-content:space-between}.flex-column{display:flex;flex-direction:column}.flex-wrap{flex-wrap:wrap}.gap-sm{gap:var(--space-6)}.gap-md{gap:var(--space-10)}.gap-lg{gap:var(--space-16)}.grid{display:grid;gap:var(--space-10)}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-auto-fit{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.text-center{text-align:center}.text-right{text-align:right}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-4);padding:0.7rem 1.4rem;border-radius:var(--radius-pill);border:var(--border-width-thick) solid rgba(255,255,255,0.9);background:radial-gradient(circle at 20% 0,#fffdf9 0,#ffeef6 32%,#ff7aa8 85%);color:#3b1430;font-family:var(--font-display);font-size:var(--font-size-base);line-height:1;font-weight:700;letter-spacing:0.03em;text-transform:uppercase;box-shadow:var(--shadow-bubble);position:relative;overflow:hidden;transition:transform var(--transition-fast),box-shadow var(--transition-fast),filter var(--transition-fast)}.btn:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,0.55),transparent 40%,rgba(255,255,255,0.15) 70%,transparent);opacity:0.9;mix-blend-mode:screen;pointer-events:none}.btn:hover{transform:translateY(-1px) scale(1.01);box-shadow:var(--shadow-strong);filter:brightness(1.03)}.btn:active{transform:translateY(0) scale(0.99);box-shadow:var(--shadow-medium)}.btn:focus-visible{outline:3px solid var(--focus-ring-color);outline-offset:2px}.btn-primary{background:radial-gradient(circle at 15% 0,#fff5fb 0,#ffd0e3 26%,#ff7aa8 75%);color:#3b1430}.btn-secondary{background:radial-gradient(circle at 15% 0,#f5fbff 0,#d1ecff 30%,#7bcfff 85%);color:#153046}.btn-ghost{background:rgba(255,255,255,0.7);border-color:rgba(255,255,255,0.95);box-shadow:0 6px 16px rgba(183,154,188,0.3);backdrop-filter:blur(10px)}.btn-sm{padding:0.55rem 1.1rem;font-size:var(--font-size-sm)}.btn-lg{padding:0.9rem 1.8rem;font-size:var(--font-size-lg)}.btn:disabled,.btn[aria-disabled="true"]{cursor:not-allowed;opacity:0.6;transform:none;box-shadow:var(--shadow-soft)}.form-control{width:100%;padding:0.7rem 0.9rem;border-radius:var(--radius-md);border:1px solid rgba(214,187,221,0.9);background:linear-gradient(135deg,rgba(255,255,255,0.9),rgba(255,244,252,0.9));box-shadow:0 4px 12px rgba(229,201,237,0.5) inset;color:var(--color-text-soft);transition:border-color var(--transition-normal),box-shadow var(--transition-normal),background var(--transition-normal)}.form-control::placeholder{color:var(--color-text-muted)}.form-control:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 1px rgba(255,122,168,0.5),0 0 0 4px rgba(255,208,227,0.8)}.form-label{display:block;margin-bottom:var(--space-4);font-weight:600;color:var(--color-text-soft)}.form-helper{margin-top:var(--space-3);font-size:var(--font-size-xs);color:var(--color-text-muted)}.form-error{margin-top:var(--space-3);font-size:var(--font-size-xs);color:var(--color-danger)}.card{position:relative;border-radius:var(--radius-lg);background:radial-gradient(circle at top left,#fffefd 0,#fff5fb 35%,#ffe6f0 85%);box-shadow:var(--shadow-medium);padding:var(--space-12);overflow:hidden}.card-soft{background:radial-gradient(circle at top,#ffffff 0,#fff9ff 45%,#fbe9ff 95%);box-shadow:var(--shadow-soft)}.card-outline{background:rgba(255,249,243,0.95);border:1px dashed rgba(255,122,168,0.4)}.card:before{content:"";position:absolute;inset:-40%;background:radial-gradient(circle at 10% 0,rgba(255,255,255,0.7) 0,transparent 55%),radial-gradient(circle at 80% 120%,rgba(255,122,168,0.24) 0,transparent 55%),radial-gradient(circle at -10% 120%,rgba(123,207,255,0.22) 0,transparent 55%);opacity:0.7;pointer-events:none}.card-content{position:relative;z-index:1}.badge-star{display:inline-flex;align-items:center;gap:0.3rem;padding:0.25rem 0.6rem;border-radius:999px;background:radial-gradient(circle at 0 0,#fffbed 0,#ffe37a 45%,#ffb347 100%);color:#4c2800;font-family:var(--font-display);font-size:var(--font-size-xs);letter-spacing:0.08em;text-transform:uppercase;box-shadow:0 4px 12px rgba(255,179,71,0.5)}.badge-star-icon{width:0.9rem;height:0.9rem;border-radius:50%;background:radial-gradient(circle at 30% 0,#fffbe8 0,#ffe37a 55%,#ffb347 100%);box-shadow:0 0 0 1px rgba(255,255,255,0.7),0 3px 6px rgba(194,131,38,0.6)}.tag-label{display:inline-flex;align-items:center;justify-content:center;padding:0.2rem 0.75rem;border-radius:999px;background:rgba(255,255,255,0.85);border:1px solid rgba(214,187,221,0.7);font-size:var(--font-size-xs);font-weight:600;color:var(--color-text-muted);backdrop-filter:blur(8px)}.pill-progress{position:relative;width:100%;height:0.9rem;border-radius:999px;background:rgba(255,255,255,0.9);box-shadow:0 4px 14px rgba(183,154,188,0.4) inset;overflow:hidden}.pill-progress-fill{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,#ff7aa8,#ffb347,#ffe37a,#8be6c5);box-shadow:0 0 10px rgba(255,122,168,0.8)}.map-trail{position:relative;border-radius:var(--radius-xl);background:radial-gradient(circle at 0 0,#fff5fb 0,#ffd0e3 26%,#c6b5ff 80%);box-shadow:0 18px 45px rgba(184,144,214,0.5);padding:var(--space-16)}.map-trail:before{content:"";position:absolute;inset:8%;border-radius:inherit;border:3px dashed rgba(255,255,255,0.8);opacity:0.7}.bubble-cluster{position:relative;display:inline-flex;flex-wrap:wrap;gap:0.2rem;align-items:center;justify-content:center}.bubble{width:2.6rem;height:2.6rem;border-radius:var(--radius-bubble);background:radial-gradient(circle at 30% 18%,#ffffff 0,rgba(255,255,255,0.9) 18%,transparent 40%),radial-gradient(circle at 70% 80%,rgba(0,0,0,0.15) 0,transparent 60%),radial-gradient(circle at 50% 50%,var(--color-primary) 0,var(--color-primary-strong) 40%,var(--color-accent-cherry) 80%);box-shadow:var(--shadow-bubble);border:1px solid rgba(255,255,255,0.85);position:relative;overflow:hidden}.bubble--mint{background:radial-gradient(circle at 30% 18%,#ffffff 0,rgba(255,255,255,0.9) 20%,transparent 40%),radial-gradient(circle at 70% 80%,rgba(0,0,0,0.12) 0,transparent 60%),radial-gradient(circle at 50% 50%,#e4fff4 0,#8be6c5 40%,#2fb27e 80%)}.bubble--lemon{background:radial-gradient(circle at 30% 18%,#ffffff 0,rgba(255,255,255,0.9) 20%,transparent 40%),radial-gradient(circle at 70% 80%,rgba(0,0,0,0.12) 0,transparent 60%),radial-gradient(circle at 50% 50%,#fffbe0 0,#ffe37a 40%,#ffb347 80%)}.bubble--lavender{background:radial-gradient(circle at 30% 18%,#ffffff 0,rgba(255,255,255,0.9) 20%,transparent 40%),radial-gradient(circle at 70% 80%,rgba(0,0,0,0.12) 0,transparent 60%),radial-gradient(circle at 50% 50%,#f7f2ff 0,#c6b5ff 40%,#8a6cff 80%)}.bubble--blue{background:radial-gradient(circle at 30% 18%,#ffffff 0,rgba(255,255,255,0.9) 20%,transparent 40%),radial-gradient(circle at 70% 80%,rgba(0,0,0,0.12) 0,transparent 60%),radial-gradient(circle at 50% 50%,#e7f5ff 0,#7bcfff 40%,#2c8dd6 80%)}.bubble-orbit{position:absolute;inset:-12%;border-radius:50%;border:2px dashed rgba(255,255,255,0.55);mix-blend-mode:soft-light}.trajectory-line{position:relative;height:3px;border-radius:999px;background:linear-gradient(90deg,rgba(255,255,255,0.1),rgba(123,207,255,0.9),rgba(255,179,71,0.9));box-shadow:0 0 12px rgba(123,207,255,0.9)}.trajectory-line:before{content:"";position:absolute;right:-4px;top:50%;transform:translateY(-50%);border-width:6px 0 6px 10px;border-style:solid;border-color:transparent transparent transparent #fff}.trajectory-dash{border-top:2px dashed rgba(123,207,255,0.9);opacity:0.9}.star-row{display:inline-flex;align-items:center;gap:0.18rem}.star{width:1.1rem;height:1.1rem;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);background:radial-gradient(circle at 30% 0,#fffbe8 0,#ffe37a 40%,#ffb347 100%);box-shadow:0 0 0 1px rgba(255,255,255,0.8),0 4px 8px rgba(194,131,38,0.7)}.star--empty{background:transparent;border:1px dashed rgba(255,179,71,0.7);box-shadow:none}.section{padding:var(--space-32) 0}.section-header{margin-bottom:var(--space-16);text-align:center}.section-title{font-size:var(--font-size-3xl);line-height:var(--line-height-tight)}.section-kicker{font-family:var(--font-display);font-size:var(--font-size-sm);text-transform:uppercase;letter-spacing:0.16em;color:var(--color-text-muted);margin-bottom:var(--space-4)}.section-intro{max-width:46rem;margin:0 auto;color:var(--color-text-soft)}.chip-list{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-6)}.chip{padding:0.25rem 0.75rem;border-radius:999px;background:rgba(255,255,255,0.8);border:1px solid rgba(214,187,221,0.7);font-size:var(--font-size-xs);color:var(--color-text-muted)}.label-sweet{display:inline-flex;align-items:center;justify-content:center;padding:0.18rem 0.55rem;border-radius:10px;background:linear-gradient(135deg,#ffeff7,#ffd0e3);border:1px solid rgba(255,255,255,0.9);box-shadow:0 2px 5px rgba(255,122,168,0.35);font-size:var(--font-size-xs);font-weight:600;color:#6e3056}.cloud-plate{position:relative;border-radius:40px;background:radial-gradient(circle at 20% 0,#ffffff 0,#fff9ff 40%,#f5e9ff 100%);box-shadow:0 20px 50px rgba(170,150,210,0.5);padding:var(--space-24)}.cloud-plate:before,.cloud-plate:after{content:"";position:absolute;background:rgba(255,255,255,0.7);border-radius:999px;filter:blur(20px);opacity:0.9}.cloud-plate:before{width:40%;height:26%;top:-12%;left:8%}.cloud-plate:after{width:32%;height:20%;bottom:-10%;right:10%}.storybook-page{border-radius:28px;background:radial-gradient(circle at top,#fffefd 0,#fff5fb 40%,#ffe6f0 100%);box-shadow:0 16px 40px rgba(204,167,190,0.65),0 0 0 1px rgba(255,255,255,0.9);padding:var(--space-20);position:relative}.storybook-page:before{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:linear-gradient(to bottom,rgba(214,187,221,0.15),rgba(214,187,221,0.6),rgba(214,187,221,0.15));transform:translateX(-50%);pointer-events:none}.badge-chapter{position:absolute;top:var(--space-8);left:var(--space-10);padding:0.25rem 0.7rem;border-radius:999px;background:linear-gradient(135deg,#ffe37a,#ffb347);color:#4c2800;font-size:var(--font-size-xs);font-weight:700;letter-spacing:0.12em;text-transform:uppercase;box-shadow:0 4px 10px rgba(255,179,71,0.7)}.top-list{counter-reset:toplist}.top-list-item{counter-increment:toplist;position:relative;padding-left:2.4rem;margin-bottom:var(--space-8)}.top-list-item:before{content:counter(toplist);position:absolute;left:0;top:0.15rem;width:1.7rem;height:1.7rem;border-radius:999px;background:radial-gradient(circle at 30% 0,#fff7fd 0,#ff7aa8 50%,#ff4f92 100%);box-shadow:0 4px 12px rgba(255,122,168,0.7);color:#fff;font-family:var(--font-display);font-size:0.95rem;display:flex;align-items:center;justify-content:center}.pill-filter-group{display:flex;flex-wrap:wrap;gap:var(--space-4)}.pill-filter{padding:0.3rem 0.9rem;border-radius:999px;border:1px solid rgba(214,187,221,0.9);background:rgba(255,255,255,0.95);font-size:var(--font-size-xs);font-weight:600;color:var(--color-text-muted);cursor:pointer;transition:background var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal),transform var(--transition-fast)}.pill-filter[aria-pressed="true"],.pill-filter--active{background:radial-gradient(circle at 0 0,#fff5fb 0,#ffd0e3 40%,#ff7aa8 100%);border-color:rgba(255,122,168,0.8);color:#3b1430;box-shadow:0 4px 10px rgba(255,122,168,0.5);transform:translateY(-1px)}:focus-visible{outline:3px solid var(--focus-ring-color);outline-offset:3px}body:not(.user-is-tabbing) :focus{outline:none}::selection{background:rgba(255,122,168,0.22);color:var(--color-text)}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-margin:0!important}}@media (max-width:768px){.container{padding:0 var(--space-6)}.section{padding:var(--space-24) 0}h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}.grid-2,.grid-3{grid-template-columns:1fr}.storybook-page:before{display:none}}