:root {
  --bg:#fafafa;
  --text:#111;
  --accent:#4f46e5;
  --radius:14px;
  --shadow:0 4px 10px rgba(0,0,0,0.1);
}

*{box-sizing:border-box;}
body{margin:0;font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);display:flex;flex-direction:column;min-height:100vh;}
header{text-align:center;padding:16px;font-size:1.4rem;font-weight:600;background:linear-gradient(90deg,#ff0099,#4f46e5,#00f2ea);color:#fff;box-shadow:var(--shadow);transition:0.5s;}
main{flex:1;max-width:500px;margin:0 auto;padding:16px;}
h2{margin-top:0;font-size:1.2rem;font-weight:600;}
input[type="text"], input[type="file"]{width:100%;padding:12px;border-radius:var(--radius);border:1px solid #ccc;margin-bottom:10px;}
button{border:none;background:var(--accent);color:#fff;padding:10px 16px;border-radius:var(--radius);cursor:pointer;font-weight:600;transition:0.3s;}
button:hover{transform:scale(1.03);}
.bookmark{padding:12px;margin-top:10px;border-radius:var(--radius);color:#fff;font-weight:600;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow);animation:fadeIn 0.3s ease;transition:0.5s;}
.bookmark span{flex:1;}
@keyframes fadeIn{from{opacity:0;transform:translateY(5px);}to{opacity:1;transform:translateY(0);}}
nav{display:flex;justify-content:space-around;background:#fff;border-top:1px solid #ddd;box-shadow:0 -2px 6px rgba(0,0,0,0.05);position:sticky;bottom:0;padding:10px 0;}
nav button{background:none;color:#777;font-size:1.4rem;}
nav button.active{color:var(--accent);}
section{display:none;}
section.active{display:block;transition:0.3s;}

/* THEMES */
body.theme-social{--accent:#ff0099;background:#fff;}
body.theme-clean{--accent:#4f46e5;background:#f5f5f5;}
body.theme-dark{--accent:#00f2ea;background:#111;color:#eee;}
header.theme-social{background:linear-gradient(90deg,#ff0099,#ff9900);}
header.theme-clean{background:linear-gradient(90deg,#ffffff,#42b0ff);}
header.theme-dark{background:linear-gradient(90deg,#000,#0ff);}