:root{--red:#FF3131;--white:#ffffff;--ink:#050505;--blue:#004CFF;--mut:#6b6b6b;--line:#e6e6e6;}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Syne',system-ui,-apple-system,sans-serif;background:var(--white);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.5;}
.wordmark{font-weight:800;letter-spacing:.18em;background:linear-gradient(90deg,#E40303,#FF8C00,#FFED00,#008026,#004CFF,#732982);-webkit-background-clip:text;background-clip:text;color:transparent;}
button{font-family:inherit;cursor:pointer;border:0;}
input{font-family:inherit;}

/* splash/login */
.splash{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;}
.card{width:100%;max-width:380px;text-align:center;}
.card .wordmark{font-size:46px;display:block;margin-bottom:6px;}
.tag{color:var(--mut);font-size:13px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:30px;}
.tabs{display:flex;gap:0;margin-bottom:20px;border:1px solid var(--line);border-radius:10px;overflow:hidden;}
.tabs button{flex:1;padding:11px;background:var(--white);color:var(--mut);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;}
.tabs button.on{background:var(--ink);color:var(--white);}
form{display:flex;flex-direction:column;gap:12px;}
input{padding:13px 15px;border:1px solid var(--line);border-radius:10px;font-size:15px;}
input:focus{outline:0;border-color:var(--blue);}
.primary{background:var(--red);color:#fff;padding:14px;border-radius:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:14px;}
.primary:active{transform:translateY(1px);}
.msg{min-height:18px;font-size:13px;color:var(--red);margin-top:4px;}
.divider{display:flex;align-items:center;gap:12px;color:var(--mut);font-size:11px;letter-spacing:.2em;margin:24px 0 16px;}
.divider::before,.divider::after{content:'';flex:1;height:1px;background:var(--line);}
.social{display:flex;flex-direction:column;gap:10px;}
.social button{padding:13px;border-radius:10px;font-weight:600;font-size:13px;letter-spacing:.05em;border:1px solid var(--line);background:#f6f6f6;color:var(--mut);display:flex;align-items:center;justify-content:center;gap:8px;cursor:not-allowed;}
.social .soon{font-size:10px;letter-spacing:.15em;text-transform:uppercase;background:var(--ink);color:#fff;padding:2px 7px;border-radius:20px;}

/* wall */
.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:var(--white);border-bottom:1px solid var(--line);}
.top .wordmark{font-size:22px;}
.top .out{background:none;color:var(--mut);font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;}
.wrap{max-width:600px;margin:0 auto;padding:20px;}
.compose{display:none;flex-direction:column;gap:10px;border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:22px;}
.compose textarea{font-family:inherit;border:1px solid var(--line);border-radius:10px;padding:12px;font-size:15px;resize:vertical;min-height:70px;}
.compose textarea:focus{outline:0;border-color:var(--blue);}
.compose button{align-self:flex-end;background:var(--ink);color:#fff;padding:10px 20px;border-radius:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:12px;}
.post{border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:16px;}
.post .who{font-weight:700;font-size:14px;}
.post .who small{color:var(--mut);font-weight:500;margin-left:6px;}
.post .when{color:var(--mut);font-size:11px;letter-spacing:.05em;margin-top:2px;}
.post .body{margin:12px 0 16px;font-size:15px;white-space:pre-wrap;}
.actions{display:flex;gap:10px;}
.actions button{padding:9px 16px;border-radius:9px;font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;}
.like{background:#fff;border:1px solid var(--line);color:var(--ink);}
.like.on{border-color:var(--red);color:var(--red);}
.share{background:var(--red);color:#fff;}
.empty{text-align:center;color:var(--mut);padding:60px 0;font-size:14px;}
.menu{position:fixed;inset:0;background:rgba(5,5,5,.55);display:none;align-items:flex-end;justify-content:center;z-index:50;}
.menu.on{display:flex;}
.sheet{background:#fff;width:100%;max-width:420px;border-radius:18px 18px 0 0;padding:14px;}
.sheet h4{text-align:center;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);padding:10px 0 14px;}
.sheet a,.sheet button{display:block;width:100%;text-align:center;padding:14px;border-radius:10px;margin-bottom:8px;font-weight:600;font-size:14px;text-decoration:none;color:var(--ink);background:#f6f6f6;border:0;}
.sheet .fb{color:var(--blue);} .sheet .cancel{color:var(--red);}