*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background:#fff0d6;font-family:Segoe UI,system-ui,sans-serif;overflow:hidden;color:#3a2e1e}#canvas{display:block;width:100vw;height:100vh}#intro{position:fixed;top:0;right:0;bottom:0;left:0;background:#fff0d6;display:flex;align-items:center;justify-content:center;z-index:100;transition:opacity .6s ease}#intro.fade-out{opacity:0;pointer-events:none}.intro-inner{text-align:center}.intro-inner h1{font-size:clamp(2.5rem,6vw,5rem);font-weight:700;color:#3a2e1e;letter-spacing:-.02em}.intro-inner p{margin-top:.5rem;font-size:clamp(1rem,2vw,1.4rem);color:#7a6a50}#intro-enter{margin-top:2rem;padding:.75rem 2.5rem;background:#d4943a;color:#fff;border:none;border-radius:999px;font-size:1rem;font-weight:600;cursor:pointer;transition:background .2s,transform .1s}#intro-enter:hover{background:#b8782a;transform:translateY(-1px)}#toast{position:fixed;top:1.5rem;left:50%;transform:translate(-50%) translateY(-8px);background:#3a2e1eeb;color:#fff0d6;padding:.55rem 1.4rem;border-radius:999px;font-size:.88rem;font-weight:600;z-index:80;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;white-space:nowrap}#toast.visible{opacity:1;transform:translate(-50%) translateY(0)}#hover-label{position:fixed;pointer-events:none;background:#3a2e1ed9;color:#fff0d6;padding:.3rem .75rem;border-radius:6px;font-size:.8rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;display:none;z-index:50;transform:translate(-50%,-100%);white-space:nowrap}#zone-nav{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);display:flex;gap:.5rem;background:#fff0d6d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:.5rem;border-radius:999px;box-shadow:0 4px 24px #3a2e1e1f;z-index:40}#zone-nav button{padding:.4rem 1.1rem;border:none;border-radius:999px;background:transparent;color:#7a6a50;font-size:.82rem;font-weight:600;cursor:pointer;transition:background .15s,color .15s;letter-spacing:.02em}#zone-nav button:hover,#zone-nav button.active{background:#d4943a;color:#fff}#panel{position:fixed;top:0;right:0;width:min(440px,100vw);height:100vh;background:#fff8ee;box-shadow:-4px 0 32px #3a2e1e1f;padding:2rem 1.75rem;overflow-y:auto;z-index:60;transform:translate(0);transition:transform .4s cubic-bezier(.4,0,.2,1)}#panel.panel--hidden{transform:translate(110%)}#panel-close{position:absolute;top:1.2rem;right:1.2rem;background:none;border:none;font-size:1.2rem;cursor:pointer;color:#7a6a50;width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .15s}#panel-close:hover{background:#f0dfc0}.panel-header{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:1.5rem;padding-right:2rem}.panel-zone-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;margin-top:6px}#panel-title{font-size:1.4rem;font-weight:700;color:#3a2e1e;line-height:1.2}#panel-subtitle{font-size:.85rem;color:#7a6a50;margin-top:.2rem}.company-card{background:#fff0d6;border-radius:12px;padding:1.1rem 1.2rem;margin-bottom:1rem}.company-name{font-size:1rem;font-weight:700;color:#3a2e1e}.company-role{font-size:.85rem;font-weight:600;color:#d4943a;margin-top:.1rem}.company-period{font-size:.75rem;color:#9a8a70;margin-top:.1rem;margin-bottom:.6rem}.company-bullets{list-style:none;padding:0}.company-bullets li{font-size:.82rem;color:#5a4a35;padding:.2rem 0 .2rem 1rem;position:relative;line-height:1.45}.company-bullets li:before{content:"▸";position:absolute;left:0;color:#d4943a}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:.8rem}.project-thumb{border-radius:8px;overflow:hidden;position:relative;aspect-ratio:16/9;background:#e8d8b8;cursor:pointer;text-decoration:none}.project-thumb img{width:100%;height:100%;object-fit:cover}.project-thumb--icon img{object-fit:contain;padding:10%}.project-thumb-label{position:absolute;bottom:0;left:0;right:0;padding:.3rem .4rem;background:#3a2e1ebf;color:#fff;font-size:.7rem;font-weight:600}.skills-wrap{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.2rem}.skill-tag{background:#f0dfc0;color:#5a4a35;padding:.25rem .7rem;border-radius:999px;font-size:.78rem;font-weight:600}.contact-row{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:#5a4a35;margin-bottom:.5rem}.contact-row a{color:#d4943a;text-decoration:none}.contact-row a:hover{text-decoration:underline}.section-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#9a8a70;margin-bottom:.5rem}
