/* Sunshine visual layer — loaded after usability.css.
   Warm dimensional daylight for the default theme; Star mode remains untouched. */

html[data-theme="sunshine"]{
  --bg-0:#fff0b6;
  --bg-1:#fffbed;
  --bg-2:#fffdf8;
  --panel:rgba(255,253,247,.82);
  --panel-2:rgba(249,238,218,.68);
  --panel-border:rgba(126,83,34,.15);
  --panel-hover:rgba(255,246,225,.94);
  --ink:#382d22;
  --ink-soft:#756351;
  --ink-faint:#a18b72;
  --gold:#a85e12;
  --gold-glow:rgba(221,143,49,.30);
  --peri:#756348;
  --peri-strong:#4f402d;
  --note:rgba(255,242,209,.72);
  --note-border:rgba(184,108,24,.24);
  --line:rgba(112,73,31,.11);
  --shadow:0 22px 60px -34px rgba(112,65,18,.34),0 8px 22px -18px rgba(112,65,18,.20);
  --drop:rgba(200,119,27,.12);
}

html[data-theme="sunshine"] body{
  background:
    radial-gradient(1150px 780px at 96% -12%,rgba(255,219,65,.40),transparent 61%),
    radial-gradient(900px 680px at -8% 20%,rgba(255,233,130,.32),transparent 66%),
    radial-gradient(860px 620px at 78% 104%,rgba(255,215,67,.18),transparent 65%),
    linear-gradient(150deg,#fffdf8 0%,#fff8d8 43%,#fff1b8 100%);
  background-attachment:fixed;
}

/* Atmospheric nodes are inserted by sky.js and never receive input. */
.sunshine-atmosphere{display:none}
html[data-theme="sunshine"] .sunshine-atmosphere{
  display:block;
  position:fixed;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  contain:strict;
}
.sunshine-atmosphere > span{position:absolute;display:block;pointer-events:none}
.sunshine-halo--primary{
  width:clamp(420px,67vw,920px);
  aspect-ratio:1;
  top:clamp(-460px,-33vw,-220px);
  right:clamp(-330px,-17vw,-100px);
  border-radius:50%;
  opacity:.78;
  background:
    radial-gradient(circle at 50% 50%,rgba(255,249,212,.96) 0 8%,rgba(255,224,77,.55) 20%,rgba(255,211,47,.22) 39%,rgba(255,218,67,.09) 55%,transparent 71%),
    repeating-radial-gradient(circle at 50% 50%,transparent 0 17%,rgba(255,255,255,.24) 17.3% 17.7%,transparent 18% 24%);
  filter:blur(.2px);
  animation:sunshine-breathe 14s ease-in-out infinite alternate;
}
.sunshine-halo--drift{
  width:clamp(260px,39vw,560px);
  aspect-ratio:1;
  left:clamp(-250px,-13vw,-70px);
  bottom:clamp(-300px,-20vw,-120px);
  border-radius:50%;
  opacity:.50;
  background:radial-gradient(circle,rgba(255,216,70,.25),rgba(250,200,125,.10) 43%,transparent 70%);
  animation:sunshine-drift 19s ease-in-out infinite alternate;
}
.sunshine-rayfield{
  width:min(1140px,108vw);
  aspect-ratio:1;
  top:-64vw;
  right:-34vw;
  opacity:.17;
  background:repeating-conic-gradient(from 14deg at 50% 50%,rgba(200,111,20,.36) 0deg 2deg,transparent 3deg 13deg);
  -webkit-mask-image:radial-gradient(circle,rgba(0,0,0,.92),transparent 67%);
  mask-image:radial-gradient(circle,rgba(0,0,0,.92),transparent 67%);
  animation:sunshine-turn 75s linear infinite;
}
.sunshine-horizon{
  left:-8%;
  right:-8%;
  bottom:-20%;
  height:52%;
  border-radius:50% 50% 0 0;
  opacity:.32;
  background:radial-gradient(ellipse at 55% 100%,rgba(255,207,45,.30),rgba(255,225,93,.15) 47%,transparent 73%);
  animation:sunshine-horizon 17s ease-in-out infinite alternate;
}

/* A sparse dusting of light keeps the whimsical Star Planner lineage. */
html[data-theme="sunshine"] body::before{
  display:block !important;
  content:'';
  position:fixed;
  inset:-4%;
  z-index:0;
  pointer-events:none;
  opacity:.42;
  background-image:
    radial-gradient(circle at 12% 16%,rgba(183,103,19,.42) 0 1.2px,transparent 1.7px),
    radial-gradient(circle at 28% 72%,rgba(255,255,255,.92) 0 1.3px,transparent 1.8px),
    radial-gradient(circle at 63% 14%,rgba(197,117,30,.38) 0 1px,transparent 1.6px),
    radial-gradient(circle at 88% 46%,rgba(255,255,255,.88) 0 1.5px,transparent 2px),
    radial-gradient(circle at 54% 87%,rgba(188,100,26,.34) 0 1.2px,transparent 1.8px),
    radial-gradient(circle at 37% 39%,rgba(255,255,255,.84) 0 1px,transparent 1.6px),
    radial-gradient(circle at 92% 80%,rgba(177,93,19,.31) 0 1.2px,transparent 1.8px);
  animation:sunshine-motes 23s ease-in-out infinite alternate;
}

/* Glassy cream surfaces gain depth without changing layout or typography. */
html[data-theme="sunshine"] .panel,
html[data-theme="sunshine"] .project,
html[data-theme="sunshine"] .login-card{
  background:
    linear-gradient(145deg,rgba(255,255,255,.74),rgba(255,250,238,.48)),
    var(--panel);
  border-color:var(--panel-border);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.90),
    inset 0 -1px 0 rgba(170,105,34,.04),
    var(--shadow);
  backdrop-filter:blur(15px) saturate(1.08);
  -webkit-backdrop-filter:blur(15px) saturate(1.08);
}
html[data-theme="sunshine"] .panel{position:relative}
html[data-theme="sunshine"] .panel::before{
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(118deg,rgba(255,255,255,.32),transparent 27%,transparent 72%,rgba(224,137,44,.035));
}
html[data-theme="sunshine"] .btn,
html[data-theme="sunshine"] .viewseg{
  background:rgba(255,252,244,.76);
  border-color:rgba(124,79,31,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.86),0 10px 28px -21px rgba(112,65,18,.42);
  backdrop-filter:blur(14px) saturate(1.08);
  -webkit-backdrop-filter:blur(14px) saturate(1.08);
}
html[data-theme="sunshine"] .btn:hover,
html[data-theme="sunshine"] .viewseg button.on{
  background:linear-gradient(145deg,rgba(255,255,255,.90),rgba(255,235,196,.72));
}
html[data-theme="sunshine"] .cube{
  background:linear-gradient(165deg,rgba(255,255,255,.88),rgba(249,227,186,.72));
  border-color:rgba(147,91,31,.17);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.96),0 12px 27px -20px rgba(128,72,15,.50);
}
html[data-theme="sunshine"] .cube .fv{text-shadow:0 1px 0 rgba(255,255,255,.72),0 0 14px var(--gold-glow)}
html[data-theme="sunshine"] .greeting .name{
  background:linear-gradient(95deg,#9d5110,#c6781c 54%,#9a4d12);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:none;
}
html[data-theme="sunshine"] .eyebrow .spark,
html[data-theme="sunshine"] .cstar,
html[data-theme="sunshine"] .stamp-star{
  color:#b96813;
  filter:drop-shadow(0 2px 5px rgba(194,111,19,.24));
}
html[data-theme="sunshine"] .slot.filled,
html[data-theme="sunshine"] .cell.has-fin{
  background:linear-gradient(135deg,rgba(255,249,227,.88),rgba(255,226,169,.30));
}
html[data-theme="sunshine"] .chip{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 13px 27px -23px rgba(124,70,16,.58);
}
html[data-theme="sunshine"] .pulseitem,
html[data-theme="sunshine"] .drow,
html[data-theme="sunshine"] .cap-add,
html[data-theme="sunshine"] .reflect textarea{
  background:linear-gradient(145deg,rgba(255,253,245,.68),rgba(248,231,200,.48));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.70);
}

