/* Windows XP "Luna" – IE-Chrome, Toolbars, Taskleiste, Fenster */
:root{--bb:52px;--xp-blue:#0a54e6;--xp-face:#ece9d8}
body{padding-bottom:var(--bb)}
footer{padding-bottom:calc(var(--bb) + 60px)}
.cookie{bottom:calc(var(--bb) + 14px)}#eggs{bottom:calc(var(--bb) + 10px)}#duck-layer{bottom:var(--bb)}
#toolbars{display:none}

#chrome{position:fixed;top:0;left:0;right:0;z-index:9000;font:11px Tahoma,"Segoe UI",Verdana,sans-serif;color:#000;box-shadow:0 3px 10px #0008;user-select:none}
.ie-title{height:28px;display:flex;align-items:center;gap:6px;padding:0 4px 0 6px;color:#fff;font:700 13px "Trebuchet MS",Tahoma,sans-serif;text-shadow:1px 1px #0a1e6a;
 background:linear-gradient(180deg,#0997ff 0%,#0053ee 9%,#0050ee 40%,#06f 88%,#06f 93%,#005bff 95%,#003dd7 96%,#003dd7 100%);border-radius:8px 8px 0 0}
.ie-title .tt{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ie-title .ti{font-size:16px}
.tbs{display:flex;gap:2px}.tbs button,.xt button{width:21px;height:21px;padding:0;border:1px solid #fff;border-radius:3px;color:#fff;font:700 12px Tahoma;line-height:1;background:radial-gradient(circle at 30% 25%,#7aa7ff,#2b63df 70%);box-shadow:inset 0 0 2px #fff6}
.tbs button:last-child,.xt .xc{background:radial-gradient(circle at 30% 25%,#f5a58f,#d8432b 70%)}
.tbs button:hover,.xt button:hover{filter:brightness(1.2)}
.ie-menu{height:21px;display:flex;align-items:center;gap:2px;padding:0 4px;background:var(--xp-face);border-bottom:1px solid #fff;position:relative}
.ie-menu>span{padding:2px 7px}.ie-menu>span:hover,.ie-menu>span.on{background:#316ac5;color:#fff}
.ie-menu .throb{margin-left:auto;background:#fff;border:1px solid #aca899;padding:0 8px;font-size:15px;height:19px;animation:spin 6s linear infinite;display:inline-block;transform-origin:center}
.ie-menu .throb:hover{background:#fff}
.ie-dd{position:absolute;top:21px;background:#fff;border:1px solid #aca899;box-shadow:3px 3px 5px #0005;min-width:210px;z-index:5;padding:2px}
.ie-dd div{padding:4px 22px;white-space:nowrap}.ie-dd div:hover{background:#316ac5;color:#fff}.ie-dd .sep{height:1px;padding:0;margin:3px 0;background:#ccc}
.ie-tools{height:46px;display:flex;align-items:center;gap:2px;padding:0 4px;background:linear-gradient(#f5f4ea,#ece9d8 60%,#d8d2bd);border-bottom:1px solid #aca899}
.ie-tools .sepv{width:1px;height:34px;background:#aca899;margin:0 4px;box-shadow:1px 0 #fff}
.big-b{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:48px;height:40px;border:1px solid transparent;border-radius:3px;background:none;font:11px Tahoma;color:#000;padding:0 4px}
.big-b span{font-size:20px;line-height:20px}.big-b:hover{border-color:#316ac5;background:linear-gradient(#fff,#dce6f7)}.big-b:active{background:#c1d2ee;padding-top:1px}
.ie-addr{height:28px;display:flex;align-items:center;gap:6px;padding:0 6px;background:linear-gradient(#ece9d8,#e3dfcf);border-bottom:1px solid #aca899}
.ie-addr b{font-weight:normal;color:#444}.ie-addr input{flex:1;height:20px;border:1px solid #7f9db9;background:#fff;padding:0 4px;font:12px Tahoma;user-select:text}
.xbtn{min-width:75px;border:1px solid #003c74;border-radius:3px;background:linear-gradient(#fff,#ecebe5 85%,#d6d0c5);font:11px Tahoma;padding:3px 10px;color:#000}
.xbtn:hover{box-shadow:inset 0 0 0 2px #fbd685}.xbtn:active{background:#e4e0d0}.ie-addr .xbtn{min-width:0;padding:2px 8px}
#xtbs{background:var(--xp-face)}
.xtb{height:26px;display:flex;align-items:center;gap:3px;padding:0 6px 0 2px;border-bottom:1px solid #aca899;background:linear-gradient(#f4f3ea,#e6e2d0);white-space:nowrap;overflow:hidden;animation:xtbin .35s ease-out}
@keyframes xtbin{from{height:0;opacity:0}to{height:26px;opacity:1}}
.xtb .grip{width:6px;height:20px;margin:0 3px 0 1px;background:repeating-linear-gradient(#aca899 0 2px,#0000 2px 4px);border-left:1px solid #fff}
.xtb .xlogo{font:700 11px Tahoma;color:#fff;padding:2px 8px;border-radius:3px;background:var(--c,#d33);text-shadow:0 1px #0006}
.xtb button{border:1px solid transparent;background:none;font:11px Tahoma;padding:1px 6px;border-radius:2px;color:#000}
.xtb button:hover{border-color:#316ac5;background:linear-gradient(#fff,#dce6f7)}
.xtb input{height:18px;width:150px;border:1px solid #7f9db9;font:11px Tahoma;padding:0 3px;user-select:text}
.xtb .sp{flex:1}.xtb .chev{font-weight:bold;color:#444}.xtb .xclose{color:#a00;font-weight:bold}

#ie-status{position:fixed;left:0;right:0;bottom:30px;height:22px;z-index:9790;display:flex;align-items:center;gap:10px;padding:0 8px;background:var(--xp-face);border-top:1px solid #aca899;font:11px Tahoma;color:#000;box-shadow:0 -1px #fff}
#ie-status .st{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.st-bar{width:120px;height:13px;border:1px solid #888;background:#fff;overflow:hidden}.st-bar i{display:block;height:100%;width:0;background:repeating-linear-gradient(90deg,#2fb83a 0 8px,#fff 8px 10px)}.loading .st-bar i{animation:stbar 1.2s linear infinite}
@keyframes stbar{0%{width:0}100%{width:100%}}

#taskbar{position:fixed;left:0;right:0;bottom:0;height:30px;z-index:9800;display:flex;align-items:stretch;font:11px Tahoma;color:#fff;background:linear-gradient(#3168d5 0%,#4993e6 8%,#2157d7 20%,#245edb 90%,#1941a5 100%);box-shadow:0 -2px 4px #0006}
#start{display:flex;align-items:center;gap:6px;padding:0 22px 0 10px;border:0;border-radius:0 14px 14px 0;font:italic 900 19px "Trebuchet MS",Tahoma,sans-serif;color:#fff;text-shadow:1px 1px 2px #0008;background:linear-gradient(#6fcf64 0%,#3fa83b 15%,#359a31 60%,#2f8a2c 100%);box-shadow:2px 0 5px #0007,inset 0 2px 2px #bff0b8}
#start:hover{filter:brightness(1.12)}#start:active,#start.on{filter:brightness(.9)}
#tasks{flex:1;display:flex;gap:3px;padding:2px 6px;overflow:hidden}
.tbk{display:flex;align-items:center;gap:5px;min-width:60px;max-width:170px;flex:0 1 160px;border:1px solid #1d4cbf;border-radius:3px;background:linear-gradient(#4f8cf0,#3a74de);color:#fff;font:11px Tahoma;padding:0 8px;overflow:hidden;white-space:nowrap}
.tbk.on{background:linear-gradient(#1e3f9e,#2b57c5);box-shadow:inset 1px 1px 3px #000a}.tbk:hover{filter:brightness(1.1)}
#tray{display:flex;align-items:center;gap:8px;padding:0 12px;border-left:1px solid #0b3da8;background:linear-gradient(#0f9ae8,#0c82d9 40%,#0a6fc7);box-shadow:inset 1px 0 #3ec0ff}
#tray .clk{font:11px Tahoma}
#startmenu{position:fixed;left:0;bottom:30px;width:390px;z-index:9801;border:1px solid #0831d9;border-radius:8px 8px 0 0;background:#fff;overflow:hidden;box-shadow:3px -3px 10px #0007;font:12px Tahoma;color:#000;animation:smup .18s ease-out}
@keyframes smup{from{transform:translateY(20px);opacity:0}}
.sm-head{display:flex;align-items:center;gap:10px;height:54px;padding:0 10px;color:#fff;font:700 18px "Trebuchet MS";text-shadow:1px 1px #0008;background:linear-gradient(#1c55d8,#3a84f0 15%,#1c55d8 60%,#0a40b8)}
.sm-head i{font-style:normal;width:42px;height:42px;border:2px solid #fff;border-radius:6px;display:grid;place-items:center;font-size:26px;background:#e8d9b0}
.sm-cols{display:grid;grid-template-columns:1fr 1fr}
.sm-l{background:#fff;padding:6px 4px;border-right:1px solid #95bdee}.sm-r{background:#d3e5fa;padding:6px 4px;color:#00136b}
.sm-it{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:2px;white-space:nowrap}.sm-it span{font-size:22px;width:26px;text-align:center}
.sm-l .sm-it:hover,.sm-r .sm-it:hover{background:#316ac5;color:#fff}.sm-sep{height:1px;background:#d0d0d0;margin:4px 8px}
.sm-foot{display:flex;justify-content:flex-end;gap:14px;padding:6px 12px;background:linear-gradient(#4283e8,#2c62cf);color:#fff}.sm-foot .sm-it{padding:3px 8px}.sm-foot .sm-it:hover{background:#ffffff33;color:#fff}

.xpw{position:fixed;border:1px solid #0831d9;border-radius:8px 8px 0 0;background:var(--xp-face);box-shadow:3px 4px 12px #0009;font:12px Tahoma,sans-serif;color:#000;animation:xpop .15s ease-out}
@keyframes xpop{from{transform:scale(.92);opacity:0}}
.xt{display:flex;align-items:center;gap:4px;height:26px;padding:0 3px 0 6px;border-radius:7px 7px 0 0;color:#fff;font:700 12px "Trebuchet MS",Tahoma;text-shadow:1px 1px #0a1e6a;cursor:move;touch-action:none;
 background:linear-gradient(180deg,#0997ff 0%,#0053ee 9%,#0050ee 40%,#06f 88%,#005bff 95%,#003dd7 100%)}
.xpw.inactive .xt{background:linear-gradient(#7a96df,#7799e1 50%,#6b8de0);filter:saturate(.6)}
.xt .xn{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xb{padding:10px;border:3px solid #0050ee;border-top:0;background:var(--xp-face)}
.dlg{display:flex;gap:14px;align-items:flex-start;padding:6px 6px 12px}.dlg .gi{font-size:34px;line-height:1}.dlg p{margin:2px 0}
.dlg-b{display:flex;justify-content:center;gap:8px;padding-bottom:4px}
.xpw textarea{width:100%;height:190px;border:1px solid #7f9db9;font:13px "Lucida Console",monospace;background:#fff;color:#000;resize:none;user-select:text}
.xpw pre{margin:0;background:#fff;border:1px solid #7f9db9;padding:6px;max-height:260px;overflow:auto;font:11px "Lucida Console",monospace;user-select:text;white-space:pre-wrap}
.xlist div{padding:4px 8px;border-bottom:1px dotted #bbb}.xlist div:hover{background:#316ac5;color:#fff}
.xchk{display:block;margin:5px 0}
.flash{animation:flashb .5s steps(1) infinite}@keyframes flashb{50%{background:#ff0}}
/* minesweeper */
.ms-head{display:flex;justify-content:space-between;align-items:center;padding:4px;border:2px inset #fff;margin-bottom:6px;background:var(--xp-face)}
.lcd{font:700 20px "Courier New",monospace;background:#000;color:#f00;padding:0 4px;min-width:46px;text-align:center}.ms-face{font-size:18px;width:32px;height:32px;border:2px outset #fff;background:var(--xp-face)}
.ms-grid{display:grid;grid-template-columns:repeat(9,20px);border:3px inset #fff;width:max-content}
.ms-c{width:20px;height:20px;padding:0;border:2px outset #fff;background:var(--xp-face);font:700 12px Tahoma;line-height:1}.ms-c.o{border:1px solid #888;background:#c8c4b3}.ms-c.b{background:#f33}
.n1{color:#00f}.n2{color:#080}.n3{color:#f00}.n4{color:#008}.n5{color:#800}.n6{color:#088}
/* clicker */
.ck-big{font-size:90px;display:block;margin:0 auto;border:0;background:none;transition:transform .08s}.ck-big:active{transform:scale(.88)}
.ck-up{display:flex;justify-content:space-between;width:100%;margin:3px 0}.ck-up:disabled{opacity:.5}
.plus1{position:fixed;pointer-events:none;font:900 18px Impact;color:#0a0;z-index:9990;animation:plus 1s forwards}@keyframes plus{to{transform:translateY(-60px);opacity:0}}
/* overlays */
#hack{position:fixed;inset:0;z-index:10002;background:#000;color:#0f0;font:15px "Courier New",monospace;padding:20px;overflow:hidden;white-space:pre-wrap}
#hack b{display:block;margin-top:20px;font:900 54px Impact;color:#0f0;text-shadow:0 0 20px #0f0;animation:flashb2 .6s steps(1) infinite}@keyframes flashb2{50%{opacity:.2}}
#shutdown{position:fixed;inset:0;z-index:10003;background:#5a7edc;color:#fff;display:grid;place-items:center;font:700 26px "Trebuchet MS",sans-serif;text-align:center}
#shutdown.off{background:#000;color:#ff9a3d;font:20px "Lucida Console",monospace}
#endweb{position:fixed;inset:0;z-index:9900;background:#000d;display:grid;place-items:center;text-align:center;color:#fff;animation:fade .6s}
#endweb div{max-width:520px;padding:30px;border:3px dashed var(--y)}
.fx{position:fixed;inset:0;pointer-events:none;z-index:9400}
.matrixmode main,.matrixmode header,.matrixmode .ticker,.matrixmode footer{filter:grayscale(1) sepia(1) hue-rotate(55deg) saturate(5) brightness(.9)}
.light main{filter:invert(1) hue-rotate(180deg) brightness(1.5)}
.upside main{transform:rotate(180deg);transition:transform .8s}.mirror main{transform:scaleX(-1);transition:transform .8s}.askew main{transform:rotate(1.6deg);transition:transform .6s}
main.quake{animation:quake 1.6s}@keyframes quake{0%,100%{transform:none}10%{transform:translate(-14px,8px) rotate(-1deg)}20%{transform:translate(12px,-10px) rotate(1deg)}30%{transform:translate(-10px,12px)}40%{transform:translate(14px,6px) rotate(-1deg)}50%{transform:translate(-8px,-8px)}60%{transform:translate(10px,10px) rotate(1deg)}80%{transform:translate(-6px,4px)}}
.nyan{position:fixed;z-index:9650;pointer-events:none;font-size:56px;display:flex;align-items:center}
.nyan i{display:block;height:40px;width:0;background:linear-gradient(#f00 0 16.6%,#f90 16.6% 33.3%,#ff0 33.3% 50%,#3f3 50% 66.6%,#39f 66.6% 83.3%,#93f 83.3%)}
.bread{position:fixed;z-index:9110;font-size:28px;pointer-events:none}
#hero-potato{position:relative}#hero-potato.gold svg{filter:sepia(1) saturate(7) hue-rotate(-8deg) brightness(1.25) drop-shadow(0 0 30px gold)}
#hero-potato .crown{position:absolute;left:50%;top:6%;transform:translateX(-50%) rotate(-8deg);font-size:80px;animation:float 2s ease-in-out infinite}
.hype-row{display:flex;flex-wrap:wrap;gap:12px;margin:10px 0;font-weight:700}.hype-row span{background:#ffffff14;border:1px solid #ffffff2a;border-radius:20px;padding:4px 12px}
#cd{color:#ff7a7a;font-variant-numeric:tabular-nums}
.banner{display:flex;align-items:center;gap:20px;max-width:780px;margin:18px auto 0;padding:8px 16px;border:3px ridge #ffd24a;background:repeating-linear-gradient(45deg,#2b1055 0 12px,#3a1672 12px 24px);font:900 20px Impact,sans-serif;position:relative;overflow:hidden;animation:bnblink 1.2s steps(1) infinite}
@keyframes bnblink{50%{border-color:#ff3df0}}.banner .bn-t{flex:1;text-shadow:0 0 8px #fff}
.monkey{font-size:42px;animation:mk 2.4s ease-in-out infinite alternate;user-select:none}@keyframes mk{from{transform:translateX(-90px)}to{transform:translateX(90px)}}
.ripple{position:fixed;border:3px solid #fff;border-radius:50%;pointer-events:none;z-index:9660;animation:rip .6s ease-out forwards}@keyframes rip{from{width:0;height:0;opacity:.9;margin:0}to{width:120px;height:120px;margin:-60px 0 0 -60px;opacity:0}}
#spot{position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(260px at var(--mx,50%) var(--my,50%),#ffffff1a,transparent 70%);mix-blend-mode:soft-light}
.wave{height:70px;margin:0;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='600' height='70' viewBox='0 0 600 70'><path d='M0 35 Q75 0 150 35 T300 35 T450 35 T600 35 V70 H0Z' fill='%23ff3df0' fill-opacity='.35'/></svg>") repeat-x;animation:wavem 7s linear infinite}
.wave.w2{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='600' height='70' viewBox='0 0 600 70'><path d='M0 35 Q75 70 150 35 T300 35 T450 35 T600 35 V70 H0Z' fill='%232af3ff' fill-opacity='.3'/></svg>");animation-duration:11s;animation-direction:reverse;margin-top:-50px}
@keyframes wavem{to{background-position-x:600px}}
html.frozen *{animation-play-state:paused!important}
.ie-min{transition:transform .5s,opacity .5s}.ie-min body{transform-origin:50% 100%}
@media (max-width:860px){.ie-tools .big-b{min-width:34px}.ie-tools .big-b b{display:none}#startmenu{width:100vw}.sm-cols{grid-template-columns:1fr}}

/* Schriftfallback (Linux ohne Tahoma/Trebuchet) */
#chrome,#chrome *,.xpw,.xpw *,#taskbar,#taskbar *,#startmenu,#startmenu *,#ie-status,#ie-status *{font-family:Tahoma,"DejaVu Sans","Liberation Sans",Verdana,"Segoe UI",sans-serif}
.ie-title,.ie-title *,.xt,.xt *,#start,.sm-head{font-family:"Trebuchet MS","DejaVu Sans","Liberation Sans",sans-serif}
.xpw pre,.xpw textarea{font-family:"Lucida Console","DejaVu Sans Mono",monospace}.lcd,.ms-c{font-family:"DejaVu Sans Mono","Courier New",monospace}