:root {
  --shell-ink: #12342e;
  --shell-forest: #0b4a3c;
  --shell-leaf: #8de05c;
}

.system-logo { position: fixed; z-index: 220; top: max(20px, calc(env(safe-area-inset-top) + 12px)); left: clamp(18px, 3.2vw, 52px); min-width: 0; display: inline-flex; align-items: center; gap: 12px; color: white; text-decoration: none; filter: drop-shadow(0 3px 8px rgba(3,28,23,.5)); transition: transform .2s, filter .2s; }
.system-logo:hover { transform: translateY(-2px); filter: drop-shadow(0 5px 12px rgba(3,28,23,.62)); }
.system-logo-mark { position: relative; width: 42px; height: 42px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.72); border-radius: 50% 50% 44% 56%; transform: rotate(-8deg); }
.system-logo-mark::before, .system-logo-mark::after, .system-logo-mark i { content: ""; position: absolute; width: 14px; height: 8px; border-radius: 90% 0 90% 0; background: var(--shell-leaf); }
.system-logo-mark::before { top: -4px; left: 5px; transform: rotate(-32deg); }
.system-logo-mark::after { top: -6px; right: 5px; transform: rotate(22deg) scaleX(-1); }
.system-logo-mark i { top: -10px; left: 15px; transform: rotate(-2deg); }
.system-logo-mark b { font-size: 17px; font-weight: 700; transform: rotate(8deg); }
.system-logo-copy { display: grid; gap: 5px; line-height: 1; }
.system-logo-copy strong { font-size: 17px; letter-spacing: .14em; }
.system-logo-copy small { color: rgba(255,255,255,.8); font-size: 8px; letter-spacing: .2em; }

