*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f5f5f7;color:#1d1d1f}a{color:inherit;text-decoration:none}.app{min-height:100vh}.header{padding:20px 40px;font-size:20px;font-weight:700}.main{padding:0 0 80px}.hero{text-align:center;padding:60px 0 40px}.hero h1{font-size:48px;font-weight:700;background:linear-gradient(135deg,#1d1d1f,#6e6e73);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero p{color:#6e6e73;font-size:18px;margin-top:8px}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(200px,auto);gap:16px;max-width:1200px;margin:0 auto;padding:0 20px}.project-card{display:flex;flex-direction:column;justify-content:flex-end;padding:28px;background:#fff;border-radius:20px;transition:transform .2s;cursor:pointer}.project-card:first-child{grid-column:span 2;grid-row:span 2;background:linear-gradient(135deg,#fbfbfd,#f0f0f3)}.project-card:hover{transform:scale(1.02)}.project-card .category{font-size:12px;color:#86868b;font-weight:500}.project-card h3{margin:6px 0;font-size:20px;font-weight:600}.project-card:first-child h3{font-size:28px}.project-card p{color:#6e6e73;font-size:14px;line-height:1.5}.project-card time{display:block;margin-top:12px;font-size:12px;color:#aeaeb2}.project-view{display:flex;flex-direction:column;height:calc(100vh - 70px)}.project-topbar{display:flex;align-items:center;gap:16px;padding:12px 20px;background:#fff;border-bottom:1px solid #e5e5e7;border-radius:12px 12px 0 0;max-width:1200px;margin:0 auto;width:100%}.back-btn{padding:6px 14px;border-radius:8px;font-size:14px;color:#6e6e73;transition:background .2s}.back-btn:hover{background:#f5f5f7}.project-name{flex:1;font-weight:600;font-size:15px}.open-btn{padding:6px 14px;border-radius:8px;font-size:13px;color:#06c;transition:background .2s}.open-btn:hover{background:#f0f0ff}.project-frame{flex:1;width:100%;max-width:1200px;margin:0 auto;border:none;border-radius:0 0 12px 12px;background:#fff}@media(max-width:768px){.project-grid{grid-template-columns:1fr}.project-card:first-child{grid-column:span 1;grid-row:span 1}.hero h1{font-size:36px}}