:root{color-scheme:dark;--bg:#0c0e15;--card:#181923;--muted:#9c9ba8;--line:#31313b;--text:#f6f4fa;--violet:#bb9cff;--pink:#e4a7c1;--gold:#d7ae74}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.55 Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;min-height:100vh;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #d4b9fc;outline-offset:3px}a{color:inherit;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.45}.ambient{position:fixed;z-index:-1;pointer-events:none;filter:blur(75px);border-radius:50%;opacity:.27}.ambient-one{width:500px;height:450px;background:#512962;right:-180px;top:-180px}.ambient-two{width:500px;height:420px;background:#192c58;left:-260px;top:650px;opacity:.15}.shell{max-width:1360px;margin:auto;padding:0 46px}.topbar{display:flex;justify-content:space-between;align-items:center;height:95px;border-bottom:1px solid #ffffff16}.brand{display:flex;align-items:center;gap:12px}.brandmark{position:relative;width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,#d0b3ff,#a281e1 55%,#8062b7);display:flex;align-items:center;justify-content:center;font-size:31px;line-height:1;color:#17101f;font-weight:850;letter-spacing:-4px;box-shadow:0 8px 30px #b495f82c}.brand-dot{width:7px;height:7px;background:#ebdbff;position:absolute;right:10px;bottom:9px;border-radius:50%}.brand-words strong{display:block;letter-spacing:.29em;font-size:20px;line-height:1.2}.brand-words small{display:block;color:#b9aebf;font-size:9px;letter-spacing:.24em;margin-top:4px}.header-right{display:flex;align-items:center;gap:25px}.test-badge{border:1px solid #bca4ff66;border-radius:30px;padding:7px 13px;font-size:10px;font-weight:800;letter-spacing:.12em;color:#c9b4f5;background:#9c82ea16}.profile-pill{background:#1c1c27;border:1px solid #393744;border-radius:40px;padding:7px 13px 7px 7px;display:flex;align-items:center;gap:10px;color:#efebf5;font-size:13px}.avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(140deg,#bfa8dd,#7958a9);display:grid;place-items:center;color:#151021;font-weight:800}.chevron{color:#ac95c9;margin-left:5px}.hero{position:relative;display:grid;grid-template-columns:1.1fr .9fr;min-height:495px;align-items:center;padding:50px 0 58px;isolation:isolate;overflow:hidden}.hero:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:linear-gradient(90deg,transparent,#7b6882,transparent);opacity:.4}.hero-content{z-index:2}.eyebrow,.overline{color:#b79be0;letter-spacing:.22em;font-size:10px;font-weight:800}.eyebrow{display:flex;align-items:center;gap:12px}.eyebrow-line{width:27px;height:1px;background:#b79be0}.hero h1{font-size:clamp(37px,4.3vw,64px);line-height:1.15;letter-spacing:-.055em;font-weight:780;margin:26px 0 20px}.hero h1 em,.how h2 em{font-style:normal;background:linear-gradient(100deg,#d6b7fc,#eac3d6);color:transparent;background-clip:text;-webkit-background-clip:text}.hero p{max-width:475px;color:#aaa9b6;font-size:16px;line-height:1.75}.hero-actions{display:flex;align-items:center;gap:13px;margin-top:27px}.btn{border:0;border-radius:11px;padding:12px 20px;font-size:13px;font-weight:750;transition:transform .18s,filter .18s}.btn:hover{transform:translateY(-2px);filter:brightness(1.08)}.btn-primary{background:linear-gradient(120deg,#caa9fe,#a78be7);color:#1b1425;box-shadow:0 9px 26px #a990ff2d}.btn-ghost{border:1px solid #53505f;background:#ffffff06;color:#eee7fb}.btn span{margin-left:13px}.hero-meta{display:flex;align-items:center;gap:12px;color:#9997a5;font-size:12px;margin-top:32px}.mini-avatars{font-size:17px;letter-spacing:-7px;white-space:pre;padding-right:8px}.hero-meta strong{color:#e9e1f7}.hero-art{height:450px;position:relative;transform:translateX(-4px)}.orb{position:absolute;width:350px;height:350px;background:radial-gradient(circle,#6b4a8d8c,#38243f44 55%,transparent 73%);filter:blur(20px);left:70px;top:35px}.art-frame{position:absolute;width:238px;height:330px;border-radius:8px;overflow:hidden;border:1px solid #ffffff55;box-shadow:0 34px 70px #0009}.art-frame-back{right:24px;top:23px;transform:rotate(11deg);background:linear-gradient(160deg,#233d4e,#111b2d 52%,#4d403d);display:flex;align-items:center;justify-content:center;text-align:center;font-weight:950;font-size:35px;line-height:1.12;letter-spacing:-.04em;color:#ece5d1}.art-frame-front{left:90px;top:76px;transform:rotate(-8deg);background:radial-gradient(ellipse at 20% 25%,#839aa0 0,#253d52 20%,#0e1a2a 52%,#0d1820 100%);display:flex;flex-direction:column;justify-content:space-between;padding:25px;box-shadow:0 30px 75px #02030ccc}.art-frame-front:after{content:"";position:absolute;width:270px;height:250px;border-radius:50%;border:2px solid #b9d6d635;transform:rotate(26deg);left:-40px;top:125px;box-shadow:0 0 0 27px #b9d6d609,0 0 0 63px #b9d6d606}.poster-top,.poster-bottom{font-size:8px;letter-spacing:.2em;color:#f1f3e1;z-index:1}.poster-center{font-size:57px;line-height:1;font-weight:850;letter-spacing:-.11em;z-index:1;color:#f2ebe6;text-shadow:0 3px 30px #ccc8}.poster-center span{font-size:28px;vertical-align:middle;letter-spacing:0}.art-shine{position:absolute;right:45px;bottom:45px;border:1px solid #e6d6fc35;width:105px;height:105px;border-radius:50%}.section-top{display:flex;justify-content:space-between;align-items:end;gap:20px;padding:58px 0 20px}.section-top h2,.how h2{font-size:30px;line-height:1.25;letter-spacing:-.035em;margin:8px 0}.accent{color:#c9a5fc}.section-sub{margin:6px 0 0;color:var(--muted)}.switcher{display:flex;background:#1d1d27;border:1px solid #32313c;border-radius:12px;padding:5px;gap:3px}.tab{border:0;border-radius:8px;background:transparent;color:#aaa7b5;font-size:12px;font-weight:700;padding:11px 13px;white-space:nowrap}.tab.active{background:#494056;color:#f5edff}.tiny-count{background:#ffffff24;border-radius:50%;padding:2px 6px;font-size:10px}.filters{display:flex;align-items:center;gap:14px;margin-top:22px}.search-wrap{width:350px;flex:0 0 350px;height:47px;border:1px solid #353540;background:#171820;border-radius:11px;display:flex;align-items:center;padding:0 15px;gap:11px}.search-wrap input{background:transparent;color:#f8f8fc;width:100%;border:0;outline:0;font-size:12px}.search-wrap input::placeholder{color:#898694}.search-icon{font-size:27px;color:#b49bd8;line-height:1}.search-shortcut{color:#777583;font-size:9px;font-weight:800;letter-spacing:.12em}.genre-strip{display:flex;gap:7px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#5e516e transparent;padding-bottom:3px}.genre{white-space:nowrap;background:transparent;border:1px solid #403d49;color:#b3acbb;border-radius:40px;padding:10px 14px;font-size:11px;font-weight:700}.genre.selected{color:#211728;border-color:#c1a2ed;background:#c1a2ed}.statusbar{display:flex;align-items:center;justify-content:space-between;margin:27px 0 16px;color:#908d9b;font-size:12px}.muted-link{color:#c0a4e7;background:none;border:0;font-size:11px}.movie-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;min-height:200px}.movie-card{min-width:0;border:1px solid #302e3a;background:#181821;border-radius:15px;overflow:hidden;transition:transform .22s,border-color .22s}.movie-card:hover{transform:translateY(-4px);border-color:#8d70b4}.cover{height:190px;position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:16px;overflow:hidden;background:linear-gradient(145deg,var(--cover-a),var(--cover-b))}.cover:before{content:"";position:absolute;inset:-25%;background:radial-gradient(circle at 65% 30%,#ffffff20,transparent 31%),linear-gradient(55deg,transparent 39%,#ffffff12 40%,transparent 41%);transform:rotate(10deg)}.cover:after{content:"";position:absolute;right:-40px;bottom:-82px;width:200px;height:200px;border:30px solid #ffffff16;border-radius:50%;box-shadow:0 0 0 29px #ffffff09}.cover-top,.cover-title,.cover-bottom{position:relative;z-index:1}.cover-top{font-size:9px;font-weight:800;letter-spacing:.22em;opacity:.7}.cover-title{font-size:clamp(22px,2vw,32px);line-height:1.06;letter-spacing:-.055em;font-weight:900;max-width:200px;overflow-wrap:break-word;text-shadow:0 2px 20px #0006}.cover-bottom{font-size:10px;opacity:.8;letter-spacing:.18em}.favorite-btn{position:absolute;top:12px;right:12px;z-index:2;background:#0a0914b3;backdrop-filter:blur(9px);width:34px;height:34px;border:1px solid #ffffff48;border-radius:50%;font-size:19px;color:#eee;display:grid;place-items:center;line-height:1}.favorite-btn.selected{color:#f3a3c2;background:#3c2138dd}.card-body{padding:15px 16px 16px}.card-tags{display:flex;gap:5px;flex-wrap:wrap;min-height:21px}.card-tags span{font-size:9px;font-weight:800;color:#c9b6e4;background:#a48bc11d;border-radius:5px;padding:3px 6px}.card-title{display:flex;justify-content:space-between;align-items:baseline;gap:7px;margin:11px 0 5px}.card-title h3{font-size:16px;line-height:1.25;margin:0;letter-spacing:-.02em}.card-title small{font-size:11px;color:#9996a5;flex:0 0 auto}.card-description{color:#a5a2b1;font-size:11px;line-height:1.55;height:50px;overflow:hidden;margin:8px 0 15px}.card-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #34313b;padding-top:12px;gap:5px}.reason{font-size:10px;color:#aa99c3}.detail-link{color:#d2b5f8;font-size:11px;font-weight:800;background:none;border:0;white-space:nowrap}.empty{border:1px dashed #60536c;background:#1b1924;border-radius:20px;text-align:center;padding:48px 25px}.empty-icon{font-size:40px;color:#c6a8f2}.empty h3{font-size:24px;margin:5px 0}.empty p{color:#a8a4b3}.hidden{display:none!important}.how{margin:95px 0 25px;padding:42px 40px;background:linear-gradient(115deg,#242231,#191922);border:1px solid #393344;border-radius:22px}.how h2{font-size:34px}.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:32px}.how-grid>div{border-top:1px solid #5d5166;padding-top:18px}.how-grid span{color:#d0adef;font-weight:850}.how-grid h3{font-size:15px;margin:14px 0 7px}.how-grid p{font-size:12px;color:#a5a0af;line-height:1.8;margin:0}footer{display:flex;gap:20px;align-items:center;justify-content:space-between;border-top:1px solid #292833;padding:30px 0 38px;color:#878391;font-size:11px}footer strong{font-size:17px;color:#e5d6fa;letter-spacing:.2em}footer strong span{color:#cba5f6}.modal{position:fixed;max-height:min(88vh,920px);width:min(610px,calc(100vw - 28px));border:1px solid #62516f;border-radius:20px;background:#1a1924;color:#f2eff7;padding:0;box-shadow:0 26px 100px #000b;overflow:auto}.modal::backdrop{background:#03040ad6;backdrop-filter:blur(5px)}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:17px}.modal-head h2{font-size:27px;margin:3px 0 0}.close-button{border:1px solid #51485c;background:#ffffff0a;border-radius:50%;color:white;width:35px;height:35px;font-size:15px;flex:0 0 auto}.profile-modal,.taste-modal{padding:28px}.info-text{color:#aaa7b5;font-size:13px}.profile-row{display:flex;align-items:center;gap:12px;border:1px solid #3e3947;border-radius:13px;padding:12px 13px;margin-top:9px}.profile-row .avatar{width:37px;height:37px}.profile-row .profile-info{flex:1}.profile-row strong{display:block}.profile-row small{display:block;color:#9e99aa}.profile-row button{background:none;color:#cfb2f7;border:0;font-size:12px;font-weight:800;padding:8px}.profile-row button.danger{color:#d59aaa}.new-profile{margin-top:22px;border-top:1px solid #37303f;padding-top:17px}.new-profile label{font-size:12px;font-weight:750;display:block;margin-bottom:8px}.new-profile>div{display:flex;gap:10px}.new-profile input{min-width:0;flex:1;background:#100f18;color:#fff;border:1px solid #544b61;border-radius:9px;padding:12px}.small-heading{margin-top:23px;font-size:14px}.provider-options{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.provider-option{background:#282531;border:1px solid #554c63;border-radius:10px;padding:12px;color:#f1eafa;text-align:left;font-size:12px}.provider-option.selected{border-color:#cba9fc;background:#453554}.provider-option span{float:right}.separator{height:1px;background:#3a3542;margin-top:28px}.fine{font-size:11px}.taste-tag{display:inline-block;color:#dcc3fe;background:#a58ace23;border:1px solid #9a7ec853;border-radius:30px;font-size:12px;padding:7px 11px;margin:5px 6px 3px 0}.taste-metric{border:1px solid #433b4e;border-radius:13px;padding:14px;margin:16px 0}.taste-metric strong{display:block;font-size:28px}.taste-metric span{font-size:11px;color:#ac9fb5}.detail-content{padding:0 28px 28px}.detail-cover{position:relative;min-height:205px;background:linear-gradient(120deg,var(--cover-a),var(--cover-b));padding:24px 28px;display:flex;align-items:end;overflow:hidden}.detail-cover:after{content:"";position:absolute;right:-60px;bottom:-95px;width:250px;height:250px;border:55px solid #ffffff13;border-radius:50%}.detail-cover h2{font-size:clamp(30px,6vw,48px);line-height:1.07;max-width:430px;margin:0;text-shadow:0 8px 28px #0009;position:relative;z-index:1}.detail-close{position:absolute;right:15px;top:15px;z-index:2}.detail-label{color:#cbb2ed;font-size:11px;letter-spacing:.13em;font-weight:850;margin:22px 0 7px}.detail-description{color:#d6d1db;font-size:14px;line-height:1.75}.detail-meta{color:#aaa5b5;font-size:12px;margin:12px 0}.detail-tags{display:flex;gap:7px;flex-wrap:wrap;margin:13px 0}.detail-tags span{background:#453750;border-radius:7px;padding:4px 8px;font-size:11px}.stream-box{background:#25222f;border:1px solid #484050;border-radius:13px;padding:15px;margin-top:22px}.stream-box p{font-size:12px;color:#b1abbb;line-height:1.6}.stream-box .btn{width:100%;display:block;text-align:center}.provider-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.provider-links a{border:1px solid #514b5b;border-radius:7px;color:#d3cbe0;padding:5px 9px;font-size:11px}.detail-actions{display:flex;gap:9px;margin-top:16px}.detail-actions .btn{flex:1}.match-score{font-size:12px;color:#cbb0f6;font-weight:800}
@media(max-width:1100px){.shell{padding:0 30px}.hero-art{transform:scale(.85);transform-origin:center}.movie-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.filters{flex-direction:column;align-items:stretch}.search-wrap{flex:unset;width:100%}.genre-strip{width:100%}.hero h1{font-size:49px}}@media(max-width:750px){.shell{padding:0 19px}.topbar{height:75px}.test-badge{display:none}.brandmark{height:40px;width:40px;font-size:26px}.brand-words strong{font-size:17px}.header-right{gap:8px}.profile-pill{padding-right:8px}.profile-pill #profileName{max-width:85px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hero{display:flex;min-height:unset;flex-direction:column;align-items:stretch;padding:48px 0 37px}.hero h1{font-size:clamp(36px,8.5vw,54px)}.hero p{font-size:14px}.hero-art{height:260px;transform:scale(.66);transform-origin:top center;width:420px;align-self:center;margin-top:32px;margin-bottom:-76px}.art-frame-front{left:55px}.art-frame-back{right:0}.section-top{flex-direction:column;align-items:start;padding-top:33px}.section-top h2{font-size:27px}.switcher{width:100%}.tab{flex:1;padding:11px 6px}.filters{margin-top:12px}.movie-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.cover{height:173px;padding:11px}.cover-title{font-size:clamp(20px,5.4vw,30px)}.card-body{padding:12px}.card-title{margin-top:7px}.card-title h3{font-size:13px}.card-description{font-size:10px;height:46px}.card-tags span{font-size:8px}.card-bottom{align-items:start}.reason{font-size:9px}.detail-link{font-size:10px}.how{padding:25px 22px;margin-top:53px}.how-grid{grid-template-columns:1fr;gap:18px}.how h2{font-size:28px}footer{flex-direction:column;align-items:start;gap:7px}}@media(max-width:385px){.movie-grid{grid-template-columns:1fr}.cover{height:220px}.card-title h3{font-size:17px}.hero-actions{gap:7px}.btn{padding:12px 13px}.profile-pill{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* Aanvullingen PWA-versie */
.status-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.provider-link-label{border:1px solid #514b5b;border-radius:7px;color:#d3cbe0;padding:5px 9px;font-size:11px}.active-label{color:#e2c8fc;font-weight:800;font-size:12px}.add-movie-form{display:flex;flex-direction:column;gap:10px}.add-movie-form label{font-size:12px;font-weight:700;margin-top:3px}.add-movie-form input,.add-movie-form textarea,.add-movie-form select{border:1px solid #544b61;border-radius:9px;padding:12px;background:#100f18;color:#f3edf9;font:inherit;width:100%}.add-movie-form .btn{margin-top:14px}.detail-actions .btn{min-height:44px}.stream-box .btn{white-space:normal}.movie-card .favorite-btn:focus-visible{outline:3px solid white}
@media(max-width:750px){.statusbar{align-items:flex-start;gap:10px}.status-actions{justify-content:flex-end;gap:10px}.status-actions .muted-link{font-size:10px}.detail-content{padding:0 17px 22px}.detail-cover{padding:22px 18px}.profile-modal,.taste-modal{padding:19px}}

/* Trailerfunctie, versie 2 */
.card-links{display:flex;flex-wrap:wrap;gap:9px;justify-content:flex-end;align-items:center}
.trailer-box{background:linear-gradient(140deg,#33273d,#1f2031);border:1px solid #725a88;border-radius:14px;padding:16px;margin-top:22px}
.trailer-box>strong{font-size:15px}
.trailer-box p{font-size:12px;color:#c0b6cc;line-height:1.65}
.trailer-frame{margin:12px 0 10px;aspect-ratio:16/9;background:radial-gradient(circle at 50% 50%,#4d365a,#10101a);display:flex;align-items:center;justify-content:center;border-radius:11px;overflow:hidden;border:1px solid #5e516d}
.trailer-frame iframe{border:0;width:100%;height:100%;display:block}
.btn-trailer{background:#c5a4fa;color:#160e25;border:0;font-weight:900;padding:13px 17px;border-radius:10px;font-size:13px}
.trailer-empty{font-size:12px;color:#c4bacb;text-align:center;padding:16px}
.trailer-external{display:inline-block;color:#dabdff;font-size:13px;font-weight:800;margin:3px 0 2px}
.trailer-box .trailer-footnote{font-size:10px;color:#a9a0b1;margin-bottom:0}
@media(max-width:750px){.card-links{gap:7px}.card-links .detail-link{font-size:10px}.card-bottom{gap:8px}.trailer-box{padding:13px}}