:root{--bg:#f5f7fb;--surface:#fff;--ink:#172234;--muted:#7a8798;--line:#e6eaf0;--blue:#2864e8;--blue-dark:#1e4fc0;--blue-soft:#eaf0ff;--green:#0b9b6a;--green-soft:#e7f8f0;--purple:#8357d9;--purple-soft:#f1ebff;--amber:#be7b20;--amber-soft:#fff3df;--shadow:0 12px 36px rgba(32,48,75,.06);--radius:16px}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;color:var(--ink);font:14px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer;border:0}button:disabled{opacity:.6;cursor:wait}.layout{display:flex;min-height:100vh}.side{width:248px;background:#142337;color:#dce7f5;padding:28px 17px 20px;display:flex;flex-direction:column;flex-shrink:0}.brand{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:750;margin:0 14px 3px;letter-spacing:-.03em}.brand-icon{color:#78a7ff;font-size:19px}.brand-sub{font-size:12px;color:#8fa1b9;margin:0 14px 34px}.nav{display:grid;gap:5px}.nav button{display:flex;align-items:center;gap:12px;background:transparent;color:#aebdd0;text-align:left;padding:12px 14px;border-radius:11px;transition:.18s}.nav button span{width:18px;text-align:center;font-size:17px}.nav button.active,.nav button:hover{background:#263c59;color:#fff}.nav-divider{height:1px;background:#2b405b;margin:18px 12px 10px}.side-footer{margin-top:auto;color:#9bb0c9;font-size:12px;padding:18px 14px 3px;line-height:2}.side-footer small{color:#7186a1}.online-dot,.sync-dot{display:inline-block;width:7px;height:7px;background:#3fd19a;border-radius:50%;margin-right:6px;box-shadow:0 0 0 3px rgba(63,209,154,.12)}.main{flex:1;padding:38px 46px 60px;max-width:1450px;min-width:0}.top{display:flex;justify-content:space-between;align-items:flex-start;gap:28px;margin-bottom:27px}.eyebrow{color:var(--blue);font-size:11px;font-weight:800;letter-spacing:.12em}.top h1{font-size:31px;line-height:1.25;margin:6px 0 5px;letter-spacing:-.045em}.top p{color:var(--muted);margin:0}.sync-status{font-size:11px;color:#9aa6b5;margin-top:12px}.actions{display:flex;gap:9px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:10px 15px;border-radius:10px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font-weight:650;transition:.18s;white-space:nowrap}.btn:hover{border-color:#c6d0df;transform:translateY(-1px)}.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 5px 13px rgba(40,100,232,.2)}.btn.primary:hover{background:var(--blue-dark);border-color:var(--blue-dark)}.btn.danger{color:#c43f42}.small-btn{padding:7px 11px;font-size:12px}.refresh-btn{color:#52657b}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:25px}.stat{display:flex;align-items:center;gap:13px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:17px 18px;box-shadow:var(--shadow)}.stat-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;font-size:18px}.stat-blue .stat-icon{color:var(--blue);background:var(--blue-soft)}.stat-green .stat-icon{color:var(--green);background:var(--green-soft)}.stat-purple .stat-icon{color:var(--purple);background:var(--purple-soft)}.stat-amber .stat-icon{color:var(--amber);background:var(--amber-soft)}.stat-label{font-size:12px;color:var(--muted)}.stat-value{font-size:25px;line-height:1.2;font-weight:750;margin-top:2px}.toolbar{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:17px}.search-wrap{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:0 12px;flex:1;min-width:220px}.search-wrap>span{font-size:22px;color:#8a98a9;line-height:1}.search{width:100%;padding:10px 0;border:0;outline:0;background:transparent}.select,.date{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 11px;color:var(--ink);outline:0}.date-range{display:flex;align-items:center;gap:6px;color:#a4afbd}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.experiment-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:19px 20px 17px;box-shadow:var(--shadow);min-height:194px;display:flex;flex-direction:column;transition:.2s}.experiment-card:hover{transform:translateY(-2px);border-color:#cfdbef;box-shadow:0 16px 35px rgba(32,48,75,.1)}.card-top{display:flex;justify-content:space-between;align-items:center;gap:12px}.type{font-size:11px;font-weight:750;color:var(--blue);background:var(--blue-soft);padding:4px 9px;border-radius:99px}.type.obs{color:var(--purple);background:var(--purple-soft)}.status{font-size:11px;padding:4px 9px;border-radius:99px;white-space:nowrap}.status.todo{color:#667588;background:#f1f4f7}.status.active{color:var(--green);background:var(--green-soft)}.status.done,.status.ended{color:var(--purple);background:var(--purple-soft)}.experiment-card h3{margin:14px 0 5px;font-size:18px;line-height:1.35;letter-spacing:-.02em}.excerpt{color:#596a7e;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:18px}.meta{font-size:12px;color:#91a0b1}.card-open,.link{color:var(--blue);background:none;padding:0;font-weight:650}.card-open span{margin-left:3px}.empty{grid-column:1/-1;text-align:center;padding:72px 20px;border:1px dashed #d5dce7;border-radius:var(--radius);color:var(--muted)}.empty-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--blue-soft);color:var(--blue);margin:0 auto 12px;font-size:21px}.empty strong{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}.empty-action{margin-top:18px}.overlay{position:fixed;inset:0;background:rgba(10,20,34,.54);display:flex;align-items:center;justify-content:center;padding:20px;z-index:5;backdrop-filter:blur(3px)}.modal{background:var(--surface);border-radius:20px;width:min(780px,100%);max-height:92vh;overflow:auto;padding:26px;box-shadow:0 25px 75px rgba(10,20,35,.25)}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:23px}.modal-kicker{font-size:10px;letter-spacing:.13em;font-weight:800;color:var(--blue)}.modal h2{margin:4px 0 0;font-size:24px;letter-spacing:-.03em}.icon-btn{width:30px;height:30px;border-radius:9px;background:#f2f5f8;color:#7b8795;font-size:21px;line-height:1}.icon-btn:hover{background:#e8edf3;color:var(--ink)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field{display:grid;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:12px;font-weight:750;color:#526276}.field label small{font-weight:400;color:#9aa6b5;margin-left:5px}.field input,.field textarea,.field select{width:100%;border:1px solid var(--line);border-radius:10px;padding:10px 11px;outline:0;background:#fbfcfe;color:var(--ink)}.field textarea{min-height:92px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:#8eaff7;box-shadow:0 0 0 3px #eaf0ff;background:#fff}.records-section{border-top:1px solid var(--line);margin-top:23px;padding-top:19px}.section-title{display:flex;justify-content:space-between;align-items:center;gap:12px}.section-title strong{display:block}.section-title small{display:block;color:var(--muted);font-size:12px}.record{display:flex;gap:13px;align-items:flex-start;border-top:1px solid var(--line);padding:13px 0}.record:first-child{margin-top:12px}.record-date{font-weight:700;min-width:95px;color:#526276}.record-text{flex:1;white-space:pre-line;color:#596a7e}.record-delete{flex-shrink:0;width:25px;height:25px;font-size:17px}.record-empty{padding:13px 0;margin:0}.modal-actions{display:flex;justify-content:space-between;gap:10px;margin-top:26px;padding-top:18px;border-top:1px solid var(--line)}.right-actions{display:flex;gap:9px}.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 10% 0,#e6eeff 0,transparent 40%),radial-gradient(circle at 100% 90%,#e7f7f2 0,transparent 35%),var(--bg)}.login-box{width:min(430px,100%);background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:36px;box-shadow:0 20px 60px rgba(32,48,75,.1)}.login-mark{color:var(--blue);font-size:28px;margin-bottom:11px}.login-box h1{margin:6px 0 4px;font-size:28px;letter-spacing:-.04em}.login-box p{color:var(--muted);margin:0 0 25px}.login-label{display:block;font-size:12px;font-weight:700;color:#526276;margin-bottom:7px}.login-box input{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;outline:0}.login-box input:focus{border-color:#8eaff7;box-shadow:0 0 0 3px #eaf0ff}.login-button{width:100%;margin-top:9px;padding:12px}.login-button span{margin-left:auto}.error{color:#c43f42;font-size:13px;min-height:20px;padding-top:7px}.toast{position:fixed;right:24px;bottom:24px;background:#172638;color:#fff;padding:12px 17px;border-radius:11px;z-index:10;box-shadow:0 8px 25px rgba(0,0,0,.15)}.mobile-nav{display:none}
@media(max-width:900px){.side{width:216px}.main{padding:30px 25px}.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){body{padding-bottom:72px}.side{display:none}.main{padding:23px 15px 35px}.top{display:block;margin-bottom:22px}.top h1{font-size:25px}.actions{margin-top:17px;display:grid;grid-template-columns:1fr 1fr}.actions .btn{width:100%}.stats{gap:9px;margin-bottom:19px}.stat{padding:13px 12px;gap:9px}.stat-icon{width:30px;height:30px;font-size:15px}.stat-value{font-size:22px}.toolbar{gap:8px}.search-wrap{min-width:100%;order:0}.select{flex:1}.date-range{width:100%;justify-content:space-between}.date{flex:1;min-width:0}.refresh-btn{padding:9px 11px}.refresh-btn span{display:none}.grid{grid-template-columns:1fr;gap:11px}.experiment-card{min-height:175px;padding:17px}.modal{padding:21px 17px;border-radius:17px}.form-grid{grid-template-columns:1fr;gap:13px}.field.full{grid-column:auto}.modal h2{font-size:21px}.modal-actions{align-items:flex-start}.right-actions{gap:6px}.record{gap:8px}.record-date{min-width:78px;font-size:12px}.mobile-nav{position:fixed;display:flex;z-index:4;bottom:0;left:0;right:0;height:66px;background:rgba(255,255,255,.96);border-top:1px solid var(--line);justify-content:space-around;backdrop-filter:blur(10px);padding:5px 3px}.mobile-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:none;color:#8794a4;font-size:10px;min-width:60px}.mobile-nav button span{font-size:20px;line-height:1.1}.mobile-nav button.active{color:var(--blue);font-weight:700}.login-box{padding:29px 23px}.toast{right:15px;bottom:82px}}