/* Yanaki's lane: brighter golden-yellow light, still calm and work-first. */
html[data-theme="sunshine"][data-lane="partner"]{
  --panel:rgba(255,253,247,.88);
  --panel-2:rgba(251,235,207,.72);
  --panel-border:rgba(145,82,22,.16);
  --gold:#a9540e;
  --gold-glow:rgba(229,139,45,.34);
  --peri:#6f5a3d;
  --peri-strong:#493823;
}
html[data-theme="sunshine"][data-lane="partner"] body{
  background:
    radial-gradient(1000px 720px at 82% -10%,rgba(255,216,45,.42),transparent 63%),
    radial-gradient(780px 590px at -7% 37%,rgba(255,235,139,.32),transparent 67%),
    radial-gradient(760px 520px at 85% 105%,rgba(255,212,60,.20),transparent 64%),
    linear-gradient(155deg,#fffdf8 0%,#fff8d0 51%,#ffefac 100%);
}
html[data-theme="sunshine"][data-lane="partner"] .sunshine-halo--primary{right:-9vw;top:-31vw;opacity:.90}
html[data-theme="sunshine"][data-lane="partner"] .sunshine-rayfield{opacity:.21}
html[data-theme="sunshine"][data-lane="partner"] .partner .pcard{
  border-color:rgba(149,86,24,.17);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.94),0 25px 62px -39px rgba(129,68,12,.45);
}
html[data-theme="sunshine"][data-lane="partner"] .partner .pcard:nth-child(even){
  background:
    linear-gradient(145deg,rgba(255,255,255,.76),rgba(255,244,222,.58)),
    var(--panel);
}
html[data-theme="sunshine"][data-lane="partner"] .peyebrow{
  color:#8e591f;
}
html[data-theme="sunshine"][data-lane="partner"] .partner .phelp{
  border-color:rgba(201,112,22,.26);
  background:
    linear-gradient(130deg,rgba(255,255,255,.82),rgba(255,235,193,.62)),
    var(--panel);
}

