*{box-sizing:border-box;font-family:Inter, Roboto, Arial, sans-serif}
body{display:flex;align-items:center;justify-content:center;height:100vh;margin:0;background:linear-gradient(180deg,#eef2f7,#dbe7f5)}
.calculator{width:360px;background:#fff;border-radius:12px;box-shadow:0 6px 24px rgba(24,39,75,0.12);padding:12px}
.calculator header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.display-area{margin-bottom:8px}
.display{width:100%;height:56px;font-size:20px;padding:8px;border-radius:8px;border:1px solid #e6e9ef}
.history{height:60px;overflow:auto;font-size:12px;color:#4b5563;margin-bottom:6px}
.mode-selector{display:flex;gap:10px;margin-top:6px;font-size:12px;justify-content:flex-end}
.buttons{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.buttons button{height:40px;border-radius:8px;border:0;background:#f3f6fb;color:#0b1220;font-weight:600;font-size:12px;cursor:pointer}
.buttons button.equals{background:#0b79ff;color:#fff}
.buttons button[data-action="clear"]{background:#ff6666;color:#fff}
.theme-label{font-size:14px}
footer{margin-top:8px;text-align:center;color:#6b7280}

/* Dark theme */
body.dark-theme{background:linear-gradient(180deg,#2f3438,#1f2224);color:#e6eef8}
.dark-theme .calculator{background:#2b2f33;color:#e6eef8;box-shadow:0 8px 32px rgba(2,6,23,0.45);border:1px solid #4b5563}
.dark-theme .display{background:#1f2224;border:1px solid #4b5563;color:#e6eef8}
.dark-theme .buttons button{background:#374151;color:#e6eef8}
.dark-theme .buttons button.equals{background:#6b7280}
.dark-theme .buttons button[data-action="clear"]{background:#ff6666}

button:focus{outline:3px solid #bde0ff}

/* Responsive: Mobile Landscape */
@media(orientation:landscape) and (max-height:600px){
  body{height:auto;min-height:100vh}
  .calculator{width:95vw;max-width:800px;padding:8px}
  .buttons{gap:4px}
  .buttons button{height:36px;font-size:11px}
  .display{height:48px;font-size:16px;padding:6px}
  .history{height:40px}
}

/* Desktop */
@media(min-width:900px){
  .calculator{width:600px;padding:16px}
  .buttons{gap:10px}
  .buttons button{height:50px;font-size:15px}
  .display{height:68px;font-size:22px;padding:10px}
}