/* Translucent surfaces with a moving colour field behind the glass. */
.story-card{margin:20px 0 0;padding:17px 19px;border:1px solid #ffffffbd;border-radius:20px;background:linear-gradient(120deg,#c6e9f44f,#e6ddff50);box-shadow:inset 0 1px 0 white}.story-kicker{font-size:11px;font-weight:700;color:#638292;letter-spacing:1px}.story-card p{font-size:15px;color:#3d596a;margin:7px 0 10px}.story-role{display:inline-block;margin-right:8px;margin-top:4px;padding:4px 10px;border:1px solid #ffffffa0;border-radius:30px;background:#ffffff55;font-size:11px;color:#527e72}.practice-insight{padding:12px 14px;border-radius:15px;border:1px solid #ffffffa0;background:#ffffff45;font-size:13px;color:#586f85}.example p{white-space:pre-line}
.library-item>div{min-width:0;flex:1}.key-target{font-size:13px;color:#47766b;margin-top:10px!important}.slot-preview{margin-top:12px}.slot-preview summary{cursor:pointer;font-size:13px;color:#596d87}.slot-values{display:flex;flex-wrap:wrap;gap:7px}.slot-values button{border:1px solid #ffffffbd;background:#ffffff50;border-radius:13px;padding:8px 11px;text-align:left;color:#365a6b;font-size:13px}.slot-values button:hover{background:#ffffffcf}.slot-values small{display:block;color:#6d7f8c;font-size:11px}#func-filter{width:100%}
.goal-panel{padding:26px;margin-bottom:18px;border:1px solid #ffffffc9;border-radius:30px;background:linear-gradient(135deg,#ffffff68,#ffffff25);backdrop-filter:blur(26px) saturate(155%);-webkit-backdrop-filter:blur(26px) saturate(155%);box-shadow:0 16px 44px #42648213,inset 0 1px 0 white}
.goal-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.goal-heading .eyebrow{font-size:10px}.goal-heading h2{margin:3px 0;font-size:25px}.goal-heading p{margin:5px 0 15px}.goal-ring{--goal-progress:0%;width:88px;height:88px;flex-shrink:0;border-radius:50%;background:conic-gradient(#479b86 var(--goal-progress),#ffffff65 0);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;isolation:isolate;box-shadow:0 5px 20px #659f8612}.goal-ring::before{content:"";position:absolute;inset:5px;background:#edf5f6;border:1px solid white;border-radius:50%;z-index:-1}.goal-ring strong{font-size:21px;color:#2d7665}.goal-ring span{font-size:10px;color:#6b7f87}.goal-ring.achieved{box-shadow:0 0 25px #60caa64d}
.goal-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:8px}.goal-options button{padding:12px 8px;border:1px solid #ffffffb0;border-radius:18px;background:#ffffff32;color:#4d667c;font-size:25px;font-weight:700;box-shadow:inset 0 1px 0 #ffffffa0;transition:transform .2s,background .2s,box-shadow .2s}.goal-options button span{display:block;font-size:12px;font-weight:400;margin-top:3px}.goal-options button[aria-pressed="true"]{background:linear-gradient(135deg,#a9e5d4b8,#dcfff2a8);color:#236c5b;border-color:#ffffff;box-shadow:0 6px 18px #4d9e8120,inset 0 1px 0 white}.goal-options button:hover{transform:translateY(-2px)}.goal-options button:active{transform:scale(.96)}.goal-status{font-size:14px;color:#337966;margin:16px 0 12px}.goal-foot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;border-top:1px solid #ffffff80;padding-top:12px;font-size:12px;color:#61778a}
@media(max-width:650px){.goal-panel{padding:20px 17px;border-radius:26px}.goal-heading h2{font-size:21px}.goal-heading p{font-size:12px}.goal-ring{width:75px;height:75px}.goal-options{gap:7px}.goal-options button{font-size:23px;border-radius:16px;padding:11px 3px}.goal-options button span{font-size:10px}}
:root{--ink:#243443;--muted:#617387;--glass-shadow:0 16px 44px #42648213,inset 0 1px 0 #ffffffef,inset 0 -1px 0 #ffffff60}
body{background:#e8edf7;isolation:isolate}
body::before{inset:-15%;z-index:-2;background:radial-gradient(ellipse at 18% 28%,#b5a6fa9c,transparent 32%),radial-gradient(ellipse at 80% 15%,#82e3d5a6,transparent 35%),radial-gradient(ellipse at 75% 80%,#adc8ffbf,transparent 38%),radial-gradient(ellipse at 12% 86%,#f4c8e49c,transparent 34%),#eaf0f7;background-size:auto;mask-image:none;filter:blur(35px);animation:glass-sky 24s ease-in-out infinite alternate}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(125deg,#ffffff45,transparent 45%,#ffffff25)}
header{background:#ffffff38;border:1px solid #ffffffab;backdrop-filter:blur(28px) saturate(160%);-webkit-backdrop-filter:blur(28px) saturate(160%);box-shadow:var(--glass-shadow)}
nav{width:fit-content;max-width:100%;padding:6px;gap:5px;background:#ffffff35;border:1px solid #ffffffb0;border-radius:22px;backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);box-shadow:0 6px 20px #60738b09}
.tab{border:0;border-radius:16px;padding:11px 20px;transition:background .25s,box-shadow .25s;color:#627387;white-space:nowrap}
.tab.active{background:#ffffffa8;box-shadow:0 3px 12px #52708b15,inset 0 1px 0 white;color:#266c61}
.tab span{background:#dbede889;border-radius:8px}
.accent-picker label{background:#ffffff3d;border-color:#ffffffb8;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:inset 0 1px 0 white}
.accent-picker label:has(input:checked){background:#b9efdf75;border-color:#ffffffd9;box-shadow:0 4px 14px #4b9c7a12,inset 0 1px 0 white}
.daily-entry{background:linear-gradient(110deg,#b2f0df88,#c5e4f76b);border:1px solid #ffffffce;border-radius:26px;backdrop-filter:blur(25px) saturate(160%);-webkit-backdrop-filter:blur(25px) saturate(160%);box-shadow:var(--glass-shadow);transition:transform .3s,box-shadow .3s}
.daily-entry:hover{filter:none;transform:translateY(-3px);box-shadow:0 18px 38px #44897320,inset 0 1px 0 white}
.category-grid{gap:22px;perspective:1200px;padding:4px 0 18px}
.category-card,.category-card:nth-child(3n+2),.category-card:nth-child(3n){--tint:174,158,244;--rx:0deg;--ry:0deg;--mx:50%;--my:25%;background:linear-gradient(145deg,#ffffff5e,#ffffff20);border:1px solid #ffffffc7;border-radius:30px;padding:25px;min-height:275px;backdrop-filter:blur(26px) saturate(155%);-webkit-backdrop-filter:blur(26px) saturate(155%);box-shadow:var(--glass-shadow);position:relative;isolation:isolate;overflow:hidden;transform:perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .35s ease,box-shadow .35s,border-color .35s}
.category-card:nth-child(3n+2){--tint:132,179,251}.category-card:nth-child(3n){--tint:94,211,176}
.category-card::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at var(--mx) var(--my),#ffffff95,transparent 46%),radial-gradient(ellipse at 95% 100%,rgba(var(--tint),.24),transparent 65%);opacity:.72;transition:opacity .35s}
.category-card::after{content:"↗";right:22px;top:23px;width:34px;height:34px;display:grid;place-items:center;border:1px solid #ffffffa5;background:#ffffff3c;border-radius:50%;color:#6e8799;font-size:19px;box-shadow:inset 0 1px 0 white;transition:transform .35s,background .35s,color .35s}
.category-card strong{font-size:19px;letter-spacing:-.3px}.category-desc{color:#627487;font-size:14px}.category-preview{color:#43576b;font-size:20px;margin-top:18px;margin-bottom:20px}
.category-bottom{border-color:#ffffff99;padding-top:15px;color:#38786b;font-size:13px}
.category-icon,.category-card:nth-child(3n+2) .category-icon,.category-card:nth-child(3n) .category-icon{width:62px;height:62px;font-size:31px;border-radius:21px;background:linear-gradient(145deg,#ffffffd0,rgba(var(--tint),.25));border:1px solid white;box-shadow:0 9px 20px rgba(var(--tint),.2),inset 0 2px 3px white;animation:glass-icon 5s ease-in-out infinite;transform:rotate(-7deg);margin-bottom:19px}
.category-card:nth-child(2n) .category-icon{animation-delay:-2s}.category-card:nth-child(3n) .category-icon{animation-delay:-3.5s}
@media(hover:hover) and (pointer:fine){.category-card:hover:not(:disabled){transform:perspective(1000px) translateY(-8px) rotateX(var(--rx)) rotateY(var(--ry));border-color:white;box-shadow:0 25px 45px #45688724,inset 0 1px 0 white,inset 0 -1px 0 #ffffff70}.category-card:hover::before{opacity:1}.category-card:hover::after{background:#ffffffac;transform:rotate(45deg);color:#2a7968}.category-card:hover .category-icon{animation:none;transform:translateY(-5px) rotate(5deg) scale(1.06)}}
.category-card:active:not(:disabled){transform:scale(.975);transition-duration:.12s}
.card,.library-item{background:linear-gradient(135deg,#ffffff70,#ffffff38);border:1px solid #ffffffc9;backdrop-filter:blur(26px) saturate(150%);-webkit-backdrop-filter:blur(26px) saturate(150%);box-shadow:var(--glass-shadow)}
.card{border-radius:30px}.library-item{border-radius:23px}.secondary,.choice,input,select{background:#ffffff60;border-color:#ffffffcf;box-shadow:inset 0 1px 0 white}.choice:hover{background:#ffffffe0}.choice.correct{background:#c0efdbb0;border-color:#75b79b}.floating-phrase,.stat{background:linear-gradient(135deg,#ffffff9c,#ffffff45);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:var(--glass-shadow)}
footer{border-color:#ffffff90;color:#6c7f92}.section-heading h2{letter-spacing:-.7px}.category-intro{color:#63778a}
@keyframes glass-sky{from{transform:translate3d(-1%,-1%,0) rotate(-3deg)}to{transform:translate3d(3%,2%,0) rotate(5deg)}}
@keyframes glass-icon{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@media(max-width:650px){header{margin:12px 14px 0;padding:12px 18px}nav{width:100%;justify-content:space-between;gap:1px;border-radius:20px}.tab{padding:10px 11px;font-size:13px;border-radius:14px}.category-grid{gap:15px}.category-card,.category-card:nth-child(3n+2),.category-card:nth-child(3n){padding:20px 17px;border-radius:27px;min-height:265px}.category-card strong{font-size:17px}.category-desc{font-size:13px}.category-preview{font-size:18px}.category-icon,.category-card:nth-child(3n+2) .category-icon,.category-card:nth-child(3n) .category-icon{width:55px;height:55px;font-size:28px;border-radius:18px}.category-card::after{right:15px;top:19px;width:28px;height:28px;font-size:16px}.category-bottom{gap:5px}.daily-entry{border-radius:24px}}
@media(prefers-reduced-motion:reduce){body::before,.category-icon{animation:none!important}.category-card,.category-card:hover:not(:disabled){transform:none!important}}
@supports not (backdrop-filter:blur(1px)){.category-card,.card,.library-item,header,nav{background:#f5f8f0e6}}
