html { min-height:100%; background:#75c9f3; cursor:url("/assets/cursor-normal.cur"),auto; }
body { min-height:100vh; background:transparent!important; background-image:none!important; }
body::before { content:""; position:fixed; inset:0; z-index:-10000; pointer-events:none; background:#75c9f3 url("/assets/pagemelt-sky.gif") center/cover no-repeat; }
a,button,[role="button"],input[type="button"],input[type="submit"] { cursor:url("/assets/cursor-link.cur"),pointer!important; }
.container-header,.container-header-gallery { background-image:none!important; isolation:isolate; }
.container-header::before,.container-header-gallery::before { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:url("/images/header9.png") top center/auto 120px repeat-x; filter:sepia(1) saturate(2.05) hue-rotate(64deg) brightness(1.28) contrast(.92); }

footer {
    background-image: none !important;
    isolation: isolate;
}

footer::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: url("/images/footer2.png") top center repeat;
    filter: sepia(1) saturate(2.05) hue-rotate(64deg) brightness(1.28) contrast(.92);
}

.sattoo-footer-copy {
    width: 100%;
    box-sizing: border-box;
    padding: 65px 20px 0;
    cursor: default;
    color: #fff;
    text-align: center;
    line-height: 1.55;
}
@media (prefers-reduced-motion:reduce) { body::before { background-image:url("/assets/pagemelt-sky.gif"); } }

#sattoo-fm-player .fm-control { width:48px!important; min-width:48px!important; height:38px!important; margin:0!important; padding:0!important; border:0!important; outline:3px solid #00243b!important; border-radius:5px!important; background:url("/images/button2.png") center/140%!important; color:white!important; font-size:14px!important; line-height:38px!important; text-align:center!important; text-shadow:black -2px 2px 0!important; box-shadow:0 0 5px black!important; overflow:visible!important; }
#sattoo-fm-player .fm-control.fm-play { width:54px!important; min-width:54px!important; }
#sattoo-fm-player .fm-control:hover { color:#bde9ff!important; box-shadow:0 0 0 3px white!important; transform:translateY(-1px); }

/* Sattoo chat — single, conflict-free layout. */
#sattoo-chat .sattoo-chat-window { position:relative; height:400px; overflow:hidden; border:0; border-radius:15px; background:#00243b; color:#fff; font:12.6px/1.4 Roboto,"Helvetica Neue",Helvetica,Arial,sans-serif; }
#sattoo-chat .sattoo-chat-pinned { position:absolute; z-index:2; inset:0 0 auto; height:104px; box-sizing:border-box; padding:8px 10px 7px; background:#001624; border-bottom:1px solid #1b4c65; text-align:left; }
#sattoo-chat .sattoo-chat-pin { display:block; margin-bottom:3px; color:#7bdcff; font-size:9px; font-weight:bold; letter-spacing:.8px; }
#sattoo-chat .sattoo-chat-rule { display:block; background:linear-gradient(90deg,#79e8ff,#a6ffcb,#ffe78a,#ff9fcf,#bba6ff,#79e8ff); background-size:250% 100%; color:transparent; font-size:12px; font-weight:500; line-height:1.35; -webkit-background-clip:text; background-clip:text; animation:sattooChatGradient 7s linear infinite; }
@keyframes sattooChatGradient { to { background-position:250% 0; } }

#sattoo-chat .sattoo-chat-messages { position:absolute; inset:104px 0 86px; overflow-x:hidden; overflow-y:auto; padding:0; background:#00243b; text-align:left; }
#sattoo-chat .sattoo-chat-message { margin:4px; padding:.2em; overflow:hidden; background:#0b354d; color:#fff; line-height:1.4; overflow-wrap:anywhere; box-shadow:0 1px 2px -2px rgba(0,0,0,.9); }
#sattoo-chat .sattoo-chat-meta { display:block; color:#dcf2ff; }
#sattoo-chat .sattoo-chat-meta strong { padding-right:.5em; font-weight:300; }
#sattoo-chat .sattoo-chat-meta time { float:right; min-width:6em; padding:0 .5em; color:#999; font-size:70%; line-height:1.5; text-align:right; }
#sattoo-chat .sattoo-chat-body { color:#fff; white-space:pre-wrap; }
#sattoo-chat .sattoo-chat-empty { margin:4px; padding:1em; background:#0b354d; text-align:center; }

#sattoo-chat .sattoo-chat-form { position:absolute; z-index:3; inset:auto 0 0; display:block; height:86px; margin:0; padding:0 0 2px; border:0; background:#00243b; }
#sattoo-chat .sattoo-chat-toolbar { display:flex; align-items:center; height:28px; }
#sattoo-chat .sattoo-chat-status { padding:0 7px; overflow:hidden; color:rgba(255,255,255,.55); font-size:9px; line-height:28px; text-align:left; white-space:nowrap; }
#sattoo-chat .sattoo-chat-field { position:relative; display:grid; grid-template-columns:32px minmax(0,1fr); column-gap:6px; width:100%; height:28px; }
#sattoo-chat .sattoo-chat-field:last-child { grid-template-columns:32px minmax(0,1fr) 42px; }

#sattoo-chat .sattoo-chat-name-color,#sattoo-chat .sattoo-chat-emoji-toggle { position:static!important; display:flex!important; grid-column:1; align-items:center!important; justify-content:center!important; width:32px!important; min-width:32px!important; height:28px!important; margin:0!important; padding:0!important; border:0!important; outline:0!important; background:transparent!important; box-shadow:none!important; color:#fff!important; font:15px/1 Arial,sans-serif!important; opacity:.75; }
#sattoo-chat .sattoo-chat-name-color span { display:block; width:10px; height:10px; border:1px solid rgba(255,255,255,.8); border-radius:50%; box-shadow:0 0 3px rgba(0,0,0,.8); }
#sattoo-chat [data-chat-color] { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; opacity:0; pointer-events:none; }

#sattoo-chat .sattoo-chat-form [data-chat-name],#sattoo-chat .sattoo-chat-form [data-chat-body] { position:static!important; grid-column:2; align-self:stretch; width:100%!important; min-width:0; height:28px!important; box-sizing:border-box; margin:0!important; padding:6px 8px!important; overflow:hidden; border:0!important; border-radius:0!important; outline:0!important; background:#001624!important; color:#fff!important; font:inherit!important; line-height:16px!important; resize:none; }
#sattoo-chat .sattoo-chat-form input::placeholder,#sattoo-chat .sattoo-chat-form textarea::placeholder { color:rgba(255,255,255,.4); }
#sattoo-chat .sattoo-chat-form [data-chat-send] { position:static!important; display:block!important; grid-column:3; width:42px!important; min-width:42px!important; height:28px!important; margin:0!important; padding:0!important; border:0!important; border-radius:0!important; outline:0!important; background:transparent!important; color:#fff!important; font:12px/28px Arial,sans-serif!important; text-align:center!important; }

#sattoo-chat .sattoo-chat-emoji-menu { position:absolute; z-index:10; left:4px; bottom:31px; display:grid; grid-template-columns:repeat(5,36px); gap:3px; width:208px; padding:5px; border:1px solid #1b4c65; background:#00243b; box-shadow:0 3px 10px rgba(0,0,0,.55); }
#sattoo-chat .sattoo-chat-emoji-menu[hidden] { display:none; }
#sattoo-chat .sattoo-chat-emoji-menu button { position:static!important; width:36px!important; min-width:36px!important; height:30px!important; margin:0!important; padding:0!important; border:0!important; border-radius:2px!important; background:#0b354d!important; color:#fff!important; font:17px/30px Arial,sans-serif!important; text-align:center!important; }
#sattoo-chat .sattoo-chat-emoji-menu button:hover { background:#17506d!important; }

.sattoo-resolve {
    position: relative;
    display: inline-block;
    align-items: center;
    gap: 7px;
    overflow: hidden;
    width: 90%;
    margin-right: 15px;
    margin-left: 0;
    background: url("/images/checker.png") center / 70%;
    text-align: left;
}

.sattoo-resolve::before {
    content: "";
    position: absolute;
    inset: 9px;
    border: 1px dashed rgba(121, 232, 255, .45);
    border-radius: 12px;
    pointer-events: none;
}

.sattoo-resolve-art {
    position: relative;
    z-index: 1;
    width: 78%;
    max-width: 300px;
    display: block;
    margin: 15px auto -5px;
    filter: drop-shadow(0 8px 8px rgba(0, 10, 20, .45));
}

.sattoo-resolve-copy {
    position: relative;
    z-index: 1;
    padding: 5px 22px 24px;
    color: #dff6ff;
    font-size: 10px;
    line-height: 1.55;
}

.sattoo-resolve-kicker {
    color: #79e8ff;
    font-size: 8px;
    font-weight: bold;
    letter-spacing: 1.4px;
}

.sattoo-resolve-copy h2 {
    margin: 5px 0 12px;
    color: #fff2a8;
    font-size: 16px;
    line-height: 1.05;
    text-shadow: #003759 1px 2px 0;
}

.sattoo-resolve-copy p { margin: 0 0 10px; }
.sattoo-resolve-copy .sattoo-resolve-last { color: #a6ffcb; }
.sattoo-resolve-sign { display: block; color: #ff9fcf; font-style: italic; text-align: right; }

.sattoo-signal-ring { position:relative; overflow:hidden; margin-top:0; background:#001624; text-align:left; }
#webrings { position:relative; z-index:3; }
.sattoo-signal-ring::before { content:""; position:absolute; inset:0; opacity:.16; pointer-events:none; background:repeating-linear-gradient(135deg,transparent 0 12px,#79e8ff 12px 13px); }
.sattoo-signal-ring > * { position:relative; z-index:1; }
.signal-ring-kicker { color:#79e8ff; font-size:8px; letter-spacing:1.4px; }
.sattoo-signal-ring h2 { margin:4px 0 6px; color:#fff2a8; font-size:20px; line-height:1; text-shadow:#003759 1px 2px 0; }
.signal-ring-intro { margin:0 0 11px; color:#b8d8e8; font-size:9px; line-height:1.45; }
.signal-ring-current { display:block; box-sizing:border-box; padding:10px; border:1px solid #24536c; border-radius:8px; background:rgba(11,53,77,.86); text-decoration:none!important; }
.signal-ring-current span,.signal-ring-current strong,.signal-ring-current small { display:block; }
.signal-ring-current span { color:#ff9fcf; font-size:7px; letter-spacing:1px; }
.signal-ring-current strong { margin:3px 0; color:#fff; font-size:12px; line-height:1.3; }
.signal-ring-current small { color:#a6ffcb; font-size:8px; line-height:1.4; }
.signal-ring-controls { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; margin-top:9px; }
.signal-ring-controls button,.signal-ring-links button { width:100%!important; min-width:0!important; margin:0!important; padding:2px!important; font-size:8px!important; line-height:22px!important; }
.signal-ring-links { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:8px; font-size:8px; }
.signal-ring-links button { width:auto!important; padding:0 8px!important; }
.signal-ring-links a,.signal-ring-links span { color:#79e8ff; }
.signal-ring-members { margin-top:8px; padding-top:6px; border-top:1px dashed #24536c; }
.signal-ring-members[hidden] { display:none; }
.signal-ring-members button { display:block; width:100%!important; min-width:0!important; margin:3px 0!important; padding:4px 6px!important; background:#0b354d!important; color:#dff6ff!important; font-size:8px!important; line-height:16px!important; text-align:left!important; }

.sattoo-cloud-wordmark { display:block; width:94%; height:auto; margin:55px auto 10px; filter:drop-shadow(0 5px 7px rgba(0,55,89,.25)); }
.sattoo-art-thumb { width:150px; height:105px; object-fit:cover; border-radius:15px; overflow:hidden; }
/* Keep the live AI status card stable while its generated text changes. */
.sattoo-status-panel{height:250px;min-height:250px;box-sizing:border-box;display:flex;flex-direction:column;overflow:hidden}.sattoo-status-content{flex:1;min-height:0;overflow-y:auto;padding-right:6px;font-size:14px;line-height:1.65;scrollbar-width:thin;scrollbar-color:#4d9fc6 rgba(0,0,0,.22)}.sattoo-status-content::-webkit-scrollbar{width:5px}.sattoo-status-content::-webkit-scrollbar-thumb{background:#4d9fc6;border-radius:5px}.sattoo-status-content::-webkit-scrollbar-track{background:rgba(0,0,0,.22)}
