/* Copyright (C) 2026 Kreativität Works <mail@kreativitat.com> */
:root{color-scheme:light;--ink:#173f3b;--paper:#f5f2ea;--muted:#63716c;--line:#d9dfd6;--accent:#db7855}*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper)}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.site-header,.site-footer,main{width:min(1180px,calc(100% - 80px));margin:auto}.site-header{display:flex;align-items:center;justify-content:space-between;padding:32px 0}.wordmark{font-size:31px;letter-spacing:-1.5px;font-weight:800;line-height:1}.wordmark span{font-weight:400}.wordmark small{display:block;margin-top:9px;font-size:8px;letter-spacing:2.2px;font-weight:400}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;min-height:570px;align-items:center;padding:70px 0 95px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;margin:0 0 27px}.hero h1{font-size:clamp(44px,5.4vw,72px);letter-spacing:-3.5px;line-height:1.04;font-weight:500;margin:0 0 27px}.intro{font-size:18px;line-height:1.65;max-width:490px;color:var(--muted);margin-bottom:31px}.primary-action{display:inline-flex;align-items:center;justify-content:center;gap:13px;border:0;border-radius:6px;background:var(--ink);color:white;padding:18px 23px;font-size:15px;font-weight:600;cursor:pointer}.primary-action:hover{background:#245a50}.quiet{font-size:12px;color:var(--muted);line-height:1.7;margin-top:17px}.screen-scene{position:relative;height:355px;isolation:isolate}.screen{padding:10px;background:#1b302d;border-radius:14px;box-shadow:0 24px 55px #183e3a26}.landscape{position:absolute;width:93%;height:255px;top:25px;left:0;transform:rotate(-5deg)}.screen-art{height:100%;background:#e9c9ad;overflow:hidden;position:relative;border-radius:5px;padding:23px;color:#244841}.art-label{font-size:8px;letter-spacing:2px;position:relative;z-index:2}.screen-art p{position:absolute;z-index:2;left:23px;bottom:45px;width:55%;margin:0;font-size:31px;letter-spacing:-1px;line-height:1.03}.screen-art small{position:absolute;bottom:22px;font-size:8px;letter-spacing:1px}.sun{width:160px;height:160px;position:absolute;right:12px;top:-40px;background:#e48559;border-radius:50%}.arch{position:absolute;right:25px;bottom:-55px;width:132px;height:228px;border-radius:95px 95px 0 0;background:#759d88}.portrait{position:absolute;right:-5px;top:112px;width:147px;height:244px;transform:rotate(7deg);z-index:3;padding:8px}.portrait-art{height:100%;background:#c3d3a6;border-radius:5px;padding:16px;position:relative;overflow:hidden}.portrait-art span{font-size:32px;font-weight:700;letter-spacing:-1.5px;line-height:.95;position:relative;z-index:2}.portrait-art small{position:absolute;bottom:12px;left:15px;font-size:6px;letter-spacing:.8px}.orbit{border:19px solid #51826e;border-radius:50%;width:138px;height:138px;position:absolute;top:80px;left:33px}.screen-foot{position:absolute;background:#c5cec4;bottom:18px;left:100px;width:170px;height:10px;border-radius:50%;z-index:-1}.features{border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:48px;padding:44px 0 62px}.feature-number{font-size:11px;color:#9b5d42}.features h2{font-size:19px;line-height:1.3;font-weight:500;margin:17px 0 12px}.features p{color:var(--muted);font-size:14px;line-height:1.8;margin:0}.site-footer{display:flex;align-items:center;border-top:1px solid var(--line);padding:22px 0;gap:22px;font-size:12px;color:var(--muted)}.site-footer img{mix-blend-mode:multiply;object-fit:contain}.site-footer a{margin-left:auto}.player-body{height:100dvh;background:#07100e;overflow:hidden}.player-body iframe{position:fixed;inset:0;width:100%;height:100%;border:0;background:var(--paper)}.player-gate{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:var(--paper);padding:24px}.player-card{max-width:500px;text-align:center}.player-card .brand-logo{width:145px;height:145px;object-fit:contain;mix-blend-mode:multiply}.player-card h1{font-size:39px;letter-spacing:-1.5px;margin:20px 0 12px}.player-card p{color:var(--muted);line-height:1.65;font-size:15px}.player-card .primary-action{width:100%;margin-top:14px}.windowed{border:0;background:none;text-decoration:underline;color:var(--ink);padding:15px;cursor:pointer}.player-tools{position:fixed;z-index:5;right:18px;bottom:18px;display:flex;gap:10px;transition:opacity .3s}.player-tools button{background:#143b32e8;color:white;border:1px solid #ffffff50;border-radius:6px;padding:12px 18px;cursor:pointer}.player-body:fullscreen .player-tools{opacity:0;pointer-events:none}.player-body:fullscreen .player-tools:focus-within{opacity:1;pointer-events:auto}.player-message{position:fixed;bottom:75px;left:20px;right:20px;z-index:7;color:white;background:#143b32;padding:14px;text-align:center;border-radius:6px}.player-message:empty{display:none}[hidden]{display:none!important}@media(max-width:850px){.site-header,.site-footer,main{width:calc(100% - 40px)}.hero{grid-template-columns:1fr;padding:48px 0;gap:30px}.hero h1{font-size:57px}.screen-scene{max-width:500px;width:100%;margin:10px auto 20px}.features{gap:25px}.site-footer{gap:12px}}@media(max-width:550px){.hero h1{font-size:47px;letter-spacing:-2px}.features{grid-template-columns:1fr;gap:32px}.intro{font-size:16px}.screen-scene{height:305px}.landscape{height:225px}.portrait{height:210px;width:126px;top:88px}.screen-art p{font-size:28px}.portrait-art span{font-size:27px}.site-footer{flex-wrap:wrap}.site-footer a{margin-left:0}.site-header{gap:20px}.wordmark{font-size:27px}}

.player-body:fullscreen .player-tools.needs-sound{opacity:1;pointer-events:auto}

/* Integrated login uses the same palette and stays on the presentation page. */
.login-dialog{width:min(440px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;padding:32px 36px;border:1px solid var(--line);border-radius:16px;color:var(--ink);background:var(--paper);box-shadow:0 32px 100px #102c3c40}
.login-dialog::backdrop{background:#102c2a80;backdrop-filter:blur(5px)}
.login-close{position:absolute;right:17px;top:12px;border:0;background:transparent;font-size:28px;color:var(--muted);cursor:pointer;padding:8px}
.login-brand{display:block;margin:0 auto;object-fit:contain;mix-blend-mode:multiply}
.login-dialog h2{font-size:34px;letter-spacing:-1px;font-weight:500;margin:20px 0 12px;text-align:center}
.login-intro{font-size:14px;line-height:1.6;color:var(--muted);text-align:center;margin:0 0 26px}
.login-dialog label{display:block;font-size:13px;font-weight:600;margin:18px 0 8px}
.login-dialog input{width:100%;padding:13px 14px;font:inherit;color:var(--ink);border:1px solid #bac7bd;border-radius:6px;background:#fffcf7;box-sizing:border-box}
.login-dialog input:focus{outline:2px solid #759d8880;outline-offset:2px;border-color:var(--ink)}
.login-dialog .primary-action{width:100%;margin-top:24px;justify-content:center}
.login-dialog button:disabled{opacity:.6;cursor:wait}
.login-error{padding:12px;border:1px solid #dfb4a4;border-radius:6px;background:#f7e4dc;color:#8c392c;font-size:13px;line-height:1.5}
.login-player{display:block;margin-top:25px;padding-top:22px;border-top:1px solid var(--line);text-align:center;font-size:13px}
@media(max-width:550px){.login-dialog{padding:25px}.login-brand{width:80px;height:80px}}

.site-footer .footer-links{display:flex;gap:24px;align-items:center;margin-left:auto;flex-wrap:wrap}.site-footer .footer-links a{margin-left:0}@media(max-width:550px){.site-footer .footer-links{width:100%;margin-left:0;padding-bottom:12px}}

.login-trigger{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:12px 22px;border:1px solid var(--ink);border-radius:10px;background:var(--ink);color:#fff;font-size:14px;font-weight:600;line-height:20px;cursor:pointer;box-shadow:0 4px 12px #173f3b18;transition:background .15s,box-shadow .15s}.login-trigger:hover{background:#245a50;border-color:#245a50;box-shadow:0 6px 16px #173f3b26}.login-trigger:active{background:#10322f;box-shadow:none}.login-trigger svg{flex:none}@media(max-width:550px){.login-trigger{padding:10px 16px;min-height:44px}}

.brand-haiku{margin:0;padding:38px 20px;border-top:1px solid var(--line);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:clamp(20px,2.2vw,28px);font-style:normal;font-weight:300;letter-spacing:-.025em;line-height:1.6;text-align:center;color:var(--ink);text-wrap:balance}@media(max-width:550px){.brand-haiku{padding:30px 0}}

/* Shared KreaPub application identity. */
.wordmark{display:flex;align-items:center;gap:12px}.wordmark img{border-radius:11px;flex-shrink:0}.login-brand,.player-card .brand-logo{mix-blend-mode:normal;border-radius:22%}