/* Hucial — Human Emotion UI */
:root{
 --emotion-morning:#eef9f4;--emotion-afternoon:#eef8fb;--emotion-evening:#f3eef8;
 --emotion-glow:rgba(129,211,211,.22);--emotion-gold:rgba(215,188,132,.16);--emotion-sage:rgba(178,204,187,.18);
 --emotion-surface:linear-gradient(145deg,rgba(255,255,255,.86),rgba(250,248,242,.72));
}
html[data-emotion-period="morning"]{--emotion-canvas:radial-gradient(circle at 14% 5%,rgba(195,229,210,.28),transparent 32%),radial-gradient(circle at 88% 12%,rgba(225,205,155,.14),transparent 30%)}
html[data-emotion-period="afternoon"]{--emotion-canvas:radial-gradient(circle at 18% 2%,rgba(153,220,229,.22),transparent 34%),radial-gradient(circle at 86% 8%,rgba(222,196,142,.13),transparent 28%)}
html[data-emotion-period="evening"]{--emotion-canvas:radial-gradient(circle at 12% 0%,rgba(180,166,218,.20),transparent 34%),radial-gradient(circle at 88% 10%,rgba(121,201,207,.15),transparent 30%)}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:var(--emotion-canvas),linear-gradient(180deg,rgba(255,255,255,.35),transparent 45%);transition:background 2.4s ease}
body::after{content:"";position:fixed;z-index:-1;inset:auto -18vw -22vh auto;width:min(68vw,760px);aspect-ratio:1;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(139,216,217,.14),transparent 67%);filter:blur(22px);animation:hucial-emotion-breathe 11s ease-in-out infinite alternate}
main{position:relative;isolation:isolate}
main::before{content:"";position:absolute;z-index:-1;top:2rem;left:50%;width:min(92vw,1050px);height:280px;transform:translateX(-50%);border-radius:48% 52% 44% 56%/58% 42% 58% 42%;background:radial-gradient(ellipse,rgba(255,255,255,.46),rgba(152,216,219,.08) 48%,transparent 72%);filter:blur(10px);pointer-events:none}
:is(.card,.panel,.surface,.hucial-flow-action-grid a,.hucial-me-links a){position:relative;overflow:clip;background-image:var(--emotion-surface)}
:is(.card,.panel,.surface,.hucial-flow-action-grid a,.hucial-me-links a)::after{content:"";position:absolute;inset:-42% auto auto -18%;width:58%;aspect-ratio:1;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,255,255,.55),transparent 70%);opacity:.42;transform:translate3d(-8%,0,0);transition:opacity var(--motion-base,220ms) ease,transform var(--motion-slow,340ms) ease}
@media(hover:hover){:is(.card,.panel,.surface,.hucial-flow-action-grid a,.hucial-me-links a):hover::after{opacity:.72;transform:translate3d(4%,6%,0)}}
.hucial-emotion-illustration{display:grid;place-items:center;min-height:clamp(150px,22vw,230px);margin:0 0 1.25rem;border:1px solid rgba(146,191,188,.22);border-radius:32px 38px 28px 40px/34px 30px 42px 28px;background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(221,241,237,.42));box-shadow:0 22px 56px rgba(92,171,177,.10);overflow:hidden}
.hucial-emotion-illustration svg{width:min(76%,520px);height:auto;filter:drop-shadow(0 14px 22px rgba(92,171,177,.12))}
.hucial-emotion-intro{display:flex;align-items:center;gap:1rem;margin:0 auto 1.25rem;max-width:1050px;padding:.85rem 1rem;border-radius:24px;background:rgba(255,255,255,.48);border:1px solid rgba(160,199,191,.20);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.hucial-emotion-intro .emotion-orb{flex:0 0 42px;width:42px;height:42px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fff 0 12%,#cceceb 36%,#9bd6d8 64%,rgba(222,190,127,.75));box-shadow:0 0 0 7px rgba(145,216,218,.09),0 8px 25px rgba(104,189,194,.20);animation:hucial-emotion-orb 5.6s ease-in-out infinite}
.hucial-emotion-intro strong{display:block;font-size:.98rem}.hucial-emotion-intro span{display:block;color:var(--muted,#65706f);font-size:.84rem;line-height:1.45}
.hucial-flow-create{box-shadow:0 13px 35px rgba(85,188,194,.22),0 0 0 8px rgba(151,219,220,.08)!important}
.hucial-flow-bar{background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(249,248,243,.92))!important;box-shadow:0 -18px 50px rgba(112,180,182,.10)!important}
button,.btn,[role="button"]{position:relative;overflow:hidden}
button::after,.btn::after,[role="button"]::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 22%,rgba(255,255,255,.35) 46%,transparent 68%);transform:translateX(-120%);transition:transform 520ms var(--motion-luxury,ease)}
button:hover::after,.btn:hover::after,[role="button"]:hover::after{transform:translateX(120%)}
html[data-theme="dark"]{--emotion-surface:linear-gradient(145deg,rgba(39,47,48,.88),rgba(26,33,34,.82));--emotion-glow:rgba(113,206,210,.13)}
html[data-theme="dark"] body::before{opacity:.72}html[data-theme="dark"] .hucial-emotion-intro{background:rgba(35,43,44,.64)}
@keyframes hucial-emotion-breathe{to{transform:translate3d(-4vw,-3vh,0) scale(1.06)}}
@keyframes hucial-emotion-orb{0%,100%{transform:scale(1);filter:saturate(.95)}50%{transform:scale(1.055);filter:saturate(1.08)}}
@media(max-width:640px){.hucial-emotion-intro{margin-inline:.35rem}.hucial-emotion-illustration{border-radius:26px 30px 22px 32px/28px 24px 34px 22px}}
@media(prefers-reduced-motion:reduce){body::after,.hucial-emotion-intro .emotion-orb{animation:none!important}body::before{transition:none!important}}
html[data-reduce-transparency="1"] .hucial-emotion-intro,html[data-reduce-transparency="1"] .hucial-flow-bar{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--surface,#fff)!important}
