:root{--bg-deep: #05020a;--text-main: #ffffff;--accent-cyan: #00ffff;--accent-hot: #ff00ff;--col-astro: #00ffff;--col-react: #ffaa00;--col-css: #ff00ff;--col-ai: #39ff14;--col-devtips: #ffff00}body{background-color:var(--bg-deep);color:var(--text-main);font-family:Noto Sans JP,sans-serif;overflow:hidden;margin:0;padding:0;cursor:none}.font-cyber{font-family:Orbitron,sans-serif}.font-mincho{font-family:Zen Old Mincho,serif}.font-code{font-family:Fira Code,monospace}.will-transform{will-change:transform}.will-opacity{will-change:opacity}#video-bg{position:fixed;inset:0;z-index:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;opacity:1;pointer-events:none;transition:opacity .3s}.deep-space-overlay{position:fixed;inset:0;z-index:4;pointer-events:none;background:radial-gradient(circle,#0000,#00000026);opacity:0;transition:opacity 2s ease-out}.comic-halftone{position:fixed;inset:0;z-index:5;pointer-events:none;background-image:radial-gradient(circle,rgba(0,0,0,.6) 2px,transparent 2px);background-size:12px 12px;opacity:0;mix-blend-mode:normal;transition:opacity 2s ease-out}#ui-layer{position:fixed;inset:0;z-index:100;pointer-events:none;padding:2rem;display:flex;flex-direction:column;justify-content:space-between}.ai-header{display:flex;justify-content:space-between;align-items:flex-start;pointer-events:auto}.ai-logo{font-family:Orbitron,sans-serif;font-weight:900;font-size:1.8rem;letter-spacing:.1em;color:#fff;text-shadow:2px 2px 0px #000,0 0 10px var(--accent-cyan)}.ai-status{font-family:Fira Code,monospace;font-size:.7rem;color:#fff9;text-align:right}.hud-container{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);z-index:110;pointer-events:auto;display:flex;gap:.8rem;align-items:center}.hud-btn{position:relative;width:54px;height:64px;border:2px solid rgba(255,255,255,.3);background:#000c;color:#fffc;border-radius:8px;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:transform .2s,border-color .2s,color .2s;box-shadow:2px 2px #000;padding:4px;gap:2px}.hud-btn-icon{font-size:1.2rem}.hud-btn-label{font-family:Fira Code,monospace;font-size:.5rem;font-weight:600;letter-spacing:.05em;opacity:.8;text-transform:uppercase}.hud-btn:hover{transform:scale(1.05);border-color:#fff;color:#fff}.hud-btn:hover .hud-btn-label{opacity:1}.hud-btn.active{border-color:var(--accent-cyan);color:var(--accent-cyan);box-shadow:0 0 10px var(--accent-cyan)}.hud-btn.active .hud-btn-label{opacity:1}.hud-btn[data-cat=astro].active{border-color:var(--col-astro);color:var(--col-astro);box-shadow:0 0 15px var(--col-astro)}.hud-btn[data-cat=react].active{border-color:var(--col-react);color:var(--col-react);box-shadow:0 0 15px var(--col-react)}.hud-btn[data-cat=css].active{border-color:var(--col-css);color:var(--col-css);box-shadow:0 0 15px var(--col-css)}.hud-btn[data-cat=ai].active{border-color:var(--col-ai);color:var(--col-ai);box-shadow:0 0 15px var(--col-ai)}.hud-btn[data-cat=devtips].active{border-color:var(--col-devtips);color:var(--col-devtips);box-shadow:0 0 15px var(--col-devtips)}#tunnel-scene{position:fixed;inset:0;perspective:800px;overflow:hidden;z-index:10}#tunnel-scene.random-arrange-mode{overflow-y:auto;overflow-x:hidden}#tunnel-world{position:absolute;width:100%;min-height:100%;transform-style:preserve-3d}.ai-card-3d[data-cat=astro]{--neon: var(--col-astro)}.ai-card-3d[data-cat=react]{--neon: var(--col-react)}.ai-card-3d[data-cat=css]{--neon: var(--col-css)}.ai-card-3d[data-cat=ai]{--neon: var(--col-ai)}.ai-card-3d[data-cat=devtips]{--neon: var(--col-devtips)}.ai-card-3d{position:absolute;width:260px;height:340px;left:50%;top:50%;margin-left:-130px;margin-top:-170px;background:#0a0a0fcc;backdrop-filter:blur(8px);border:.5px solid rgba(168,85,247,.4);border-radius:4px;transform-style:preserve-3d;cursor:pointer;will-change:transform,opacity;opacity:.4;filter:grayscale(100%);transition:opacity .3s,filter .3s,box-shadow .3s}.card-border-animated{opacity:1}.border-stroke{animation:rotate-border-svg 2s linear infinite}@keyframes rotate-border-svg{0%{stroke-dashoffset:0}to{stroke-dashoffset:1200}}.ai-card-3d.active-zone{opacity:1;filter:grayscale(0%);box-shadow:0 0 20px #ffffff4d}.ai-card-3d:hover{opacity:1;filter:grayscale(0%) brightness(1.2);border-color:var(--neon, var(--accent-cyan));z-index:1000;box-shadow:0 0 30px var(--neon, var(--accent-cyan)),inset 0 0 20px #ffffff1a}.ai-card-3d:hover:before{opacity:1}.ai-card-3d.formation-mode{opacity:1!important;filter:grayscale(0%)!important;box-shadow:0 0 25px var(--neon, currentColor)!important}#tunnel-scene.random-arrange-mode .ai-card-3d.formation-mode{width:400px!important;height:520px!important}#tunnel-scene.random-arrange-mode .ai-card-3d.formation-mode .ai-card-img{width:100%;height:280px;-o-object-fit:cover;object-fit:cover}#tunnel-scene.random-arrange-mode .ai-card-3d.formation-mode .ai-card-title{font-size:1.4rem;line-height:1.4}#tunnel-scene.random-arrange-mode .ai-card-3d.formation-mode .ai-card-category{font-size:.9rem;padding:6px 12px}#tunnel-scene.random-arrange-mode .ai-card-3d.formation-mode .ai-card-date{font-size:.85rem}.ai-card-inner{position:absolute;inset:2px;display:flex;flex-direction:column;background:#000;overflow:hidden;pointer-events:none}.ai-card-img{width:100%;height:60%;-o-object-fit:cover;object-fit:cover;border-bottom:2px solid;filter:grayscale(100%);transition:filter .3s}.ai-card-3d:hover .ai-card-img,.ai-card-3d.active-zone .ai-card-img{filter:grayscale(0%)}.ai-card-info{padding:1rem;color:#fff;flex-grow:1;display:flex;flex-direction:column}.ai-card-title{font-family:Zen Old Mincho,serif;font-size:1rem;margin-bottom:.5rem;line-height:1.5;font-weight:900}.ai-card-meta{font-family:Fira Code,monospace;font-size:.6rem;display:flex;justify-content:space-between;margin-bottom:.5rem;font-weight:700}.floater-container{position:fixed;inset:0;z-index:20;pointer-events:none;overflow:hidden}.floater{position:absolute;will-change:transform;pointer-events:auto;cursor:pointer;filter:drop-shadow(4px 4px 0px rgba(0,0,0,.8))}.floater:hover{transform:scale(1.1);filter:drop-shadow(0 0 10px white);z-index:100}*{cursor:none!important}#fighter-cursor{position:fixed;top:0;left:0;width:50px;height:50px;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);mix-blend-mode:screen;filter:drop-shadow(0 0 4px cyan);opacity:0;will-change:transform}#fighter-svg{width:100%;height:100%;fill:none;stroke:#0ff;stroke-width:2.5;overflow:visible;transform-origin:center center}#reticle{position:absolute;top:50%;left:50%;width:70px;height:70px;border:2px dashed rgba(255,255,255,.6);border-radius:50%;transform:translate(-50%,-50%);animation:spin 4s linear infinite;pointer-events:none}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@media(hover:none){*{cursor:auto!important}#fighter-cursor{display:none!important}}body.archive-mode #fighter-cursor{display:none!important}body.archive-mode #archive-cursor{display:block!important}#archive-cursor{position:fixed;top:0;left:0;pointer-events:none;z-index:99999;display:none;will-change:transform}#archive-cursor-dot{width:12px;height:12px;border-radius:50%;background:#0ff;transform:translate(-50%,-50%)}#archive-cursor.hovering #archive-cursor-dot{transform:translate(-50%,-50%) scale(1.5);background:#f0f}#list-view-container{position:fixed;inset:0;z-index:200;background:#05020a;padding:6rem 2rem;display:none;opacity:0;overflow-y:auto}#archive-grid-container{position:fixed;inset:0;z-index:200;background:#05020afa;padding:6rem 2rem;display:none;opacity:0;overflow-y:auto}.archive-grid{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:2rem;padding:2rem 0}.archive-card{background:#0a0a0ff2;border:.5px solid rgba(255,255,255,.2);border-radius:8px;overflow:hidden;cursor:pointer;transition:transform .2s ease-out,border-color .2s ease-out;display:flex;flex-direction:column;will-change:transform}.archive-card:hover{transform:translateY(-5px);border-color:var(--accent-cyan)}.archive-card-img{width:100%;height:200px;-o-object-fit:cover;object-fit:cover;border-bottom:2px solid}.archive-card-info{padding:1.5rem;flex-grow:1;display:flex;flex-direction:column}.archive-card-meta{font-family:Fira Code,monospace;font-size:.7rem;display:flex;justify-content:space-between;margin-bottom:.8rem;align-items:center}.archive-card-category{font-weight:600;padding:4px 8px;border:1px solid currentColor;border-radius:4px}.archive-card-title{font-family:Zen Old Mincho,serif;font-size:1.1rem;font-weight:700;line-height:1.5;margin-bottom:.5rem}.archive-card-date{font-family:Fira Code,monospace;font-size:.7rem;color:#fff9;margin-top:auto}#latest-widget{position:fixed;bottom:2rem;right:2rem;z-index:150;width:300px;background:#141419f2;backdrop-filter:blur(10px);border-radius:12px;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 40px #00000080;overflow:hidden;transition:transform .3s ease,opacity .3s ease}#latest-widget.collapsed{transform:translate(calc(100% + 1rem))}.widget-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.2rem;background:#ffffff0d;border-bottom:1px solid rgba(255,255,255,.1)}.widget-title{font-family:Noto Sans JP,sans-serif;font-size:.85rem;font-weight:600;color:#ffffffe6;letter-spacing:.05em}.widget-close{background:none;border:none;color:#ffffff80;cursor:pointer;padding:4px;border-radius:4px;transition:color .2s,background .2s}.widget-close:hover{color:#fff;background:#ffffff1a}.widget-content{padding:.8rem;max-height:400px;overflow-y:auto}.widget-article{display:flex;gap:.8rem;padding:.8rem;border-radius:8px;cursor:pointer;transition:background .2s;text-decoration:none;color:inherit}.widget-article:hover{background:#ffffff14}.widget-article-thumb{width:60px;height:60px;border-radius:6px;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.widget-article-info{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}.widget-article-title{font-family:Noto Sans JP,sans-serif;font-size:.8rem;font-weight:500;color:#ffffffe6;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:.3rem}.widget-article-meta{display:flex;align-items:center;gap:.5rem;font-size:.7rem}.widget-article-category{font-family:Space Grotesk,sans-serif;font-weight:500;padding:2px 6px;border-radius:4px;background:#ffffff1a}.widget-article-date{color:#ffffff80;font-family:Fira Code,monospace}#widget-toggle{position:fixed;bottom:2rem;right:1rem;z-index:149;width:40px;height:40px;background:#1e1e23e6;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);border-radius:50%;color:#ffffffb3;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;opacity:0;pointer-events:none}#widget-toggle.show{opacity:1;pointer-events:auto}#widget-toggle:hover{background:#323237f2;border-color:#fff6;color:#fff}@media(max-width:768px){#latest-widget,#widget-toggle{display:none}}.list-header{max-width:1000px;margin:0 auto 3rem;border-bottom:2px solid #333;padding-bottom:1rem;display:flex;justify-content:space-between;align-items:end}.list-row{display:grid;grid-template-columns:120px 1fr 100px;gap:2rem;padding:1.5rem 1rem;border-bottom:1px solid #222;cursor:pointer;transition:background .2s;color:#999;align-items:center;max-width:1000px;margin:0 auto}.list-row:hover{background:#111;color:#fff}.list-row[data-cat=astro]:hover{border-left:4px solid var(--col-astro)}.list-row[data-cat=react]:hover{border-left:4px solid var(--col-react)}.list-row[data-cat=css]:hover{border-left:4px solid var(--col-css)}.list-row[data-cat=ai]:hover{border-left:4px solid var(--col-ai)}.list-row[data-cat=devtips]:hover{border-left:4px solid var(--col-devtips)}.list-date{font-family:Fira Code,monospace;font-size:.8rem}.list-title{font-family:Zen Old Mincho,serif;font-size:1.2rem;font-weight:700}.list-cat{font-family:Orbitron,sans-serif;font-size:.7rem;border:1px solid currentColor;padding:4px 8px;text-align:center}.scroll-hint{position:fixed;bottom:10px;left:50%;transform:translate(-50%);text-align:center;color:var(--accent-cyan);font-family:Fira Code,monospace;font-size:.75rem;opacity:.7;z-index:101;pointer-events:none}#debug-info{position:fixed;bottom:2rem;right:2rem;background:#000000e6;border:2px solid #00ffff;border-radius:8px;padding:1rem;font-family:Courier New,monospace;font-size:.75rem;color:#0ff;z-index:100000;min-width:250px;display:none}#debug-info.show{display:block}#debug-info .debug-item{margin:.25rem 0;padding:.25rem;border-bottom:1px solid rgba(0,255,255,.2)}#debug-info .debug-item:last-child{border-bottom:none}#debug-info .debug-label{color:#ff0;font-weight:700}#debug-info .debug-value{color:#0f0}#debug-info .debug-warning{color:#f60}#debug-info .debug-error{color:red}#coordinate-display{position:fixed;top:2rem;right:2rem;z-index:102;background:#000c;border:2px solid var(--accent-cyan);padding:.8rem 1.2rem;border-radius:8px;font-family:Fira Code,monospace;font-size:.9rem;color:var(--accent-cyan);pointer-events:none;box-shadow:0 0 15px #00ffff4d;min-width:180px}#coordinate-display .coord-label{color:#fff9;font-size:.7rem;margin-bottom:.3rem}#coordinate-display .coord-value{color:var(--accent-cyan);font-weight:600;letter-spacing:.1em}#coordinate-display .version-info{margin-top:.8rem;padding-top:.8rem;border-top:1px solid rgba(255,255,255,.2);font-size:.7rem;color:#fff6;text-align:center}#coordinate-tooltip{position:fixed;bottom:15%;left:5%;z-index:102;background:#000000e6;padding:1rem 1.5rem;border-radius:8px;font-family:Fira Code,monospace;font-size:.85rem;pointer-events:auto;box-shadow:0 0 15px #ffffff4d;max-width:250px;opacity:1;cursor:pointer;transform:translateY(0);border:2px solid transparent;background-clip:padding-box}#coordinate-tooltip:before{content:"";position:absolute;inset:-2px;border-radius:8px;padding:2px;background:linear-gradient(135deg,#fff,#ff0);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:-1}#coordinate-tooltip:hover{background:#000000f2;box-shadow:0 0 20px #ffff0080}#coordinate-tooltip:after{content:"";position:absolute;left:2rem;bottom:-8px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid #ffff00;filter:drop-shadow(0 0 2px rgba(255,255,255,.8))}#coordinate-tooltip .tooltip-text{background:linear-gradient(135deg,#fff,#ff0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.6;text-shadow:0 0 5px rgba(255,255,255,.5);font-size:.8rem;letter-spacing:.05em;opacity:1;text-rendering:optimizeSpeed;-webkit-font-smoothing:none;-moz-osx-font-smoothing:unset;image-rendering:pixelated}#intro-title-container{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:200;pointer-events:none;opacity:1}#intro-title-container.hidden{opacity:0;visibility:hidden}.intro-title-main{font-family:Space Grotesk,sans-serif;font-size:clamp(2.5rem,8vw,6rem);font-weight:700;letter-spacing:.15em;text-transform:uppercase;background:linear-gradient(135deg,#0ff,#f0f,#ff0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 30px rgba(0,255,255,.8)) drop-shadow(0 0 60px rgba(255,0,255,.5));opacity:0;transform:scale(.8) translateY(30px)}.intro-title-sub{font-family:Space Grotesk,sans-serif;font-size:clamp(1rem,3vw,1.8rem);font-weight:300;letter-spacing:.5em;text-transform:uppercase;color:#ffffffe6;text-shadow:0 0 20px rgba(255,255,255,.8),0 0 40px rgba(0,255,255,.5);margin-top:1rem;opacity:0;transform:translateY(20px)}.intro-glitch-line{position:absolute;width:100%;height:2px;background:linear-gradient(90deg,transparent,#00ffff,#ff00ff,#ffff00,transparent);opacity:0;filter:blur(1px)}.intro-glitch-line.top{top:30%}.intro-glitch-line.bottom{bottom:30%}.intro-particle{position:absolute;width:4px;height:4px;background:#fff;border-radius:50%;opacity:0;filter:blur(1px);box-shadow:0 0 10px #0ff,0 0 20px #f0f}#simple-mode-container{position:fixed;inset:0;z-index:300;background:#0a0a0f;display:none;opacity:0;overflow-y:auto;transition:opacity .3s ease;cursor:auto!important}#simple-mode-container.active{display:block;opacity:1}#simple-mode-container *{cursor:auto!important}#simple-mode-container.active~#fighter-cursor,#simple-mode-container.active~#archive-cursor{display:none!important}body:has(#simple-mode-container.active) #fighter-cursor,body:has(#simple-mode-container.active) #archive-cursor{display:none!important}.simple-header{max-width:900px;margin:0 auto;padding:3rem 2rem 2rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.1)}.simple-logo{font-family:Orbitron,sans-serif;font-size:1.2rem;font-weight:700;color:#fff;letter-spacing:.1em}.simple-back-btn{display:flex;align-items:center;gap:.5rem;padding:.6rem 1.2rem;background:transparent;border:1px solid #00ffff;border-radius:25px;color:#0ff;font-family:Orbitron,sans-serif;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s ease;letter-spacing:.1em}.simple-back-btn:hover{background:#0ff;color:#0a0a0f}.simple-back-btn svg{width:16px;height:16px}.simple-content{max-width:900px;margin:0 auto;padding:2rem}.simple-filter{display:flex;gap:.75rem;margin-bottom:2rem;flex-wrap:wrap}.simple-filter-btn{padding:.5rem 1rem;background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:20px;color:#ffffffb3;font-family:Noto Sans JP,sans-serif;font-size:.8rem;cursor:pointer;transition:all .2s ease}.simple-filter-btn:hover{border-color:#ffffff80;color:#fff}.simple-filter-btn.active{background:#0ff;border-color:#0ff;color:#0a0a0f;font-weight:600}.simple-filter-btn[data-cat=ai-journey].active{background:#0ff;border-color:#0ff}.simple-filter-btn[data-cat=ai-tips].active{background:#fa0;border-color:#fa0}.simple-sort{display:flex;gap:.5rem;margin-bottom:2rem;align-items:center}.simple-sort-label{font-size:.75rem;color:#ffffff80;margin-right:.5rem}.simple-sort-btn{padding:.4rem .8rem;background:transparent;border:1px solid rgba(255,255,255,.15);border-radius:4px;color:#fff9;font-size:.7rem;cursor:pointer;transition:all .15s ease}.simple-sort-btn:hover{border-color:#ffffff4d;color:#fff}.simple-sort-btn.active{background:#ffffff1a;border-color:#ffffff4d;color:#fff}.simple-articles{display:flex;flex-direction:column;gap:1px;background:#ffffff0d;border-radius:8px;overflow:hidden}.simple-article{display:flex;gap:1.5rem;padding:1.5rem;background:#0a0a0f;cursor:pointer;transition:background .15s ease}.simple-article:hover{background:#ffffff08}.simple-article-thumb{width:120px;height:80px;border-radius:6px;-o-object-fit:cover;object-fit:cover;flex-shrink:0}.simple-article-info{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}.simple-article-meta{display:flex;align-items:center;gap:1rem;margin-bottom:.5rem}.simple-article-cat{font-size:.65rem;font-weight:600;padding:.2rem .5rem;border-radius:3px;text-transform:uppercase;letter-spacing:.05em}.simple-article-cat.ai-journey{background:#00ffff26;color:#0ff}.simple-article-cat.ai-tips{background:#ffaa0026;color:#fa0}.simple-article-date{font-family:Fira Code,monospace;font-size:.7rem;color:#fff6}.simple-article-title{font-family:Noto Sans JP,sans-serif;font-size:1rem;font-weight:600;color:#fff;line-height:1.5;margin-bottom:.3rem}.simple-article-desc{font-size:.8rem;color:#ffffff80;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.simple-empty{text-align:center;padding:4rem 2rem;color:#fff6}@media(max-width:640px){.simple-article{flex-direction:column;gap:1rem}.simple-article-thumb{width:100%;height:160px}}