:root{--bg:#f5ebeb;--panel:#fff;--accent:#e4c4c4;--accent-dark:#d2b0b0;--text:#333;--muted:#666}body{font-family:Helvetica,Arial,sans-serif;background:var(--bg);margin:0;color:var(--text)}.app-container{max-width:1400px;margin:20px auto;padding:20px}.evaluacion-container{display:flex;flex-direction:column;min-height:100vh}.evaluacion-main{flex:1;padding:20px}.evaluacion-layout{min-height:calc(100vh - 80px);display:flex;gap:20px;align-items:stretch;padding:20px;box-sizing:border-box;-webkit-user-select:none;user-select:none;flex-wrap:nowrap;width:100%}.evaluacion-layout .columna{flex:1 1 0;min-width:0;display:flex;flex-direction:column;height:330px;overflow:hidden}.panel-plegable{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--panel);border-radius:18px;box-shadow:0 10px 28px #0000001a;border:1px solid rgba(228,196,196,.55);min-height:0}.panel-header{background:linear-gradient(180deg,var(--accent),#efd8d8);padding:12px 16px;font-weight:700;border-radius:18px 18px 0 0}.panel-body{flex:1;overflow-y:auto;overflow-x:hidden;padding:14px 16px;display:flex;flex-direction:column;min-height:0}.principal{flex:2 1 0;background:var(--panel);border-radius:22px;padding:26px;box-shadow:0 10px 28px #0000001a;border:1px solid rgba(228,196,196,.55);display:flex;flex-direction:column;gap:14px}.respuesta-btn{background:#fff;border:2px solid var(--accent);padding:12px;border-radius:14px;font-weight:600;transition:.2s}.respuesta-btn:hover{transform:translateY(-2px);background:#fff8f8}.resizer{width:100%;height:6px;cursor:row-resize}@media (max-width:700px){.resizer{display:none}}@media (max-width:900px) and (orientation:portrait){.evaluacion-layout{flex-direction:column;height:auto}.evaluacion-layout .columna.contexto{order:1}.evaluacion-layout .columna.historial{order:2}.evaluacion-layout .principal{order:3}.evaluacion-layout .columna,.evaluacion-layout .principal{width:100%;height:auto}}@media (max-width:900px) and (orientation:landscape){.evaluacion-layout{flex-direction:row;height:calc(100vh - 80px)}.evaluacion-layout .columna,.evaluacion-layout .principal{height:100%}}.evaluacion-layout .columna.contexto,.evaluacion-layout .columna.historial{min-width:260px}.evaluacion-layout .columna.historial .panel-body{display:block;overflow-y:auto}
