:root{--ink: #21403A;--ink-soft: #4A6560;--paper: #FFFDF8;--marigold: #F4A93C;--marigold-deep: #E08F14;--seafoam: #DCEFE7;--seafoam-mid: #A8D5C6;--sky: #DCEBF3;--berry: #D95970;--tint-marigold: #FDEBCB;--tint-berry: #F8DCE1;--tint-seafoam: #D8EEE4;--line: #E7E2D6;--shadow: 0 10px 30px rgba(33, 64, 58, .1);--display: "Fredoka", system-ui, sans-serif;--body: "Karla", system-ui, sans-serif}*{box-sizing:border-box}body{margin:0;font-family:var(--body);color:var(--ink);background:var(--paper);font-size:15px;line-height:1.45}h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.15}:focus-visible{outline:3px solid var(--marigold-deep);outline-offset:2px;border-radius:6px}button{font:inherit;cursor:pointer}input,select,textarea{font:inherit}.top{display:flex;align-items:center;gap:1rem;padding:.7rem 1.2rem;background:var(--ink);color:#fff;position:sticky;top:0;z-index:10}.top .brand{font-family:var(--display);font-weight:600;display:flex;align-items:center;gap:.5em}.top .brand .dot{width:11px;height:11px;border-radius:50%;background:var(--marigold)}.top nav{display:flex;gap:.25rem;flex:1;flex-wrap:wrap}.top nav button{background:none;border:0;color:#cfe0da;padding:.45em .9em;border-radius:999px;font-weight:700;font-size:.88rem;position:relative}.top nav button[aria-current=true]{background:var(--marigold);color:var(--ink)}.top .badge{position:absolute;top:-4px;right:-2px;background:var(--berry);color:#fff;border-radius:999px;font-size:.66rem;min-width:16px;height:16px;display:grid;place-items:center;padding:0 4px}.top .who{font-size:.8rem;color:#cfe0da}.wrap{max-width:1080px;margin:0 auto;padding:1.4rem 1.2rem 4rem}.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:1.1rem 1.2rem;margin:.8rem 0;box-shadow:0 4px 14px #21403a0d}.row{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap}.grow{flex:1}.btn{border-radius:999px;padding:.55em 1.3em;font-weight:700;border:2px solid transparent;font-family:var(--display);font-weight:500}.btn-primary{background:var(--marigold);color:var(--ink);border:0}.btn-primary:hover{background:var(--marigold-deep);color:#fff}.btn-primary:disabled{opacity:.5;cursor:default}.btn-ghost{background:none;border-color:var(--ink);color:var(--ink)}.btn-ghost:hover{background:var(--ink);color:#fff}.btn-danger{background:none;border-color:var(--berry);color:var(--berry)}.btn-danger:hover{background:var(--berry);color:#fff}.btn-sm{padding:.3em .9em;font-size:.85rem}.field{display:block;margin:.6rem 0}.field span{display:block;font-weight:700;font-size:.85rem;margin-bottom:.25rem}.field input,.field select,.field textarea{width:100%;padding:.6em .9em;border-radius:12px;border:2px solid var(--ink);background:#fff}.chip{display:inline-flex;align-items:center;gap:.4em;background:var(--seafoam);border-radius:999px;padding:.25em .8em;font-size:.8rem;font-weight:700}.chip.warn{background:var(--tint-berry)}.chip.gold{background:var(--tint-marigold)}table{width:100%;border-collapse:collapse;font-size:.92rem}th{text-align:left;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);padding:.5rem .6rem;border-bottom:2px solid var(--line)}td{padding:.55rem .6rem;border-bottom:1px solid var(--line);vertical-align:top}.emoji-row{display:flex;gap:.35rem;flex-wrap:wrap;margin:.5rem 0}.emoji-row button{font-size:1.4rem;background:#fff;border:2px solid var(--line);border-radius:12px;width:48px;height:48px}.emoji-row button[aria-pressed=true]{border-color:var(--marigold-deep);background:var(--tint-marigold)}.ok{background:var(--tint-seafoam);border-radius:12px;padding:.6rem .9rem;margin:.6rem 0}.err{background:var(--tint-berry);border-radius:12px;padding:.6rem .9rem;margin:.6rem 0}.note{background:var(--sky);border-radius:12px;padding:.6rem .9rem;margin:.6rem 0;font-size:.88rem}.msg-list{display:flex;flex-direction:column;gap:.45rem;max-height:50vh;overflow-y:auto;padding:.4rem 0}.bubble{max-width:75%;padding:.55em .9em;border-radius:14px;font-size:.93rem}.bubble.staff{align-self:flex-end;background:var(--tint-marigold)}.bubble.guardian{align-self:flex-start;background:var(--sky)}.bubble.system{align-self:center;background:var(--seafoam);font-size:.82rem}.bubble .who{display:block;font-size:.72rem;font-weight:700;color:var(--ink-soft)}.ss{position:relative;width:100%}.ss-input{width:100%;padding:.6em .9em;border-radius:12px;border:2px solid var(--ink);background:#fff;font-size:16px}.ss-clear{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);border:0;background:none;font-size:1.3rem;line-height:1;color:var(--ink-soft);width:32px;height:32px;border-radius:8px}.ss-list{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 4px);margin:0;padding:.25rem;list-style:none;background:#fff;border:2px solid var(--ink);border-radius:12px;box-shadow:var(--shadow);max-height:46vh;overflow-y:auto;-webkit-overflow-scrolling:touch}.ss-option{padding:.6em .7em;border-radius:8px;min-height:44px;display:flex;align-items:center;font-size:15px;cursor:pointer}.ss-option.active{background:var(--tint-marigold)}.ss-option.selected{font-weight:700}.ss-option.active.selected{background:var(--marigold)}.ss-empty{padding:.6em .7em;color:var(--ink-soft);font-size:14px}.split{display:flex;gap:.8rem;align-items:flex-start}.split>.side{flex:0 0 260px}.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.center{text-align:center;padding:4rem 1rem}.spinner{margin:3rem auto;width:38px;height:38px;border-radius:50%;border:4px solid var(--seafoam);border-top-color:var(--marigold);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:1.6s}}@media(max-width:640px){.wrap{padding:1rem .8rem 4rem}input,select,textarea,.field input,.field select,.field textarea{font-size:16px}.btn,.btn-sm,.top nav button,.emoji-row button{min-height:44px}.btn,.btn-sm{display:inline-flex;align-items:center;justify-content:center}.btn-sm{padding:.5em 1em;font-size:.92rem}.top{gap:.5rem;padding:.6rem .8rem;flex-wrap:wrap}.top .brand{flex:1}.top nav{order:3;flex-basis:100%;gap:.35rem}.top nav button{font-size:.8rem;padding:.45em .7em}.top .who{display:none}.split{flex-direction:column}.split>.side{flex:1 1 auto;width:100%}.table-scroll table{min-width:460px}.bubble{max-width:92%}input[type=checkbox]{width:20px;height:20px}}