@keyframes sunshine-breathe{
  0%{transform:translate3d(-1.2%,0,0) scale(.985);opacity:.70}
  100%{transform:translate3d(1.5%,2.2%,0) scale(1.035);opacity:.86}
}
@keyframes sunshine-drift{
  0%{transform:translate3d(-2%,2%,0) scale(.97)}
  100%{transform:translate3d(5%,-4%,0) scale(1.05)}
}
@keyframes sunshine-turn{to{transform:rotate(360deg)}}
@keyframes sunshine-horizon{
  0%{transform:translate3d(-1%,2%,0) scaleX(.98)}
  100%{transform:translate3d(2%,-2%,0) scaleX(1.04)}
}
@keyframes sunshine-motes{
  0%{transform:translate3d(0,0,0);opacity:.34}
  100%{transform:translate3d(.7%,-.8%,0);opacity:.50}
}

/* Parent motion toggle and OS accessibility preference stop background motion only. */
html[data-motion="paused"] .sunshine-atmosphere > span,
html[data-motion="paused"][data-theme="sunshine"] body::before,
html[data-page-hidden="true"] .sunshine-atmosphere > span,
html[data-page-hidden="true"][data-theme="sunshine"] body::before{
  animation-play-state:paused !important;
}
@media (prefers-reduced-motion:reduce){
  .sunshine-atmosphere > span,
  html[data-theme="sunshine"] body::before{animation:none !important}
}
@media (max-width:560px){
  .sunshine-halo--primary{width:620px;top:-350px;right:-310px;opacity:.66}
  .sunshine-rayfield{width:820px;top:-520px;right:-480px;opacity:.12}
  .sunshine-halo--drift{opacity:.36}
  html[data-theme="sunshine"] .panel,
  html[data-theme="sunshine"] .project{backdrop-filter:blur(11px);-webkit-backdrop-filter:blur(11px)}
}