@property --shadow-x{syntax: "<length>"; inherits: true; initial-value: 0px;}@property --shadow-y{syntax: "<length>"; inherits: true; initial-value: 0px;}@property --shadow-blur{syntax: "<length>"; inherits: true; initial-value: 0px;}@property --shadow-opacity{syntax: "<number>"; inherits: true; initial-value: .25;}@property --shadow-tint{syntax: "<color>"; inherits: true; initial-value: #1a1410;}@property --surface-warmth{syntax: "<number>"; inherits: true; initial-value: .5;}@property --surface-tint{syntax: "<color>"; inherits: true; initial-value: #e7d5b9;}@property --background-start{syntax: "<color>"; inherits: true; initial-value: #a4c2dd;}@property --background-end{syntax: "<color>"; inherits: true; initial-value: #f3c89a;}@property --background-horizon{syntax: "<color>"; inherits: true; initial-value: #fadcb0;}@property --highlight-opacity{syntax: "<number>"; inherits: true; initial-value: .4;}@property --ambient-contrast{syntax: "<number>"; inherits: true; initial-value: 1;}@property --glow{syntax: "<number>"; inherits: true; initial-value: .5;}@property --sun-x{syntax: "<percentage>"; inherits: true; initial-value: 50%;}@property --sun-y{syntax: "<percentage>"; inherits: true; initial-value: 60%;}@property --depth-px{syntax: "<length>"; inherits: true; initial-value: 5px;}@property --depth-dir-x{syntax: "<number>"; inherits: true; initial-value: 0;}@property --depth-dir-y{syntax: "<number>"; inherits: true; initial-value: 1;}@property --depth-scale{syntax: "<number>"; inherits: true; initial-value: .45;}@property --slab-offset{syntax: "<length>"; inherits: true; initial-value: 0px;}@property --gaze-enabled{syntax: "<number>"; inherits: true; initial-value: 0;}@property --gaze-disc-x{syntax: "<percentage>"; inherits: true; initial-value: 50%;}@property --gaze-disc-y{syntax: "<percentage>"; inherits: true; initial-value: 50%;}@property --gaze-dir-x{syntax: "<number>"; inherits: true; initial-value: 0;}@property --gaze-dir-y{syntax: "<number>"; inherits: true; initial-value: 0;}@property --shadow-spread{syntax: "<length>"; inherits: true; initial-value: 0px;}@property --shadow-contact-mul{syntax: "<number>"; inherits: true; initial-value: 1;}@property --shadow-reach-mul{syntax: "<number>"; inherits: true; initial-value: 1;}@property --shadow-distance-drop{syntax: "<length>"; inherits: true; initial-value: 0px;}@property --floating-mul{syntax: "<number>"; inherits: true; initial-value: 1;}@property --sun-gaze{syntax: "<number>"; inherits: true; initial-value: 0;}@property --corner-radius{syntax: "<number>"; inherits: true; initial-value: 1.1;}@property --highlight-mul{syntax: "<number>"; inherits: true; initial-value: 1;}@property --gloss{syntax: "<number>"; inherits: true; initial-value: .22;}@property --surface-opacity{syntax: "<number>"; inherits: true; initial-value: 88;}@property --pillow{syntax: "<number>"; inherits: true; initial-value: 40;}@property --saturation{syntax: "<number>"; inherits: true; initial-value: 1;}@property --tile-gap{syntax: "<length>"; inherits: true; initial-value: 14px;}@property --wallpaper-warm{syntax: "<number>"; inherits: true; initial-value: 0;}@property --bezel-sheen{syntax: "<number>"; inherits: true; initial-value: .6;}@property --glyph-weight{syntax: "<number>"; inherits: true; initial-value: 1;}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;color:#1a1410;background:#06070b;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}.app{position:relative;min-height:100vh;width:100%;isolation:isolate;overflow:hidden;transition:--shadow-x .7s cubic-bezier(.22,.61,.36,1),--shadow-y .7s cubic-bezier(.22,.61,.36,1),--shadow-blur .7s cubic-bezier(.22,.61,.36,1),--shadow-opacity .7s cubic-bezier(.22,.61,.36,1),--shadow-tint 1.2s ease,--surface-warmth 1.2s ease,--surface-tint 1.2s ease,--background-start 1.2s ease,--background-end 1.2s ease,--background-horizon 1.2s ease,--highlight-opacity .8s ease,--ambient-contrast .8s ease,--glow .8s ease,--sun-x 1s cubic-bezier(.4,0,.4,1),--sun-y 1s cubic-bezier(.4,0,.4,1),--depth-px .7s cubic-bezier(.22,.61,.36,1),--depth-dir-x .7s ease,--depth-dir-y .7s ease,--depth-scale .7s cubic-bezier(.22,.61,.36,1),--slab-offset .6s cubic-bezier(.22,.61,.36,1),--gaze-dir-x .7s cubic-bezier(.22,.61,.36,1),--gaze-dir-y .7s cubic-bezier(.22,.61,.36,1),--shadow-spread .5s ease,--shadow-contact-mul .5s ease,--shadow-reach-mul .5s ease,--shadow-distance-drop .5s ease,--floating-mul .5s cubic-bezier(.22,.61,.36,1),--sun-gaze .7s cubic-bezier(.22,.61,.36,1),--corner-radius .4s ease,--highlight-mul .4s ease,--gloss .4s ease,--surface-opacity .4s ease,--pillow .4s ease,--saturation .4s ease,--tile-gap .4s ease,--wallpaper-warm .4s ease,--bezel-sheen .4s ease,--glyph-weight .4s ease}.sky{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background:radial-gradient(120% 70% at var(--sun-x) calc(var(--sun-y) + 4%),color-mix(in srgb,var(--background-horizon) calc(var(--glow) * 100%),transparent) 0%,transparent 55%),linear-gradient(to bottom,var(--background-start) 0%,color-mix(in srgb,var(--background-start),var(--background-end) 45%) 55%,var(--background-end) 100%);transition:background 1.2s ease}.sky-haze{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(80% 50% at var(--sun-x) var(--sun-y),rgba(255,240,220,calc(.18 * var(--glow))) 0%,transparent 60%),linear-gradient(to bottom,transparent 60%,color-mix(in srgb,var(--background-horizon),transparent 40%) 92%,color-mix(in srgb,var(--background-end),transparent 30%) 100%);pointer-events:none;mix-blend-mode:screen}.sun-disc{display:none}.gaze-disc{position:absolute;left:var(--gaze-disc-x);top:var(--gaze-disc-y);width:96px;height:96px;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;filter:blur(.5px);z-index:0;animation:gaze-fade-in .38s cubic-bezier(.22,.61,.36,1);transition:left .7s cubic-bezier(.22,.61,.36,1),top .7s cubic-bezier(.22,.61,.36,1)}@keyframes gaze-fade-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.85)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.gaze-disc--sun{background:radial-gradient(circle at 50% 50%,rgba(255,250,230,.96) 0%,rgba(255,220,160,.65) 18%,rgba(255,190,110,.3) 38%,rgba(255,170,90,.1) 55%,transparent 75%);box-shadow:0 0 60px 8px #ffc88240}.gaze-disc--moon{background:radial-gradient(circle at 50% 50%,rgba(248,250,255,.95) 0%,rgba(220,230,248,.6) 22%,rgba(170,195,230,.22) 45%,transparent 75%);box-shadow:0 0 50px 4px #b4c8f033}.layout{position:relative;z-index:1;display:grid;grid-template-columns:minmax(420px,1fr) minmax(360px,460px);grid-template-rows:minmax(0,1fr);gap:64px;align-items:center;padding:56px 72px;height:100vh;max-width:1500px;margin:0 auto}@media(max-width:1100px){.layout{grid-template-columns:1fr;grid-template-rows:auto;height:auto;min-height:100vh;gap:40px;padding:80px 28px 40px}}.stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:720px;perspective:2400px}.ground{position:absolute;bottom:-10%;left:50%;transform:translate(-50%);width:110%;height:220px;background:radial-gradient(50% 80% at 50% 0%,color-mix(in srgb,var(--background-end),transparent 30%) 0%,transparent 75%);pointer-events:none;filter:blur(20px);opacity:calc(.35 + var(--ambient-contrast) * .25)}.phone-wrap{position:relative;transform-style:preserve-3d}.phone{position:relative;width:340px;height:700px;border-radius:56px;background:linear-gradient(135deg,#2a2c33,#15161a,#2a2c33);padding:8px;transition:transform .6s cubic-bezier(.22,.61,.36,1);transform-style:preserve-3d;box-shadow:0 1px rgba(255,255,255,calc(.12 * var(--ambient-contrast))) inset,calc(var(--shadow-x) * 1.6) calc(var(--shadow-y) * 2 + 10px) calc(var(--shadow-blur) * 1.5 + 30px) color-mix(in srgb,var(--shadow-tint),transparent calc(100% - var(--shadow-opacity) * 80%)),calc(var(--shadow-x) * .5) calc(var(--shadow-y) * .7 + 4px) calc(var(--shadow-blur) * .6) color-mix(in srgb,var(--shadow-tint),transparent calc(100% - var(--shadow-opacity) * 60%))}.phone-frame{position:relative;width:100%;height:100%;border-radius:48px;overflow:hidden;background:#0a0b0e;box-shadow:inset 0 0 0 1.5px #3c3c41d9,inset 0 0 0 3.5px #000000bf}.phone-bezel-shadow{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:48px;background:linear-gradient(calc(180deg + (var(--sun-x) - 50%) * 1.5),rgba(255,255,255,calc(.08 * var(--ambient-contrast) * var(--bezel-sheen))) 0%,transparent 25%,transparent 75%,rgba(0,0,0,calc(.18 * var(--bezel-sheen))) 100%);pointer-events:none;mix-blend-mode:screen;z-index:5}.phone-side{position:absolute;width:4px;height:80px;background:linear-gradient(to bottom,#1f2126,#0e0f12);border-radius:2px;z-index:-1}.phone-side--left{left:-2px;top:110px;height:50px}.phone-side--left:after{content:"";position:absolute;left:0;top:60px;width:4px;height:90px;background:inherit;border-radius:2px}.phone-side--right{right:-2px;top:130px;height:70px}.screen{position:relative;width:100%;height:100%;border-radius:38px;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,color-mix(in srgb,var(--background-start),white 25%),color-mix(in srgb,var(--background-horizon),white 35%) 60%,color-mix(in srgb,var(--background-end),white 30%));transition:background 1.2s ease}.screen-wallpaper{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(90% 70% at 28% 22%,hsla(40,100%,92%,calc(var(--sun-gaze) * .55)) 0%,hsla(40,100%,88%,calc(var(--sun-gaze) * .18)) 30%,transparent 70%),linear-gradient(180deg,color-mix(in srgb,transparent,#ffaa55 calc(max(var(--wallpaper-warm) * 1,0)*30%)) 0%,transparent 100%),linear-gradient(0deg,color-mix(in srgb,transparent,#88aaff calc(max(var(--wallpaper-warm) * -1,0)*30%)) 0%,transparent 100%),radial-gradient(70% 55% at calc(var(--sun-x) * .6 + 20%) calc(var(--sun-y) * .6 + 20%),rgba(255,240,215,calc(.55 * var(--glow))) 0%,transparent 65%),radial-gradient(100% 60% at 50% 110%,color-mix(in srgb,var(--background-end),transparent 40%) 0%,transparent 70%);pointer-events:none;z-index:1}.screen-glare{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(115deg,rgba(255,255,255,calc(var(--highlight-opacity) * .18)) 0%,transparent 25%,transparent 60%,rgba(255,255,255,calc(var(--highlight-opacity) * .08)) 100%);pointer-events:none;mix-blend-mode:screen;z-index:6}.status-bar{position:relative;z-index:4;display:flex;align-items:center;justify-content:space-between;padding:16px 28px 0;font-size:14px;font-weight:600;color:rgba(28,22,18,calc(.78 * var(--ambient-contrast)));letter-spacing:.01em}.status-time{font-variant-numeric:tabular-nums}.dynamic-island{width:88px;height:28px;background:#0a0b0e;border-radius:999px;margin-top:2px;box-shadow:inset 0 0 0 1px #282a30e6,0 1px 2px rgba(255,255,255,calc(var(--highlight-opacity) * .12))}.status-icons{display:inline-flex;align-items:center;gap:6px;color:rgba(28,22,18,calc(.78 * var(--ambient-contrast)))}.home{position:relative;z-index:4;height:calc(100% - 32px);padding:22px 20px 36px;display:flex;flex-direction:column;gap:var(--tile-gap);filter:saturate(var(--saturation))}.widgets{display:grid;grid-template-columns:1.45fr 1fr;gap:var(--tile-gap)}.widget{border-radius:calc(28px * var(--corner-radius));padding:18px;background-color:color-mix(in srgb,color-mix(in srgb,var(--surface-tint),white 38%),transparent calc(100% - var(--surface-opacity) * 1%));color:rgba(28,22,18,calc(.85 * var(--ambient-contrast)))}.widget--weather{display:flex;flex-direction:column;gap:10px;min-height:158px}.widget-top{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.18em;color:rgba(28,22,18,calc(.5 * var(--ambient-contrast)))}.weather-glyph{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f5e2a8,#e6c272 70%,#c89e44);box-shadow:inset 0 1px rgba(255,255,255,calc(var(--highlight-opacity) * .7)),0 2px 6px rgba(140,90,30,calc(.2 * var(--ambient-contrast)))}.widget-temp{font-family:Kalice,Georgia,Times New Roman,serif;font-size:48px;line-height:1;font-weight:400;letter-spacing:-.02em;color:rgba(28,22,18,calc(.92 * var(--ambient-contrast)));margin-top:auto}.widget-meta{font-size:11px;font-weight:500;color:rgba(28,22,18,calc(.5 * var(--ambient-contrast)));letter-spacing:.02em}.widget--clock{display:flex;align-items:center;justify-content:center;min-height:158px;padding:14px}.clock-face{position:relative;width:110px;height:110px}.tick{position:absolute;left:50%;top:4px;width:1px;height:5px;background:rgba(28,22,18,calc(.4 * var(--ambient-contrast)));transform-origin:50% 51px;margin-left:-.5px}.tick-major{width:1.5px;height:7px;background:rgba(28,22,18,calc(.7 * var(--ambient-contrast)))}.hand{position:absolute;left:50%;top:50%;background:rgba(28,22,18,calc(.85 * var(--ambient-contrast)));transform-origin:50% 100%;border-radius:2px}.hand--hour{width:2.5px;height:30px}.hand--minute{width:1.5px;height:44px;opacity:.85}.clock-pivot{position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;background:#1c1612e6;border-radius:50%}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--tile-gap)}.tile{aspect-ratio:1 / 1;border-radius:calc(20px * var(--corner-radius));display:flex;align-items:center;justify-content:center}.tile .glyph,.dock-tile .glyph{width:56%;height:56%;opacity:var(--glyph-weight)}.tile.tile--cream,.dock-tile.tile--cream{background-color:color-mix(in srgb,color-mix(in srgb,var(--surface-tint),white 42%),transparent calc(100% - var(--surface-opacity) * 1%))}.tile.tile--mist,.dock-tile.tile--mist{background-color:color-mix(in srgb,color-mix(in srgb,var(--surface-tint),#c8d6e0 38%),transparent calc(100% - var(--surface-opacity) * 1%));color:rgba(38,50,70,calc(.78 * var(--ambient-contrast)))}.tile.tile--sage{background-color:color-mix(in srgb,color-mix(in srgb,var(--surface-tint),#b8c9a8 32%),transparent calc(100% - var(--surface-opacity) * 1%));color:rgba(48,62,42,calc(.78 * var(--ambient-contrast)))}.tile.tile--sand{background-color:color-mix(in srgb,color-mix(in srgb,var(--surface-tint),#f0d59c 32%),transparent calc(100% - var(--surface-opacity) * 1%));color:rgba(78,56,18,calc(.78 * var(--ambient-contrast)))}.tile.tile--blue,.dock-tile.tile--blue{background-color:color-mix(in srgb,color-mix(in srgb,var(--surface-tint),#b9c9d8 50%),transparent calc(100% - var(--surface-opacity) * 1%));color:rgba(38,60,88,calc(.78 * var(--ambient-contrast)))}.tile.tile--stone{background-color:color-mix(in srgb,color-mix(in srgb,var(--surface-tint),#cdcdc6 32%),transparent calc(100% - var(--surface-opacity) * 1%));color:rgba(50,48,42,calc(.78 * var(--ambient-contrast)))}.page-dots{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:auto;padding-top:8px}.dot{width:5px;height:5px;border-radius:50%;background:rgba(28,22,18,calc(.25 * var(--ambient-contrast)))}.dot--active{background:rgba(28,22,18,calc(.65 * var(--ambient-contrast)))}.dock{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--tile-gap) * .85);padding:12px;border-radius:calc(30px * var(--corner-radius));background-color:color-mix(in srgb,color-mix(in srgb,var(--surface-tint),white 30%),transparent calc(100% - var(--surface-opacity) * .95%))}.dock-tile{aspect-ratio:1 / 1;border-radius:calc(18px * var(--corner-radius));display:flex;align-items:center;justify-content:center;color:rgba(28,22,18,calc(.78 * var(--ambient-contrast)))}.elevated{--_s: .5;--_dep: 1;--_dx: calc(var(--depth-dir-x) * var(--depth-px) * var(--_dep));--_dy: calc(var(--depth-dir-y) * var(--depth-px) * var(--_dep));--_wall-base: calc( (var(--shadow-opacity) * 55 + 3) * 1% * (1 - var(--sun-gaze) * .6) );--_wall-1: color-mix(in srgb, var(--surface-tint), var(--shadow-tint) calc(var(--_wall-base) * .25));--_wall-2: color-mix(in srgb, var(--surface-tint), var(--shadow-tint) calc(var(--_wall-base) * .55));--_wall-3: color-mix(in srgb, var(--surface-tint), var(--shadow-tint) calc(var(--_wall-base) * .85));--_wall-4: color-mix(in srgb, var(--surface-tint), var(--shadow-tint) calc(var(--_wall-base) * 1.2));--_cast: color-mix(in srgb, var(--shadow-tint), transparent calc(100% - var(--shadow-opacity) * 100% * var(--shadow-reach-mul) * var(--floating-mul)));--_cast-soft: color-mix(in srgb, var(--shadow-tint), transparent calc(100% - var(--shadow-opacity) * 55% * var(--floating-mul)));--_cast-contact:color-mix(in srgb, var(--shadow-tint), transparent calc(100% - var(--shadow-opacity) * 35% * var(--shadow-contact-mul) * var(--floating-mul)));--_flat: color-mix(in srgb, var(--shadow-tint), transparent calc(100% - var(--shadow-opacity) * 4% * (1 - var(--floating-mul))));--_fdx: calc(var(--shadow-x) * var(--depth-scale) * var(--shadow-reach-mul));--_fdy: calc(var(--shadow-y) * var(--depth-scale) * var(--shadow-reach-mul));--_fblur: calc(var(--shadow-blur) * .04);box-shadow:calc(var(--_dx) * .125) calc(var(--_dy) * .125 + var(--slab-offset)) 0 0 var(--_wall-1),calc(var(--_dx) * .25) calc(var(--_dy) * .25 + var(--slab-offset)) 0 0 var(--_wall-1),calc(var(--_dx) * .375) calc(var(--_dy) * .375 + var(--slab-offset)) 0 0 var(--_wall-2),calc(var(--_dx) * .5) calc(var(--_dy) * .5 + var(--slab-offset)) 0 0 var(--_wall-2),calc(var(--_dx) * .625) calc(var(--_dy) * .625 + var(--slab-offset)) 0 0 var(--_wall-3),calc(var(--_dx) * .75) calc(var(--_dy) * .75 + var(--slab-offset)) 0 0 var(--_wall-3),calc(var(--_dx) * .875) calc(var(--_dy) * .875 + var(--slab-offset)) 0 0 var(--_wall-4),calc(var(--_dx) * 1) calc(var(--_dy) * 1 + var(--slab-offset)) 0 0 var(--_wall-4),var(--_dx) calc(var(--_dy) + 1px + var(--shadow-distance-drop) * .4 + var(--slab-offset)) 1.5px var(--shadow-spread) var(--_cast-contact),calc(var(--shadow-x) * var(--_s) + var(--_dx)) calc(var(--shadow-y) * var(--_s) + var(--_dy) * 2.5 + 1px + var(--shadow-distance-drop) + var(--slab-offset)) calc(var(--shadow-blur) * var(--_s) + 1px + var(--depth-px) * 1.6 * var(--floating-mul)) var(--shadow-spread) var(--_cast-soft),calc(var(--shadow-x) * var(--_s) * 2 + var(--_dx)) calc(var(--shadow-y) * var(--_s) * 1.7 + var(--_dy) * 3 + 2px + var(--shadow-distance-drop) * 1.4 + var(--slab-offset)) calc(var(--shadow-blur) * var(--_s) * 1.6 + 4px + var(--depth-px) * 2.4 * var(--floating-mul)) var(--shadow-spread) var(--_cast),calc(var(--_fdx) * .1 + var(--_dx)) calc(var(--_fdy) * .1 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * .2 + var(--_dx)) calc(var(--_fdy) * .2 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * .3 + var(--_dx)) calc(var(--_fdy) * .3 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * .4 + var(--_dx)) calc(var(--_fdy) * .4 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * .5 + var(--_dx)) calc(var(--_fdy) * .5 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * .6 + var(--_dx)) calc(var(--_fdy) * .6 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * .7 + var(--_dx)) calc(var(--_fdy) * .7 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * .8 + var(--_dx)) calc(var(--_fdy) * .8 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * .9 + var(--_dx)) calc(var(--_fdy) * .9 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1 + var(--_dx)) calc(var(--_fdy) * 1 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1.1 + var(--_dx)) calc(var(--_fdy) * 1.1 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1.2 + var(--_dx)) calc(var(--_fdy) * 1.2 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1.3 + var(--_dx)) calc(var(--_fdy) * 1.3 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1.4 + var(--_dx)) calc(var(--_fdy) * 1.4 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1.5 + var(--_dx)) calc(var(--_fdy) * 1.5 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1.6 + var(--_dx)) calc(var(--_fdy) * 1.6 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1.7 + var(--_dx)) calc(var(--_fdy) * 1.7 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1.8 + var(--_dx)) calc(var(--_fdy) * 1.8 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 1.9 + var(--_dx)) calc(var(--_fdy) * 1.9 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 2 + var(--_dx)) calc(var(--_fdy) * 2 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 2.1 + var(--_dx)) calc(var(--_fdy) * 2.1 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 2.2 + var(--_dx)) calc(var(--_fdy) * 2.2 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 2.3 + var(--_dx)) calc(var(--_fdy) * 2.3 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 2.4 + var(--_dx)) calc(var(--_fdy) * 2.4 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),calc(var(--_fdx) * 2.5 + var(--_dx)) calc(var(--_fdy) * 2.5 + var(--_dy) + var(--slab-offset)) var(--_fblur) var(--shadow-spread) var(--_flat),inset 0 1px rgba(255,255,255,calc(var(--highlight-opacity) * .7 * var(--highlight-mul))),inset calc(var(--depth-dir-x) * -1.5px) calc(var(--depth-dir-y) * -.5px) 0 0 rgba(255,255,255,calc(var(--highlight-opacity) * .18 * var(--highlight-mul))),inset 0 0 0 calc(var(--sun-gaze) * 1.2px) rgba(255,255,255,calc(var(--sun-gaze) * .85 * var(--highlight-mul))),inset calc(var(--gaze-dir-x) * 14px * var(--sun-gaze)) calc(var(--gaze-dir-y) * 14px * var(--sun-gaze)) calc(8px + var(--sun-gaze) * 18px) calc(var(--sun-gaze) * .6px) rgba(255,255,255,calc(var(--sun-gaze) * .22 * var(--highlight-mul))),calc(var(--gaze-dir-x) * -14px * var(--sun-gaze)) calc(var(--gaze-dir-y) * -14px * var(--sun-gaze)) calc(10px + var(--sun-gaze) * 18px) calc(var(--sun-gaze) * .6px) rgba(255,255,255,calc(var(--sun-gaze) * .32 * var(--highlight-mul))),inset 0 calc(.4px + var(--pillow) * .05px) calc(.6px + var(--pillow) * .16px) 0 rgba(255,255,255,calc(var(--pillow) * .0055 * var(--highlight-mul))),inset 0 calc(-.4px - var(--pillow) * .05px) calc(.6px + var(--pillow) * .18px) 0 rgba(0,0,0,calc(var(--pillow) * .0035))}.elevated.sm,.elevated.md,.elevated.lg{--_s: .55;--_dep: .85}.widget,.tile,.dock,.dock-tile{position:relative;backdrop-filter:blur(calc((100 - var(--surface-opacity)) * .35px)) saturate(1.05);-webkit-backdrop-filter:blur(calc((100 - var(--surface-opacity)) * .35px)) saturate(1.05);overflow:hidden}.widget:before,.tile:before,.dock:before,.dock-tile:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse 60% 32% at 22% 14%,rgba(255,255,255,calc(var(--gloss) * .55 * var(--highlight-mul))) 0%,transparent 70%),linear-gradient(170deg,rgba(255,255,255,calc(var(--highlight-opacity) * .32 * var(--highlight-mul))) 0%,transparent 42%,transparent 68%,rgba(0,0,0,calc(var(--shadow-opacity) * .14)) 100%);z-index:1}.widget>*,.tile>*,.dock>*,.dock-tile>*{position:relative;z-index:2}.panel{max-height:100%;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:24px;color:#f4ece2;background:linear-gradient(180deg,color-mix(in srgb,#06070b,transparent 25%),color-mix(in srgb,#06070b,transparent 50%));padding:28px 26px;border-radius:28px;border:1px solid rgba(255,255,255,.06);backdrop-filter:blur(18px) saturate(1.1);-webkit-backdrop-filter:blur(18px) saturate(1.1);box-shadow:0 30px 60px #00000059,inset 0 1px #ffffff0d;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent;scroll-behavior:smooth}.panel::-webkit-scrollbar{width:6px}.panel::-webkit-scrollbar-track{background:transparent}.panel::-webkit-scrollbar-thumb{background:#ffffff29;border-radius:999px}.panel::-webkit-scrollbar-thumb:hover{background:#ffffff47}@media(max-width:1100px){.panel{align-self:auto;overflow-y:visible}}.about-pill{position:fixed;top:22px;right:22px;z-index:50;display:inline-flex;align-items:center;gap:8px;padding:8px 16px 8px 12px;border-radius:999px;background:#ffffff12;border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);color:#ffffffeb;font:inherit;font-size:12px;font-weight:500;letter-spacing:.04em;cursor:pointer;transition:background .22s ease,border-color .22s ease,transform .22s ease;box-shadow:0 8px 24px #0000004d,inset 0 1px #ffffff14}.about-pill:hover{background:#ffffff1f;border-color:#ffffff38}.about-pill:active{transform:scale(.97)}.about-pill-dot{width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#f6c684 60%,#c47424);box-shadow:0 0 12px #ffc88299}.about-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:32px;background:#08080e8c;backdrop-filter:blur(24px) saturate(1.15);-webkit-backdrop-filter:blur(24px) saturate(1.15);animation:fade-in .24s cubic-bezier(.22,.61,.36,1)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.about-card{position:relative;max-width:560px;width:100%;padding:44px 44px 38px;border-radius:28px;background:linear-gradient(180deg,#ffffff17,#ffffff0a);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(36px) saturate(1.4);-webkit-backdrop-filter:blur(36px) saturate(1.4);color:#f4ece2;box-shadow:0 50px 120px #000000a6,0 12px 28px #00000059,inset 0 1px #ffffff1a;animation:about-rise .32s cubic-bezier(.22,.61,.36,1)}@keyframes about-rise{0%{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}.about-close{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:#ffffff0d;color:#ffffffd9;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease,border-color .2s ease}.about-close:hover{background:#ffffff1a;border-color:#fff3}.about-brand{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#f4ece2cc;margin-bottom:22px}.brand-mark.soft{color:#f4ece28c}.brand-sep{color:#f4ece259}.brand-dot{width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#f6c684 60%,#c47424);box-shadow:0 0 12px #ffc882b3}.about-title{font-family:Kalice,Georgia,Times New Roman,serif;font-weight:400;font-size:32px;line-height:1.18;letter-spacing:-.012em;color:#fbf4e7;margin:0 0 14px}.about-tag{font-size:13px;line-height:1.5;color:#f4ece28c;font-style:italic;margin:0}.about-divider{height:1px;margin:24px 0;background:linear-gradient(to right,transparent,rgba(255,255,255,.14) 30%,rgba(255,255,255,.14) 70%,transparent)}.about-body{font-size:13.5px;line-height:1.62;color:#f4ece2d1;margin:0 0 14px}.about-body:last-child{margin-bottom:0}.controls{display:flex;flex-direction:column;gap:16px}.presets{display:flex;flex-direction:column;gap:6px;margin-bottom:4px}.preset-row{display:flex;flex-wrap:wrap;gap:6px}.preset{border:1px solid rgba(255,255,255,.08);background:#ffffff0a;color:#f4ece2e6;font:inherit;font-size:12px;font-weight:500;letter-spacing:.02em;padding:7px 12px;border-radius:999px;cursor:pointer;transition:background .2s ease,border-color .2s ease,transform .2s ease}.preset:hover{background:#ffffff14;border-color:#ffffff24}.preset:active{transform:scale(.97)}.slider{display:flex;flex-direction:column;gap:8px}.slider-head{display:flex;align-items:baseline;justify-content:space-between}.slider-label{font-size:12px;font-weight:500;color:#f4ece2d9;letter-spacing:.02em}.slider-value{font-family:Kalice,Georgia,Times New Roman,serif;font-size:16px;color:#f4ece2f2;font-variant-numeric:tabular-nums}.slider-value-group{display:inline-flex;align-items:center;gap:8px}.slider-reset{width:16px;height:16px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;color:#f4ece28c;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease}.slider-reset:hover{background:#ffffff1f;border-color:#fff3;color:#f4ece2f2}.slider-reset:active{transform:scale(.9)}.switch{position:relative;width:38px;height:22px;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;cursor:pointer;padding:0;flex-shrink:0;transition:background .22s ease,border-color .22s ease}.switch:hover{border-color:#ffffff29}.switch--on{background:#ffc6828c;border-color:#ffc682b3}.switch-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff8ec;box-shadow:0 1px 4px #00000059,inset 0 1px #ffffffb3;transition:transform .22s cubic-bezier(.22,.61,.36,1)}.switch--on .switch-thumb{transform:translate(16px)}.gaze-section{display:flex;flex-direction:column;gap:14px;padding:14px 16px;border:1px solid rgba(255,255,255,.06);border-radius:16px;background:#ffffff05}.gaze-section-head{display:flex;align-items:center;justify-content:space-between}.gaze-section-title{font-size:12px;font-weight:500;letter-spacing:.02em;color:#f4ece2eb}.gaze-section-body{display:flex;flex-direction:column;gap:14px;padding-top:4px;animation:gaze-body-in .24s cubic-bezier(.22,.61,.36,1)}@keyframes gaze-body-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.segmented-field{display:flex;flex-direction:column;gap:8px}.segmented-label{font-size:12px;font-weight:500;color:#f4ece2d9;letter-spacing:.02em}.segmented{display:inline-flex;background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:3px;gap:2px}.segmented-option{flex:1;border:none;background:transparent;color:#f4ece28c;font:inherit;font-size:12px;font-weight:500;letter-spacing:.02em;padding:7px 14px;border-radius:9px;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease}.segmented-option:hover:not(.active){color:#f4ece2d9}.segmented-option:active{transform:scale(.97)}.segmented-option.active{background:#ffffff14;color:#f4ece2f5;box-shadow:inset 0 1px #ffffff14}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:22px;background:transparent;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:999px;background:linear-gradient(to right,rgba(255,220,170,.85) 0 var(--slider-pct, 50%),rgba(255,255,255,.1) var(--slider-pct, 50%) 100%)}input[type=range]::-moz-range-track{height:3px;border-radius:999px;background:#ffffff1a}input[type=range]::-moz-range-progress{height:3px;border-radius:999px;background:#ffdcaad9}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin-top:-7px;width:16px;height:16px;border-radius:50%;background:#fff8ec;box-shadow:0 2px 6px #00000059,inset 0 1px #ffffffb3;border:none}input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff8ec;border:none;box-shadow:0 2px 6px #00000059}.advanced-toggle{display:flex;align-items:center;gap:10px;padding:12px 14px;margin-top:4px;border:1px solid rgba(255,255,255,.08);background:#ffffff08;border-radius:14px;color:#f4ece2eb;font:inherit;font-size:12px;font-weight:500;letter-spacing:.02em;cursor:pointer;transition:background .2s ease,border-color .2s ease}.advanced-toggle:hover{background:#ffffff0d;border-color:#ffffff24}.advanced-toggle-label{flex:1;text-align:left}.advanced-toggle-meta{font-size:11px;color:#f4ece280;letter-spacing:.04em}.advanced-toggle-arrow{color:#f4ece28c;transition:transform .24s cubic-bezier(.22,.61,.36,1)}.advanced-toggle.open .advanced-toggle-arrow{transform:rotate(180deg)}.advanced-section{display:flex;flex-direction:column;gap:16px;padding:18px 16px;margin-top:-4px;border:1px solid rgba(255,255,255,.06);border-radius:18px;background:#ffffff05;animation:advanced-in .26s cubic-bezier(.22,.61,.36,1)}@keyframes advanced-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.debug{display:grid;grid-template-columns:1fr 1fr;gap:4px 24px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06);font-size:11px;letter-spacing:.02em;color:#f4ece280;font-variant-numeric:tabular-nums}.debug-row{display:flex;align-items:baseline;justify-content:space-between;padding:3px 0}.debug-label{text-transform:uppercase;font-size:10px;letter-spacing:.12em;color:#f4ece266}.debug-value{color:#f4ece2d9;font-family:Kalice,Georgia,Times New Roman,serif;font-size:13px}
