body{background:#e2e8f0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;display:flex;justify-content:center;min-height:100vh;margin:0}
.layout{display:flex;max-width:1320px;width:100%;min-height:100vh;background:#f1f5f9}
.col-left{width:260px;flex-shrink:0;background:linear-gradient(180deg,#0a1229,#172554 50%,#1e3a8a);padding:20px 16px;display:flex;flex-direction:column}
.col-mid{flex:1;min-width:0;padding:24px}
.col-right{width:280px;flex-shrink:0;background:#fff;border-left:1px solid #e2e8f0;padding:20px 16px}
@media(max-width:1200px){.col-right{display:none}}
@media(max-width:768px){.layout{flex-direction:column}.col-left{width:100%}.col-mid{padding:16px}}
.card{border-radius:18px;padding:20px;margin-bottom:20px;border:1px solid rgba(255,255,255,0.5);transition:transform 0.15s,box-shadow 0.2s}
.card:hover{transform:translateY(-2px)}
.card-green{background:linear-gradient(135deg,#ecfdf5,#d1fae5,#a7f3d0);border-color:#6ee7b7;box-shadow:0 8px 24px -6px rgba(5,150,101,0.15)}
.card-amber{background:linear-gradient(135deg,#fffbeb,#fef3c7,#fde68a);border-color:#fcd34d;box-shadow:0 8px 24px -6px rgba(217,119,6,0.12)}
.card-purple{background:linear-gradient(135deg,#f5f3ff,#ede9fe,#ddd6fe);border-color:#c4b5fd;box-shadow:0 8px 24px -6px rgba(139,92,246,0.12)}
.card-teal{background:linear-gradient(135deg,#f0fdfa,#ccfbf1,#99f6e4);border-color:#5eead4;box-shadow:0 8px 24px -6px rgba(20,184,166,0.12)}
.card-slate{background:linear-gradient(135deg,#f8fafc,#f1f5f9,#e2e8f0);border-color:#cbd5e1;box-shadow:0 8px 24px -6px rgba(100,116,139,0.10)}
.card-blue{background:linear-gradient(135deg,#f0f5ff,#dbeafe,#bfdbfe);border-color:#93c5fd;box-shadow:0 8px 24px -6px rgba(30,64,175,0.15)}
.card-rose{background:linear-gradient(135deg,#fff1f2,#ffe4e6,#fecdd3);border-color:#fda4af;box-shadow:0 8px 24px -6px rgba(225,29,72,0.10)}
.section-header{cursor:pointer;user-select:none}
.section-header h2{pointer-events:none}
.fg{display:grid;grid-template-columns:repeat(3,170px);gap:12px}
.fg .w2{grid-column:span 2}
.field-3d{width:100%;border-radius:10px;border:1.5px solid rgba(0,0,0,0.08);padding:10px 14px;font-size:1rem;font-weight:600;color:#0f172a;background:rgba(255,255,255,0.85);box-shadow:inset 0 2px 4px rgba(0,0,0,0.03);transition:all 0.2s}
.field-3d:focus{outline:none;border-color:#ea580c;box-shadow:0 0 0 3px rgba(234,88,12,0.12);background:#fff}
.field-desc{font-size:0.7rem;color:#475569;margin-top:1px;line-height:1.2;white-space:nowrap}
.field-label{font-size:0.75rem;font-weight:600;color:#374151;display:block;margin-bottom:2px;white-space:nowrap}
.sc-btn{padding:8px 0;border-radius:8px;border:1px solid rgba(255,255,255,0.12);background:rgba(255,255,255,0.06);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;text-align:center;transition:background 0.15s}
.sc-btn:hover{background:rgba(255,255,255,0.18)}
.sc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.sc-op{background:rgba(255,255,255,0.15)}.sc-eq{background:rgba(5,150,101,0.4)}.sc-c{background:rgba(225,29,72,0.3)}
.sc-display{background:rgba(255,255,255,0.06);border-radius:8px;padding:6px 10px;min-height:3.2rem;font-family:'Courier New',monospace}
.sc-formula{font-size:0.65rem;color:rgba(255,255,255,0.5);text-align:right;min-height:1rem;word-break:break-all}
.sc-result{font-size:1.3rem;font-weight:700;color:#fff;text-align:right}