@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@400;500;600;700&family=Nunito:wght@400;500;600;700;800&display=swap');

:root {
  --pink: #d979a3;
  --deep: #995675;
  --ink: #75566a;
  --cream: #fffaf7;
  --glass: rgba(255,255,255,.78);
}
* { box-sizing:border-box; }
body {
  margin:0; min-height:100vh; color:var(--ink);
  font-family:'Nunito',sans-serif;
  background:#f9e5ed;
}
button { font:inherit; cursor:pointer; }
.hidden { display:none!important; }

.welcome {
  min-height:100vh; display:grid; place-items:center; padding:24px;
  background:
    radial-gradient(circle at 15% 20%,#fff9 0 8%,transparent 30%),
    radial-gradient(circle at 85% 80%,#edbad0 0 5%,transparent 32%),
    linear-gradient(135deg,#fcebf1,#f5d5e3 50%,#f9e9e5);
}
.welcome-card {
  width:min(440px,100%); text-align:center; padding:42px 34px;
  border:1px solid #fff; border-radius:30px;
  background:rgba(255,255,255,.76);
  box-shadow:0 24px 70px #a85d8020;
  backdrop-filter:blur(18px);
}
.brand-flower { font-size:42px; color:#dc8bad; }
.eyebrow,.note-small { letter-spacing:3px; font-size:9px; color:#bd83a0; font-weight:800; }
h1 { font:700 42px 'Comfortaa',sans-serif; color:#c66f98; margin:12px 0; }
.welcome-card>p { color:#a98799; font-size:14px; }
.profile-list { display:grid; gap:12px; margin:30px 0 24px; }
.profile-choice {
  display:flex; align-items:center; gap:14px; text-align:left;
  width:100%; border:1px solid #f4dce7; border-radius:17px;
  padding:13px 16px; background:#fffafc; color:var(--ink);
  transition:.2s;
}
.profile-choice:hover { transform:translateY(-3px); box-shadow:0 8px 22px #c47b9c25; border-color:#e8b7cd; }
.avatar { width:44px;height:44px;display:grid;place-items:center;background:#fae8f0;border-radius:14px;font-size:23px; }
.profile-choice b,.profile-choice small { display:block; }
.profile-choice b { font-size:14px; }
.profile-choice small { color:#b294a3; font-size:11px; margin-top:3px; }
.choice-arrow { margin-left:auto; color:#d78aaa; font-size:21px; }
.welcome-foot { font-size:11px; color:#c39bad; }

.desktop {
  min-height:100vh; position:relative; overflow:hidden;
  background:
    radial-gradient(ellipse at 15% 85%,#f8cbdc 0,transparent 38%),
    radial-gradient(ellipse at 85% 15%,#fff6ed 0,transparent 42%),
    linear-gradient(135deg,#f7dce8,#fbece9 52%,#edc8dc);
}
.desktop:before,.desktop:after {
  content:"✿"; position:absolute; color:#fff8; font-size:230px; pointer-events:none;
}
.desktop:before { right:5%;top:13%;transform:rotate(18deg); }
.desktop:after { left:4%;bottom:12%;font-size:150px;transform:rotate(-18deg); }
.topbar {
  height:64px; position:relative; z-index:2; display:flex; align-items:center;
  padding:0 28px; background:#fff9; border-bottom:1px solid #fff;
  backdrop-filter:blur(14px);
}
.mini-brand { font:700 17px 'Comfortaa'; color:#bd6f94; }
.mini-brand span { font-size:23px; margin-right:7px; }
.top-message { margin:auto; color:#b38c9e; font-size:12px; }
.profile-switch { border:1px solid #f0d6e2; background:#fff9; color:#98647e; border-radius:20px;padding:8px 13px; }
.workspace { position:relative; z-index:1; max-width:1100px; margin:auto; padding:54px 42px 100px; }
.welcome-note { margin-bottom:35px; }
.welcome-note h2 { font:600 30px 'Comfortaa'; color:#a85f82; margin:12px 0 7px; }
.welcome-note p { margin:0;color:#a98497;font-size:14px; }
.app-grid { display:grid; grid-template-columns:repeat(4,minmax(100px,135px)); gap:18px; }
.app-icon {
  min-height:120px; border:1px solid #fff9; border-radius:22px;
  background:#fff8; color:#91657d; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:10px;
  box-shadow:0 8px 24px #a9668420; transition:.2s;
}
.app-icon:hover { transform:translateY(-5px);background:#fff;box-shadow:0 14px 28px #a9668430; }
.app-emoji { font-size:34px; }
.app-icon>span:last-child { font-size:12px;font-weight:800; }
.desktop-quote {
  margin-top:60px; color:#b17d97; font:500 15px 'Comfortaa';
  display:flex;gap:12px;align-items:center;
}
.desktop-quote span { font-size:28px;color:#d48bab; }

.taskbar {
  position:fixed;z-index:20;bottom:0;left:0;right:0;height:62px;
  display:flex;align-items:center;gap:14px;padding:0 22px;
  background:#fffC;border-top:1px solid #fff;
  backdrop-filter:blur(18px);
}
.start-button { border:0;background:#f6dce8;color:#c16f96;border-radius:13px;width:40px;height:40px;font-size:23px; }
.taskbar-label { font:600 12px 'Comfortaa';color:#a87590; }
.taskbar-spacer { flex:1; }
.taskbar-date,.taskbar-clock { font-size:12px;color:#956b82; }
.taskbar-clock { font-weight:800;min-width:48px; }

.app-window {
  position:absolute;z-index:5;top:160px;left:42%;
  width:min(420px,calc(100vw - 28px));min-height:230px;
  border:1px solid #fff;border-radius:19px;overflow:hidden;
  background:#fffF;box-shadow:0 20px 60px #81506b35;
}
.window-head {
  display:flex;align-items:center;justify-content:space-between;
  padding:13px 16px;background:#fceaf1;cursor:move;
  color:#9f6380;font-weight:800;font-size:13px;
}
.window-close { border:0;background:#f5d2e1;color:#a55d80;border-radius:50%;width:26px;height:26px; }
.window-body { padding:20px;color:#806176; }
.window-body input,.window-body textarea {
  width:100%;border:1px solid #efd9e4;border-radius:10px;padding:11px;
  background:#fffafd;color:#76566a;font:inherit;margin:5px 0 10px;
}
.window-body textarea { min-height:100px;resize:vertical; }
.soft-button {
  border:0;border-radius:12px;padding:10px 16px;
  color:white;background:linear-gradient(135deg,#dc91b0,#bd7197);font-weight:800;
}
.timer-number { text-align:center;font:700 48px 'Comfortaa';color:#c16f96;margin:15px; }
.saved-list { margin-top:12px; }
.saved-item { padding:9px;border-bottom:1px solid #f5e4ec;font-size:13px; }
@media(max-width:650px) {
  .topbar { padding:0 14px; }
  .top-message { display:none; }
  .workspace { padding:38px 20px 100px; }
  .welcome-note h2 { font-size:24px; }
  .app-grid { grid-template-columns:repeat(2,minmax(100px,1fr));gap:12px; }
  .app-icon { min-height:105px; }
  .desktop-quote { margin-top:35px;font-size:12px; }
  .taskbar { padding:0 12px; }
  .app-window { left:14px!important;top:115px!important;width:calc(100vw - 28px); }
}