.system-service-backdrop { position: fixed; z-index: 214; inset: 0; background: radial-gradient(circle at calc(100% - 42px) calc(100% - 42px), rgba(141,224,92,.1), transparent 40%), rgba(2,24,20,.62); opacity: 0; backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); transition: opacity .3s; }
.system-service-backdrop[hidden], .system-service-panel[hidden] { display: none; }
.system-service-backdrop.is-open { opacity: 1; }
.system-service-dock { position: fixed; z-index: 220; right: max(24px, calc(env(safe-area-inset-right) + 16px)); bottom: max(24px, calc(env(safe-area-inset-bottom) + 16px)); width: 66px; height: 66px; }
.system-service-trigger { position: relative; z-index: 3; width: 66px; height: 66px; padding: 0; display: grid; place-items: center; border: 1px solid rgba(18,52,46,.14); border-radius: 50%; color: #153d32; background: var(--shell-leaf); box-shadow: 0 15px 42px rgba(7,43,35,.32); cursor: pointer; transition: transform .25s, box-shadow .25s, color .25s, background .25s; }
.system-service-trigger:hover { transform: translateY(-3px) scale(1.03); background: #a3ef70; box-shadow: 0 22px 58px rgba(7,43,35,.38); }
.system-service-trigger > span { display: grid; gap: 2px; text-align: center; }
.system-service-trigger strong { font-family: "Songti SC", serif; font-size: 15px; letter-spacing: .08em; }
.system-service-trigger small { font-size: 6px; letter-spacing: .12em; opacity: .55; }
.system-service-dock.is-open .system-service-trigger { color: white; border-color: rgba(255,255,255,.3); background: var(--shell-forest); transform: rotate(-8deg); }
.system-service-panel { position: absolute; z-index: 2; right: 0; bottom: 0; width: 66px; height: 66px; overflow: visible; opacity: 0; pointer-events: none; transition: opacity .18s; }
.system-service-panel.is-open { opacity: 1; pointer-events: auto; }
.system-service-panel nav { position: relative; width: 100%; height: 100%; }
.system-service-orb { position: absolute; right: -7px; bottom: -7px; width: var(--size); height: var(--size); padding: 7px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; isolation:isolate; border:2px solid #f4cf72; border-radius:50%; color:white; background:radial-gradient(circle at 30% 22%,rgba(255,255,255,.32),transparent 24%),linear-gradient(145deg,var(--orb-color,#176b57),var(--orb-shade,#063129)); box-shadow:0 14px 35px rgba(0,0,0,.28),0 0 0 2px rgba(123,82,13,.48),0 0 18px var(--orb-glow,rgba(244,207,114,.48)),inset 0 1px 0 rgba(255,255,255,.32); opacity:0; transform:translate(0,0) scale(.2); transition:transform .48s cubic-bezier(.2,.86,.3,1.18),opacity .24s,filter .2s,box-shadow .2s; transition-delay:0ms; cursor:pointer; text-align:center; text-decoration:none; text-shadow:0 1px 3px rgba(0,0,0,.48); }
.system-service-orb::before { content:""; position:absolute; z-index:-1; inset:-6px; border:1px solid rgba(255,218,126,.72); border-radius:inherit; box-shadow:0 0 8px rgba(255,206,99,.62),0 0 18px var(--orb-glow,rgba(255,206,99,.42)); opacity:.72; animation:systemOrbGlow 1.85s ease-in-out infinite; animation-delay:var(--delay); }
.system-service-panel.is-open .system-service-orb { opacity: 1; transform: translate(var(--x), var(--y)) scale(1); transition-delay: var(--delay); }
.system-service-orb:hover, .system-service-orb:focus-visible, .system-service-orb.is-active { color:white; border-color:#ffe7a3; filter:brightness(1.12) saturate(1.08); box-shadow:0 20px 46px rgba(0,0,0,.34),0 0 0 3px rgba(255,213,111,.36),0 0 30px var(--orb-glow,rgba(255,206,99,.58)); outline:none; }
.system-service-orb b { font-family: "Songti SC", serif; font-size: 22px; line-height: 1; }
.system-service-orb span { max-width: 68px; font-size: 10px; font-weight: 700; line-height: 1.15; white-space: nowrap; }
@keyframes systemOrbGlow { 0%,100% { opacity:.55; transform:scale(.96); } 50% { opacity:1; transform:scale(1.055); box-shadow:0 0 13px rgba(255,215,126,.92),0 0 28px var(--orb-glow,rgba(255,206,99,.65)); } }
body.system-service-open { overflow: hidden; }

.admin-frame-body { margin: 0; overflow: hidden; background: #e9eee5; }
.admin-frame { position: fixed; z-index: 1; inset: 0; width: 100%; height: 100%; border: 0; background: #e9eee5; }
.admin-frame-body .system-logo { color: var(--shell-ink); filter: drop-shadow(0 3px 8px rgba(255,255,255,.78)); }
.admin-frame-body .system-logo-mark { border-color: rgba(18,52,46,.56); }
.admin-frame-body .system-logo-copy small { color: rgba(18,52,46,.7); }
.admin-plan-entry { position: fixed; z-index: 225; top: max(21px, calc(env(safe-area-inset-top) + 13px)); right: max(20px, calc(env(safe-area-inset-right) + 14px)); min-height: 43px; padding: 0 16px; display: flex; align-items: center; border: 1px solid rgba(18,52,46,.18); border-radius: 999px; color: white; background: var(--shell-forest); box-shadow: 0 10px 28px rgba(5,42,34,.2); font: 700 12px/1 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; text-decoration: none; }

@media (max-width: 700px) {
  .system-logo { top: max(14px, calc(env(safe-area-inset-top) + 8px)); left: 14px; }
  .system-logo-mark { width: 38px; height: 38px; }
  .system-logo-copy strong { font-size: 15px; }
  .system-logo-copy small { font-size: 7px; }
  .admin-plan-entry { top: max(62px, calc(env(safe-area-inset-top) + 58px)); right: 12px; min-height: 38px; padding: 0 13px; font-size: 10px; }
  .system-service-dock { right: max(12px, calc(env(safe-area-inset-right) + 8px)); bottom: max(13px, calc(env(safe-area-inset-bottom) + 9px)); width: 58px; height: 58px; }
  .system-service-trigger, .system-service-panel { width: 58px; height: 58px; }
  .system-service-trigger strong { font-size: 14px; }
  .system-service-trigger small { font-size: 5px; }
  .system-service-panel.is-open .system-service-orb { transform: translate(var(--mx), var(--my)) scale(.84); }
  .system-service-orb b { font-size: 21px; }
  .system-service-orb span { font-size: 10px; }
}

@media (max-width: 390px) {
  .system-service-orb.orb-homeland { --mx: -94px !important; }
  .system-service-orb.orb-manor { --mx: -174px !important; }
  .system-service-orb.orb-city { --mx: -82px !important; }
  .system-service-orb.orb-steward { --mx: -151px !important; }
  .system-service-orb.orb-farm { --mx: -204px !important; }
  .system-service-orb.orb-ranch { --mx: -232px !important; }
  .system-service-orb.orb-pond { --mx: -246px !important; }
}

@media (max-width: 700px) and (max-height: 720px) {
  .system-service-panel.is-open .system-service-orb { transform: translate(var(--mx), var(--my)) scale(.76); }
  .system-service-orb.orb-homeland { --my: -348px !important; }
  .system-service-orb.orb-manor { --my: -300px !important; }
  .system-service-orb.orb-city { --my: -262px !important; }
  .system-service-orb.orb-steward { --my: -208px !important; }
  .system-service-orb.orb-farm { --my: -148px !important; }
  .system-service-orb.orb-ranch { --my: -86px !important; }
  .system-service-orb.orb-pond { --my: -22px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .system-logo, .system-service-backdrop, .system-service-trigger, .system-service-panel, .system-service-orb { transition-duration: .01ms !important; }
}
