@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;600&display=swap');
*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden}
body{background:#f0ece8;color:#2d2d2d;font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}

/* ======================== DESKTOP ======================== */
#desktop{display:flex;flex-direction:column;height:100vh;width:100vw;background:#f0ece8}
#taskbar{display:flex;justify-content:space-between;align-items:center;padding:0 20px;height:42px;background:#fff;border-bottom:1px solid #ddd8d4;-webkit-app-region:drag;user-select:none;flex-shrink:0}
#taskbar-left{display:flex;align-items:center;gap:18px}
#taskbar-right{display:flex;align-items:center;gap:12px}
#menu-btn{cursor:pointer;font-weight:600;font-size:13px;color:#555;padding:4px 10px;border-radius:4px;-webkit-app-region:no-drag;letter-spacing:0.3px}
#menu-btn:hover{background:#e8e4e0;color:#222}
#term-toggle{cursor:pointer;font-size:12px;color:#888;padding:3px 10px;border-radius:4px;border:1px solid #ddd8d4;-webkit-app-region:no-drag}
#term-toggle:hover{background:#e8e4e0;color:#444}
#clock{font-size:12px;color:#999;font-weight:500}
#desktop-content{flex:1;overflow-y:auto;padding:24px 32px 32px;min-height:0}
#desktop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;max-width:1000px;margin:0 auto}

.desk-card{background:#fff;border-radius:10px;padding:18px 12px 14px;text-align:center;cursor:pointer;border:1px solid #e0dcd8;transition:all 0.15s ease;box-shadow:0 1px 3px rgba(0,0,0,0.04)}
.desk-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,0.08);border-color:#c8c0b8}
.desk-card-icon{font-size:26px;margin-bottom:6px;display:block;color:#666}
.desk-card-title{font-size:12.5px;font-weight:600;color:#444;display:block;line-height:1.3}
.desk-card-desc{font-size:10.5px;color:#999;margin-top:3px;display:block}

/* ======================== TERMINAL ======================== */
#term{display:flex;flex-direction:column;height:100vh;max-width:960px;margin:0 auto;padding:20px 24px 12px;position:relative}
#term-out{flex:1;overflow-y:auto;overflow-x:hidden;white-space:pre-wrap;word-break:break-all;margin:0;padding:8px 0;scroll-behavior:smooth;min-height:0;font-family:'JetBrains Mono','Consolas','Courier New',monospace;font-size:13.5px;line-height:1.55;color:#2d2d2d}
#term-out::-webkit-scrollbar{width:5px}
#term-out::-webkit-scrollbar-track{background:transparent}
#term-out::-webkit-scrollbar-thumb{background:#d0d0d0;border-radius:3px}
#term-out::-webkit-scrollbar-thumb:hover{background:#bbb}

#term-in{display:flex;align-items:center;gap:10px;padding:10px 0 0;margin-top:auto;flex-shrink:0;border-top:1px solid #e8e4e0}
#prompt{color:#a09890;white-space:nowrap;flex-shrink:0;font-weight:600;font-size:13px;font-family:'JetBrains Mono','Consolas',monospace}
#input{flex:1;background:transparent;border:none;color:#2d2d2d;font-family:'JetBrains Mono','Consolas',monospace;font-size:13.5px;outline:none;caret-color:#2d2d2d;padding:3px 0;min-width:0}
#input::selection{background:#d0d8e8;color:#1a1a1a}

.err{color:#c04040}.ok{color:#3a7a3a}.hl{color:#5060b0}.dim{color:#9a9a9a}.warn{color:#b08030}.em{color:#1a1a1a;font-weight:600}.head{color:#6a6a6a;font-weight:600;border-bottom:1px solid #e0dcd8;display:block;margin-bottom:4px;padding-bottom:2px}
table{border-collapse:collapse;margin:2px 0;font-family:'JetBrains Mono',monospace;font-size:13px}
td,th{padding:1px 14px 1px 4px;text-align:left;white-space:nowrap}
th{color:#6a6a6a;font-weight:600;border-bottom:1px solid #ddd}

/* ======================== MODAL ======================== */
#modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.35);z-index:1000;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
#modal-container{background:#fff;border-radius:14px;width:92%;max-width:700px;max-height:88vh;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,0.18);display:flex;flex-direction:column;animation:modalIn 0.2s ease}
@keyframes modalIn{from{opacity:0;transform:scale(0.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}
#modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 22px;border-bottom:1px solid #ece8e4;flex-shrink:0}
#modal-title{font-weight:700;font-size:16px;color:#333}
#modal-close{cursor:pointer;font-size:24px;color:#aaa;line-height:1;padding:0 4px;transition:color 0.1s}
#modal-close:hover{color:#555}
#modal-body{overflow-y:auto;padding:20px 22px 22px;min-height:100px}

/* ======================== APP WIDGETS ======================== */
.widget h3{font-size:14px;font-weight:600;color:#444;margin:14px 0 6px}
.widget label{font-size:12px;color:#777;display:block;margin:6px 0 2px}
.widget input,.widget select{width:100%;padding:7px 10px;border:1px solid #ddd8d4;border-radius:6px;font-size:13px;font-family:'Inter',sans-serif;outline:none;transition:border 0.15s;background:#faf8f6;margin-bottom:6px}
.widget input:focus,.widget select:focus{border-color:#888}
.widget .btn-row{display:flex;gap:8px;margin:10px 0 4px;flex-wrap:wrap}
.widget button{padding:7px 18px;border:none;border-radius:6px;font-size:12.5px;font-weight:500;cursor:pointer;background:#f0ece8;color:#444;transition:all 0.12s;font-family:'Inter',sans-serif}
.widget button:hover{background:#ddd8d4;color:#222}
.widget button.primary{background:#4a6fa5;color:#fff}
.widget button.primary:hover{background:#3d5f8f}
.widget button.secondary{background:#6a8a6a;color:#fff}
.widget button.secondary:hover{background:#5a7a5a}
.widget button.accent{background:#a56a4a;color:#fff}
.widget button.accent:hover{background:#8f5a3d}
.widget button.danger{background:#c05050;color:#fff}
.widget button.danger:hover{background:#a04040}
.widget .result-box{background:#f6f4f0;border:1px solid #e8e4e0;border-radius:8px;padding:12px 14px;margin:10px 0;font-family:'JetBrains Mono',monospace;font-size:13px;line-height:1.5;white-space:pre-wrap;color:#333}
.widget .result-box .r{color:#3a7a3a;font-weight:600}
.widget .result-box .d{color:#888;font-size:11.5px}
.widget .result-box .h{color:#5060b0;font-weight:600}
.widget .inline-group{display:flex;gap:8px;align-items:center}
.widget .inline-group input{flex:1}
.widget .inline-group label{flex-shrink:0;margin:0}
.widget .matrix-input{font-family:'JetBrains Mono',monospace;font-size:12px}
.widget .two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.widget .three-col{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.widget .section-divider{height:1px;background:#e8e4e0;margin:14px 0}
.widget .note{font-size:11px;color:#999;margin:2px 0}
.widget .big-result{font-size:22px;font-weight:700;color:#3a7a3a;text-align:center;padding:8px 0}
.widget .hist-bar{display:flex;align-items:center;gap:6px;margin:2px 0}
.widget .hist-bar .bar{height:14px;background:#4a6fa5;border-radius:3px;min-width:2px;transition:width 0.3s}
.widget .hist-bar .label{font-size:11px;color:#666;min-width:30px;text-align:right;font-family:'JetBrains Mono',monospace}
.widget .hist-bar .count{font-size:11px;color:#888;font-family:'JetBrains Mono',monospace}
.widget .badge{display:inline-block;padding:1px 8px;border-radius:10px;font-size:10.5px;font-weight:600;margin:0 3px}
.widget .badge.blue{background:#e0e8f4;color:#4a6fa5}
.widget .badge.green{background:#dce8dc;color:#4a7a4a}
.widget .badge.orange{background:#f0e0d0;color:#a07040}
.widget .app-section{margin:6px 0}
.widget .data-list{max-height:140px;overflow-y:auto;font-family:'JetBrains Mono',monospace;font-size:11.5px;color:#666;background:#faf8f6;border:1px solid #ece8e4;border-radius:6px;padding:6px 10px}
.widget .formula-display{text-align:center;font-size:16px;padding:12px 10px;color:#555;font-family:'JetBrains Mono',monospace;background:#faf8f6;border-radius:8px;margin:8px 0;border:1px solid #ece8e4;line-height:1.65}
.widget .data-list::-webkit-scrollbar{width:4px}
.widget .data-list::-webkit-scrollbar-thumb{background:#d0d0d0;border-radius:2px}
#modal-body::-webkit-scrollbar{width:5px}
#modal-body::-webkit-scrollbar-thumb{background:#d0d0d0;border-radius:3px}
.desk-card-icon{filter:grayscale(0.2)}
.desk-card:hover .desk-card-icon{filter:grayscale(0)}
@media(max-width:600px){#desktop-content{padding:16px}#desktop-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}.desk-card{padding:14px 8px 10px}#modal-container{width:96%;max-height:92vh}.widget .two-col,.widget .three-col{grid-template-columns:1fr}#term{padding:12px 14px}body{font-size:14px}#term-out,#input{font-size:12.5px}}
@media(max-width:500px){canvas{max-width:100%;height:auto}#desktop-content{padding:12px}}